Test 1

Test 1

So once I sketched out a rough storyboard to see how my app would animate, I went ahead and started to put it together.

After watching it back a few times, there were a few things wrong with it, firstly the timing was all over the place, the fonts were different and differently animated, however what I noticed the most was that the phone itself was static, it was to cliche, it didn't move.

I reversed the roles, and I was thinking what if I wanted to know about the app, I would be bored.

Below are my video examples.

Movement

Movement

Whilst I started to produce my animation the one thing that has been lacking is the movement of the phone itself, I have fallen into the trap of doing the cliche thing of keeping the phone static whilst I demonstrate how the pages work.

It's too simple and boring.

I drew out a quick storyboard to outline the movement of how the phone should animate within the animation and what pages should animate too.

Reference

Reference

To get an idea and a clear understanding of how I want my app advert to look, I love the style of the apple adverts. quick, simple, fast paced and shows the product off very well.

Page Layout

Page Layout

Now that I have designed all my pages, the icons, the next step is too create the animation.

First and foremost the trick for creating a simple, direct animation for my app is that I don't need to show everything that goes on through my app, if i was to show everything the animation would be boring and slow. 

So what I started to do was to create a quick storyboard to see the orientation of my animation, I choose certain aspects of my app which I feel would be interesting, firstly picking your wine choice, searching a year, bookmarking your favourite wine, taking the test and looking in your bookmarked folder. 

Furthermore I have to bare in mind the options whilst using this app, and the functionality of it all too.

I feel how I have organised my animation it will demonstrate what you need to see in order to gain an understanding of what my app does.

Icons

Icons

The icons were an extremely hard thing to design, because I needed to choose the right style and choose the right colours to compliment my app. 

I checked out various websites, but the two sources that I go to that never let me down are;

https://thenounproject.com/

The noun project is create for fun and quirky icons, the majority are free of charge however some you need to pay.

http://iconmonstr.com/

I feel iconmonster you can't go wrong with gives you so many options, all for free, and you can download either SVG or PNG formats and furthermore you can pick the actual pixel size you want too.

Below I have posted a variation of drop down menu's (with icons) and my icons I created for my app too.

What helped me a lot whilst designing these was me just using my phone, looking at the sizes of everything, the arrangement, you don't realise what is actually there on your phone until you actually properly look.

Aswell as the menu and social media icons, I needed to create a tab for my app also, I like the O in the wineo so I thought I would try and experiment with the colours.

Your Bookmarks

Your Bookmarks

This is a really simple page, it's just a neat way of offering the user to organise his or hers bookmakred images, ranging from individual bottles of wine, food, food pairings to region.

It does exactly what it says on the tin.

Furthermore this page was fairly easy to design however the colours were the hardest part to get right, because of the types of browns I used I needed a strong and bold colour to compliment the pages and more importantly easy on the eye.

The previous page works well so I thought why not apply the same whitewash effect on these pages, I think it's a tad too much, but it works.

Become an expert

Become an expert

This page is fairly simple to navigate around and it's fun for the user. The design of the pages are similar to that of 'find your wines page', I used a combination of varied colours and making sure that the font is readable too. 

I believe that's the hardest part whilst creating the app is making sure you can read the content.

Yet again experimented with the whitewash effect, it works on this page, purely because there inst much detail but to keep my app consistent I couldn't add the whitewash effect on this page and not the other pages.

Yet again I applied the whitewash effect to these pages, it's subtle and works well.