Design for Screen - Initial Ideas

To include:

• opening page
• main timeline
• change when the menu is clicked
• articles page
• discover section
• individual themes discover section 
• artist profile list
• artists individual profiles
• favourites page
• discovery page/most popular articles
• location search of galleries and studios
• events list and dates

After listing out all of the features and things that the app needed to include I drew up some initial ideas in the form of wireframes so that I could look at the different way in which the app design could be approached. 

1

As the content of the app is based around articles often extracted from websites that have well established magazines, the design style is influenced by that of a magazine. The intention is to be able to swipe from article to article as if the user is turning pages of a magazine. The bold title of the app will remain in the same place on all of the pages, acting as a header. To improve this idea it could be large on the first page, acting as a front cover and then on all of the sections it decreases in size to look more like a header. 

Wireframes 2 and 3 do explore two different layout options for the writing and the buttons on where it could all be placed, but to work as a final app that swipes like the pages of a magazine the articles pages would al need to be identical other than the content presented on them. 

One part of the design that isn't consistent with the idea of basing it on a magazine layout is the 'DISCOVER' section. It sticks with the same visual identity, but uses a horizontal scroll system so that a larger number of themed images can be displayed for the user to choose from. If this idea was to be developed, this is a part that would need to be developed to fit with the overall concept much closer. The design works by clicking on the image to add it to the favourites section so that the timeline content can be personalised and then by holding down one of the images, the full article will open for the user to read. 

From the home screen the user will have the option to either search for location information on an individual screen, or as a quick search on the actual homepage of the app. I have included the wireframes for both of these options to show how the keyboard would pop up if the user was wanting the quick access search or if they go to the individual page. The bottom left wireframe shows what the location search will look like once the location has been confirmed. There will be a section on the local studios and galleries of interest.

2

This app design has a lot more movement and interaction for the user. The circle was chosen to represent the different sections within the app, dropping to the bottom of the screen when one of the 'segments' are chosen to access. The home screen will have the labelled sections on it and then from then they will be colour coded. The user will be able to click on any section of the coloured segments to access that particular part of the app. The discover section will have lots of floating circular visuals so that the user can click the ones that they are drawn to, allowing for the app to then personalise the content that appears on their timeline each morning. 
Wireframe number 3 shows that when the article is opened, the arrow can then be clicked to allow the user to move onto the next article. 
For this design layout to work, the name would need to suit the visuals that have been designed for it to be appropriate. Visually this app is interesting, but it may be confusing for the user to interact with in comparison to other layouts that I have explored. 

3

Idea 3 has a much more organised and minimal design approach to the layout, responding to the preferences of the design conscious target audience. The app will open to a splash screen with the logo, name and colour scheme represented in some way. Once the user has logged in, the personalised timeline will act as the home page form which they will be able to access the full versions of the articles that they can see and also the menu can be accessed. The idea is to have a title, small image and a sentence overview of the article on the list for them to scroll through. They can then click on the article preview to be taken to the full article within the app and then also with the option to be redirected to the website that the article was sourced from. The layout for the app will be based on a modular grid as it allows for design freedom, but as it has more restriction than a column grid it is easier to develop an overall design visual and maintain consistency throughout. 
Wireframes number 5 and 6 show the discover section of the app, keeping it simple with squared images of the artwork so that the user can then decide if that category is something that they would want to follow. 
The emphasis on the app being developed to make someone morning reading quick, easy and no longer than it takes to drink a coffee, the ease of use needs to be the main focus. One way this layout works to make it easy for the user to navigate around the app is by having the menu icon always in the top left of the screen so the user can get to any section of the app at any time.