Basics : User Experience (UX)

User experience is all around us – not just limited to apps/websites.
A design should always be focused on function rather than purely form.

1. The user should be able to complete the task for which he had downloaded the app super fast. Ex – : If your app gives live bitcoin price – it should show that as soon as the app launches. No beating around the bush and wasitng the users time.

2. Always ask for permission from the user.

3. Think deeply about what is your target audience & how your users will actually use it.

4. If you are having any doubts – Always choose FUNCTION over FORM.

5. Be consistent with your deisgn/functionality throughout the app.

6. Ask yourself, can you make the functionality/design simpler? The end product should be simple for the user to use and yet it should serve its full purpose.

7. Don’t make life difficult for the users.

8. It should be intuitive. It should be really easy for users to understand how your app works and how to go about it without you having to teach them. (For the most part.)

9. Don’t make your users feel stupid – Don’t add useless popups re-confirming actions. Let your users breathe. (Example -: When you add something to your cart @ a shopping website it shows you a popup that item added to card – continue shopping etc.)

Design Fundamentals

Color Theory (Short notes)

We are able to see different colors and associate different feelings with it.

Red : Love – Energy – Intensity

Yellow : Joy – Happy – Intelect – Attention Grabbing (Good for App Icon – App Screenshot – So that user catches your app while scrolling via the store.)

Blue : Stability – Trust

Green : Freshness – Safety – Growth

Purple : Royalty – Wealth – Feminity

Analagous Colors -: Choosing one color from the color wheel and then choosing the adjacent color in combination.

Complementary Colors : Choosing colors via two opposite ends of color wheel.

Good website for choosing color scheme for web/app design :
colorhunt.com
flatUIcolors.com
materialpalette.com

_______________________________________________________________

Typography

Serif & Sans-Serif work well together.

Try to use the mood of the type face in sync with your app.

Free fonts – https://www.fontsquirrel.com/

Machine Learning : Introduction

The field of study that gives computers the ability to learn without being explicitly programmed. – Arthur Samuel

It’s split into two broad ares :

  1. Supervised Machine Learning
  2. Unsupervised Machine Learning

Supervised Machine Learning : You feed the model with training data based on which it gives you the output (Feeding the model various pictures of cats and training it to recognise cats.)

Unsupervised Machine Learning : You feed the model with unstructured data and it makes sense of it and tries to structure it by creating clusters. (People you may know feature on Facebook.)

What is Reinforcement Learning?

In a nutshell it trains the algorithm based on a system of rewards and punishments. (Where the program wants to maximise its reward by interacting with the environment)


One of the Model for Machine Learning  : Inception v3

As per Apple’s website: Inception v3 “Detects the dominant objects present in an image from a set of 1000 categories such as trees, animals, food, vehicles, people, and more.”


For beginners , its best to use one of the pre-trained models!

  • Learned how to use the Inception V3 CoreML model.
  • Let user click a photo or choose a photo from library.
  • The model then accesses the Photo and then prints the best / most accurate prediction.

Taking a breather! – Practicing what I’ve learned.

Phew! So I started this course on 20th November and It was a smooth ride up until now. Till now I had no issues in grasping the concepts and I was able to understand everything pretty easily. The complexity of the course keeps on increasing and I feel I should now take a break and review everything that I’ve learned earlier before continuing. Currently I got stuck while understanding Protocols and delegates.

Hence I have decided to take a break and revise everything I have learned till now and create a couple of simple apps using those concepts. I’ve given myself a target – I want to revise create those 2 simple apps till 23rd December. After that I’ll resume the course!

Topics that I’ve covered till now :

  1. Interacting with Xcode – Placing UI elements and editing them.
  2. Manipulating UI elements using Code. (Labels, Images, Buttons etc)
  3. Variables, Constants & Functions
  4. Arrays
  5. Conditional Statements
  6. Loops
  7. Playing sound in Swift
  8. Do / Catch statement
  9. Classes & Objects.
  10. Model View Controller
  11. Initializers, Enumeration & Inheritance
  12. Protocols & Delegates

Classes, Objects, Initializers, Enumeration & Inheritance.

This post contains certain important aspects like basics of creating classes and objects and other relevant material.

Create a class

// Created a class and set its properties.

class Car {

var color : "Black"
var seats : 5

}

Enumeration : Basically creating a new data type.

// creating an enum

enum CarType {
case Sedan
case Coupe
case Hatchback
}


// Further can be used in class - example 

