You Are Reading

How To // Creating the App Interface

As we had previously decided to go with this luxurious sleek white on black look i moved on to designing the interface of the actual app.

From research, i had seen that most apps had a little bar at the bottom with different buttons. On the whole there is usually a button that takes you back to the home page, which i have created. For this app, I also thought it would be really useful just to have a back arrow icon on the bar which would take the user back a page to where they had previously come from (just like a website). For now, that is the only buttons i have included but maybe after further discussions with my group, i could add another one or two buttons.

I started by creating the base for my interface. This will be a 'Wisdom Script' headline font because this represents class and sophistication...


For the sub heading we all decided to go with Bebas. This is a clear font that also shows sophistication but is really bold and easy to look at straight away....


After problems i had in my previous project with body copy, i decided to go for a universal font that is easier to read in body copy than others. I went with Helvetica Bold. A classic font!


As for the actual layout. I wanted to create a bar at the bottom of the app in the same style as the icons with the classy white gradient...


As you can see this is the basic layout i will be going with. The app needs to be kept consistent througout. for example the type of course, the placement of the buttons, the placement of the type, the simple imagery like the ones i have already created. 

After i had sorted this problem out, i then moved on to looking how the icon would sit in a iphone menu and also the first page that would come up when you click on the icon. This page needed to conceal the app and also contain a username, password and a sign in button...



I placed the icon i created into an image of the iphone menu. 
The 'Diamonds' icon is how it would sit in the menu.




The challenge of creating the home page and icon was concealing the app so that the partner would not know what you was up to. However the design still had to link with everything else and give enough away for the user to know what and where it is. 

i decided eventually to just go with the logo of the diamond that i had used on the icon with the simple curved boxes for the username, password and sign in button. 

the idea of the user name and password being in grey is so that the person would type in black over it which would let them know what they are doing. 










Comments for this entry

Leave your comment

 

Copyright 2010. All rights reserved.

RSS Feed. This blog is proudly powered by Blogger and uses Modern Clix, a theme by Rodrigo Galindez. Modern Clix blogger template by Introblogger.