Last Planet: The Iterations for the Design


Iterations of the prototype

The initial state of the creation of the program for quick and dirty testing, was a quick mock up, not yet realising the finished prototype, and with the basic labels of Male and Female. It has the time and date noted and the colours along the bottom, which were able to create colour circles as they were buttons.

Prototype

The prototype was tested with the colours of circles, the variance of alpha transparency and how the sizes would work aesthetically. At this early stage, it was still labelled as Male and Female and this was one area examined. In this phase as well, initially, the button selection to enter Male or Female appeared where you touched the screen.

Prototype

Testing at this point also noted that the colour bar along the bottom felt awkward for some users. When they tapped the screen it became hidden behind the Male and Female buttons in order to reduce screen clutter but they felt it was too much movement. This was altered so the colours appeared and stayed at the top of the screen as seen in figure 36.

Prototype

The second phase of testing shows changes to the screen from the too generic and uninteresting Male and Female labels to the name of the person using the device.

prototype

This involved a textField:

The next iteration involved having a textField for them to type their name into. The program would register the touch and show the textField.

prototype

First Step
// FIRST STEP IN THE APP, user touches the screen which will show the textField

- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event  {

UITouch *touch = [touches anyObject];

// ********** GET THE LOCATION THAT WAS TOUCHED ************* //

CGPoint point = [touch locationInView:self.view];

NSLog(@"X location: %f", point.x);

NSLog(@"Y Location: %f",point.y);

if (point.x >= 819) { // setting the maximun and minimum so the text is always readable

point.x = 818;

}

if (point.y >= 390) {

point.y = 389;

}

[self hideButtons];

// SHOWS A BACKING IMAGE TO "DIM" THE SCREEN SO THEY CAN SEE THE TEXT FIELD

_textFieldBackImagewhenTyping.hidden = NO;

[self.view addSubview:_textFieldBackImagewhenTyping];

_textField.hidden = NO; // show the textField

//_textField.text = @" What's your name? ";

_textField.frame = CGRectMake(point.x, point.y -20, 250, 40);

[self.view addSubview:_textField]; // places the textField above all others

_textField.delegate = self;

[_textField becomeFirstResponder];
}

2 thoughts on “Last Planet: The Iterations for the Design

Comments are closed.