Friday, 24 April 2015

Beyond App Initial Development

After talking about the magazine (Lizzy's role) we looked at designing the app, which was my role, as I hadn't designed an app and its pages before we had swapped roles so that we can help each other and learn something new. 

And so we drew out frames for the app and how it would work, we wanted the app to be simple and easy to use and as well as this for my benefit too. 





And so I began designing the app, the first page would be the landing page which would allow the app to load, I decided that to indicate the app was loading it would be interesting to make the plane icon fly away from the logo. 

I had learnt a couple of months ago how to create a gif on photoshop and so I used this technique to make the plane fly. 

So I used Timeline and added around 40 frames in between with a 0.1 delay.



I created the plane flying and saved as a gif, I think that this works really well and I am pleased with the result. And so this is the landing page.


 Then the user would be taken to a Log In or Sign Up option which still follows the same format as the the first page. The login acts as a button to the next page


Once they had logged in there name would appear under a simple icon. The trips already planned and saved would appear in a list in the darker box, so for instance 'Lizzy' has one trip planned to Barcelona, there is further options to make a new trip or to write a review.


If you wanted to plan a new trip you would be able to scroll through an extensive list of cities once selected the option turns into the sea green colour. 

Throughout the rest of the pages the nav bar contains the account name and the map icon which would always return the user to the 'My Trip To..' page, which they can then get access to the map.


Then you would arrive at a 'My Trip to...' which would allow you to add itinerary to your trip, which would take you to this page, the places you want to go to are categorised by tags (determined by Beyond) and then this allows you to select what you would like to do. 

I also added images to each of these pages, the images relate to the tag and give the user an idea of what might be in this category and also some inspiration.


Once you had selected what type of thing you wanted to see or do you would be taken to another list which would have the exact same format as above. 

Then when you select a place you would get to the description page. This page would firstly contain and overall rating score, determined by ratings on review from users. It would then show all of the available tags/ categories. 

Then there is a description, informational details and all option in seagreen are clickable and will take you to another place. 

The option to scroll downwards would only appear when the user started to swipe to move further down the page. 


Description page continued... further down the description page you would also be able to select cafes/restaurants nearby. There would also be an option to instantly locate on the map or to instantly add to trip. 

This option also provides custom for cafes and restraints in the area and this could be how the company- Beyond could generate money through advertising etc.

Another option would also be 'if you like this then you might like...' this gives the user other ideas of what they might like and could add to their trip. Below the images is the options to again find on the map and to go to their own description page. 

And then below that is the user reviews, and the option to see more, again this shows the rating system and the rating a particular person has given the place. The rating at the start is an average of these, and it could change in time. 


The 'My Trip To...' is one of the centre focuses of the app and it creates and saves a list of all the places you wanted to go to and you would be able to filter your choices by the tag options. or just see them all in a list like below. Again you can see the locations on the map. 





This is the next essential page which adds all the chosen locations to the map and pinpoints where they are again you can filter the pins on the map. You would also be able to move the map on the page and reveal further away pins etc. You can also zoom in and out and if you tap on the pin it will bring up the name of the location and the option to go see the description of this location. 


The second option from the account page is the option to write a review. On this page you simple select your city, and then the location you want to review. 

You firstly choose a rating by moving across left to right highlighting the number of planes you want to select. 

You then need to add a summarising thought of the place for example "Fantastic"

And finally write a brief description of the place and the experience you then submit your review and this will go through the page will refresh.



I think that for my first real attempt at designing pages for an app, I feel like this has gone successfully I am pleased with the aesthetic of the pages and how they function. I feel like me and Lizzy can now review these and improve them, I have through writing about the pages found some things to improve and I have written them down, and I will change these with further changes me and Lizzy discuss at a later date.  

No comments:

Post a Comment