Tag Archives: Style

Initial UI Way-finding Design

IMG_7266

This is the white board sketch Jeff and I worked on today concerning the base UI of the Map/ Way-finding, including what all the buttons do and where they link to.

  • 3D AR Views are initiated by tapping on speech bubbles that appear over icons when these fall within the animated  radar surrounding the player
  • All Main Menu Icons can be found along the right hand side of the map so the phone can be held and operated with one hand.
  • GPS strength is also included in the top right.
  • We  came up with rough categories for the Information Screen/CMS for the users
  • Finally there is a music icon however this is a placeholder for no until we figure out how this will work

Map Concept 1

13 DECScreen Shot 2016-12-13 at 1.24.41 PMBased off the above image we will create a concept map of Wellingtons Water Front for the Literary Atlas. It will be stylized like the feature image and use the same colours and bold black outlines.

The following typefaces have been selected to be used.Screen Shot 2016-12-13 at 1.52.30 PM

 

16 DEC

Here is the rough mock up of the Map in Illustrator. More work will be done on this tomorrow.Screen Shot 2016-12-16 at 2.32.37 PM

  • Icons for specific points of interest will be made (right now these are small burgundy circles)
  • A swatch for the buildings will be written for finer lines (the current blinds pattern is a placeholder)
  • I want to fill all the water with text ( as an abstract design choice)
  • Names of parks will have to be sourced
  • Find out all the boat names around the waterfront
  • User relevant points of interest?

 

18 DEC

Here is the mock up that has been completed thus far:

Screen Shot 2016-12-18 at 2.15.40 PM

I Have made a Building Pattern Swatch, however I need to adjust the legibility of the text within the buildings. I like the style of the water with the changing size of text however I think I should make the overall size of the text smaller. I am really happy with the colours of the map.

I am conscious that the map appears too busy. I might complete the basis of the map in its entirety, then develop the style. We need this map to  serve its purpose as a functional map as well as having a literary style.

Still to do:

  • Icons for specific points of interest will be made (right now these are small burgundy circles)
  • Find out all the boat names around the waterfront
  • User relevant points of interest?

 

19 DEC

Final Mock up completed! The full map can been seen below.

Map Mock Up

Text will need to be added next to further develop this map. The building swatches were adjusted also to make the building text more legible but the outline of the buildings was increased to make them stand out.

From this point on:

  • Text needs to be added
  • Icons needed for landmarks
  • Bridges need to be added

All things considered the map is really coming together