Wednesday, December 14, 2016

OUGD504 -Design for Screen - Wireframing



Wire-framing - At this point it after researching into my problem, analysing what must be included and beginning to look at the hierarchy of information. These three prompts seemed an effective way of finding out what the user is really searching for and stream lining the information that is on show. Using the wire framing techniques that Erik Spiekermann suggested printing out the moblie phones and drawing directly onto them to gain an understanding of size and scale.  

This image of my site map informed my initial wireframes. 






















Using three different sections allows the user to know exactly where they are in the app, as well as where to find the information they need. These three images represent 'Explore, Home and Profile. These three sections become the basis for the rest of the design, this way of breaking up information is a design technique seen in many app designs like Instagram and Snapchat. Vertical swipes are often the way to navigate across these three sections. 







The three images above show other screen that will be needed for the home section including, further detail on a exhibition, an option to see whats on via the map view. These loose sketches will inform my further designing. Creating wire-framing has allowed me to see how the scale of certain information will effect the overall communication of the apps content. 




These images show the use of calendar, this was highlighted in my feedback as an important part of the profile, the users want to be able to see adjust and personalise there calendar related to their own interests and galleries. 


These wireframes are a useful starting point for this project and will need to be developed and built on through the design process. 

No comments:

Post a Comment