class Car {
        
    var color = "Black"
    var numberOfSeats : Int = 5
    
    // Using the data type created using enum
    
    var typeOfCar : CarType = .Coupe
}

Designated initializers

class Car {
    
    var color = "Black"
    var numberOfSeats : Int = 5
   

    var typeOfCar : CarType = .Coupe
    
    // Creating an initialiser which is designated(compulsory)
    
    init(customerChosenColor : String) {
        color = customerChosenColor
    }
}

Convenience initializers

class Car {
    
    var color = "Black"
    var numberOfSeats : Int = 5
   
    var typeOfCar : CarType = .Coupe

    
    init(customerChosenColor : String) {
        color = customerChosenColor
    }
 
 
 // Creating convenience init - using it is not compulsory when creating an object
    
    convenience init(customerChosenColor : String) {
        self.init()
        color = customerChosenColor
    }
}

Creating a method for the class

enum CarType {
    
    case Sedan
    case Coupe
    case Hatchback
    
}



class Car {
    
    
    var color = "Black"
    var numberOfSeats : Int = 5
    

    
    var typeOfCar : CarType = .Coupe
    
    
  
    
    init(customerChosenColor : String) {
        color = customerChosenColor
    }
 

    
    convenience init(customerChosenColor : String) {
        self.init()
        color = customerChosenColor
    }

// Method created 
    
    func drive() {
        print("car is moving.")
    }
    
    
}

 

Creating the Object

// Creating a new object

let myCar = Car()
let richGuysCars = Car(customerChosenColor: "Red")

// Printing properties of the class

print(myCar.color)
print(myCar.numberOfSeats)
print(myCar.typeOfCar)


// method drive is only associated with myCar Object

myCar.drive()

 

Inheritance : Class – In Swift

// Class inherit. SelfDrive class inherits the Car class and the method in the class car called drive()

class SelfDrive : Car {
    
    var destination : String = "Apple Store"
    
    override func drive() {

// super.drive() means adding the default functionality to the override being performed.
        super.drive()
        
        print("Driving to " + destination)
    }
    
}

 

 

Classes, Objects & Model View Controller (MVC)

MVC – Model View Controller

The Model :  Where your data resides.

The View: What the user sees – view of your app.

The Controller: Used to facilitate communication between the model and the view.

Class & Objects

  • Class is a blueprint used to create objects.
  • Class contains the specifications and the object is something which is actually created using those specifications.
  • Properties : Variables and constants inside the classMethods : Function created inside the class are called Methods
  • Init used to create an event which describes what should be done when an object is created using the class.
import Foundation

class Question {
    
    let questionText : String
    let answer : Bool
    
    init(text: String, correctAnswer: Bool) {
    
    questionText = text
    answer = correctAnswer
    
    }
    
}

 

How to hide a button / Change text value of the button via code : 

// buttonName = name of the button
// variable - holds the string which we want the button to show
// .normal refers to the state

buttonName.setTitle(variable, for: .normal)


// How to hide the button

buttonName.isHidden = true

 

Loops & Playing sound in Swift

What I learned today:

  • Basics – Loops.
  • Each button in Xcode has a tag.
  • Basics – Do/Catch Statement.
  • Playing sound in Swift.
  • Global & Local Scope

 

Loops

// Will print numbers in a loop

for number in 1...100 {

print(number)

}


// Starts from reverse

for number in (1...100).reversed {

print(number)

}

Buttons – Tags

Each button in Xcode has a tag. We can use sender.tag to get information regarding which button was pressed.

// Print to the console which button was pressed

print(sender.tag)

// Perform different tasks as per different button pressed 

if sender.tag == 1 {
print("You pressed button one.")
} else if sender.tag == 2 {
print("You pressed button two.")
} else {
print("You pressed the other button.")
}

  • Extra : If you need to know anything about a function which you don’t understand in Xcode, you can hold alt key in Mac and click on that function and Xcode will display it’s details.

Global & Local Scope

  • If a variable is declared inside a function then it is considered to have local scope, which means it cannot be used outside that function.
  • Global scope – the variable is declared normally outside any function and can be detected by Xcode and used throughout the code.

Do/Catch Statement

// Try to do something. If not possible then throw an error.

do {
try
} catch {
print(error)
}

Playing sound in Swift

// Firstly we need to import AudioToolBox

import AudioToolbox

// nameofsoundfile refers to the filname, extension can be .wav, .mp3 etc

