#appdesignprocess

[maddysdesignprocess]

Here is the final Timothy’s App design. Since I did a lot of mockup pages for the app, I was able to just go in and pick out which ones I liked most and used them for the final. The only changes I made from the mockup was making the text slightly bolder, because at the small scale I have the pages at, the text kinda faded out and looked super slim and tiny. I’m very pleased with the design and I hope you are too!

[maddysdesignprocess]

Next, I added colour, images and text over the wireframes and made all these mockup pages. I knew from the start I wanted the app to be dominantly white coloured, because it feels welcoming, breathable and not so serious. I also decided to use the Timothy’s blue and red as spot colours in this case, and to divide content. I tried a few different backgrounds with the start of the app to see what worked, and I liked the flat white background. I continued with that style throughout the other pages. In regards to text, I started using Market Deco (Timothy’s logo text) as headers at first, but it looked too serious and I didn’t really like it. I started looking through dafont.com for some fun coffeehouse fonts and found one I liked, and decided to use it as headings for products and promotions. I also started using Helvetica as body text and again didn’t like the look, so I found another font for the app’s body text that went nicely with the new heading font. Everything that came after those decisions came easily because I had ideas of what I wanted content, lists and product promotions to look like. I just went with it. I did continue to look at competitor app’s for inspiration for things such as forms and navigation. 

After I finished the pages, I went on to try icons for the app. I started with my original logo with different browns as backgrounds, but I thought they looked ugly and plain. I then decided to try adding some colour, and ended up with the blue-red gradient icon that I chose to use. Ultimately I thought that the Timothy’s O is still recognizable as just that, so making a few minor changes for the sake of the app icon was okay.

[maddysdesignprocess]

I started the App Design project by writing down what I wanted the purpose of the app to be. I decided that this app will be used to order and pay for your Timothy’s drinks, as well as collect points and keep up-to-date with promotions and new products. I then looked into competitor’s apps and found that the app layouts are similar, just with different designs, colours, etc. I then did a few sketches of wireframes and potential layouts for pages in the app. I stuck to getting main ideas down, and brought them into Illustrator.