if let soundURL = Bundle.main.url(forResource: "nameofsoundfile", withExtension: "wav") {
            
            var mySound: SystemSoundID = 0
            AudioServicesCreateSystemSoundID(soundURL as CFURL, &mySound)
            // Play
            AudioServicesPlaySystemSound(mySound);
      

 

Basic BMI Calculator : Functions, Conditional Statement.

In todays lecture I covered the basics of functions, conditional statements, comments and printing stuff.

Here is the code I wrote to calculate the BMI of a person.

import UIKit


func calculateBmi(weight: Double, height: Double) -> String {
    
    var finalBmi = weight / (height * height)
    
    let shortBmi = String(format: "%.2f", finalBmi)
    
    if finalBmi > 25 {
        return "Your BMI is \(shortBmi) , you are overweight."
    } else if finalBmi > 18.5 && finalBmi <= 25 {
        return "Your BMI is \(shortBmi) , you have a normal weight."
        
    } else {
        
        return "Your BMI is \(shortBmi) , you are underweight."
    }
    
}


print(calculateBmi(weight: 85, height: 1.8))

The formulae used for calculating the BMI is -: weight(kg) / height(in meters) * height(in meters)

What the code basically does:

  • Creates a function which takes weight and height as input. (used double instead of Int, to facilitate use of decimals)
  • finalBmi contains the method of calculating BMI
  • shortBmi basically restricts the output to 2 decimal places
  • If BMI is greater than 25 then return a certain statement to the user, if not then return another statement.
  • Finally used print to log the output to the console.

 

Creating a dice rolling app : Variables, Arrays & Constants.

So today I covered a lot of different aspects ranging from Variables, arrays, constants to motion gestures. Below I am typing a few things I thought were most important.

  • While connecting a label/image from the Storyboard to the code editor we see the word “IBoutlet”, which means Interface Builder outlet.
  • Connection type for buttons is both action and outlet , whereas in case of labels and images it is only outlet. (As buttons can be used to obtain user input and perform an action afterwards.)

Declaring a variable:

Declaring a constant:

let fixedAmount : Int = 10 

The difference between declaring a normal variable and using “let” to declare a constant is that we can change the value of the normal variable even after declaring it in subsequent lines of code, but we cannot change the value of a constant. It is fixed.

  • If we change the variable name after we have connected it in our code, then we also need to remove the connection and reconnect it to our code.

Declaring a string:

var myName : String = ‘Prateek’

Array: 

var myArray = [‘itemone’, ‘itemtwo’, ‘itemthree’]

Generating random number:

Int(arc4random_uniform(5)) 

  • In the above example I have wrapped the arc4random_uniform() into Int() so that Xcode treats it as in integer. Also, it will generate a random number upto 5.

Function – Declaring:

func myNewFunction() { your code goes here }

Function – Calling: 

myNewFunction()

Changing Image element using code:

myImageElement.image = UIImage(named: filename)

  • In the above snipped, myImageElement is the name of your variable and filename refers to the name of the image file.

Creating a dice rolling app:

  1. Added the Buttons, labels and images to the storyboard.
  2. Linked them to the View Controller file.
  3. Declared a variable holding an int value of 0
  4. Declaring an array filled with the file names of the images.
  5. Set the variable declared in step 3 to generate a random number.
  6. Used the code mentioned above to change the image element to the array of file names selected randomly using the variable in step 5.
  7. Step 5 & 6 were executed in the button function code.

Shake Gesture:

  • Type motionEnded and hit enter, and Xcode will automatically write the full code. Now place the code you want to execute on shake gesture inside the curly brackets.

 

The basics – Adding labels & images.

This post will be probably very boring, but I did not want to miss the first day – hence I am still writing this. Although, everything I did today was pretty basic. I have mentioned some important takeaways below-:

Model View Controller.

Only about 2-3 minutes were spent discussing this but it will be covered in a later section of the course. Right now what I gathered was -:

View refers to the what the user actually gets to see on his/her screen.

Controller handles what to do when the button is pressed.

Model contains the logic and performs the calculations.

Data – Actual data

Shortcuts worth remembering -:

Cmd + D : Duplicate the label/object selected.

Cmd + = : Label/Object resized to display  itself in entirety.

Placing Elements -:

X axis – Horizontal Placement

Y axis – Vertical Placement

Pixel (Picture element) a single dot in your image.

Pt (Point) is a unit of length, 1pt is equal to 1/72th of an inch.