Prototyping + Notes

Waaaaay too big!!! Need to be able to access each point of the menu while reading each section.. 

- Good nav system for the sub points, can see everything and go on to the next menu item

-maybe needs more colour? 

- The "issues" and "outcomes" need to be way more obvious, they are more important hierarchically and so need to be more obvious. 

- Much better size but still needs some adjustment... should I do maybe some buttons at the top, one "issue" and one "outcome"...? hmmmmm Or a button at the bottom of the issues page that leads to "outcomes" ... maybe need that in the big thingy at the top. uh...

like this? 

- Apparently an Intro paragraph is a very good idea because otherwise people have no idea what you are talking about! 

- ! Make sure text lines up on each page... ! Standardise all illustration sizes

Layouts

Potential layouts and organisational systems for the webpage. 

Icons representing the four main points that the user can click on to get a more in depth view or not... 

Thinking maybe the "visions" should be at the end, before a "challenges" section? 

Precedents + Interactive Informational Content

Current "Our City Tomorrow" website layout 

Pros: Nice colour palette, good introductory banner, very simple easy to navigate website... the layout of Challenges first and Planning second leads quite naturally and chronologically I think

Cons: Too text heavy I think? Could do with some more graphics

Precedents

Infographic: The New York Skyline (Nat Geo)

As the user scrolls across, introduces a view of existing buildings (grey) and buildings that are scheduled to go up, a kind of future projection on top of what exists already. This approach could be interesting for OCT because of its use of "projected" or futurely planned stuff to go on top of what already exists in Wellington and what they are wanting to put onto it...

- Note - the information I have to present is fairly speculative and less concrete, lends itself to not that much interactivity?

Interactive Article: Generation Screwed (Huffpost)

For the main article you scroll down through the sections, and subsections you can scroll across.  The article goes into a variety of graphic styles, engaging movements w javascript etc etc to keep the viewers interest, and to supplement the content.

Infographic: The Future of Car Sharing

Another scroll-across interactive infographic that takes the user through the future of car sharing. Has headings and sub headings. Another cool approach.
There is the potential for more than one scrolly across part, perhaps?...

!! Would it work on mobile as well? Important

Webpage Process

Brief:

• Review the attached summary document from some engagement work related to a project we're doing with Wellington City Council. Then once you've digested it, think about how you'd present the key information as a single page for a website. And then mock it up! :-)
• The mock up doesn't have to be perfect, or brilliant design, we just want to understand your process and what you deemed important, and see how you decided to present the information (imaging that your audience is the general public).

So needs:

- To be a single webpage

- needs hierarchy of information and a system of which the key info is organised

- needs design to aid the users digestion of the information  

What is the most important information on this document?

- The challenges of wellington, or what they believe that wellington city council should focus on. Meaning "areas of focus" or "themes". 

- The key areas of focus for the participants were: Transport, natural hazards, population growth, and green space.  

- Under these four headings comes some sub information detailing more on the heading, and elaborating on specific concerns

As most of the things brought forward from participants were "outcomes focused", there are 2 ways I could approach laying the information out to an audience - from a challenge focused perspective, i.e. "climate change is coming, this is an issue we need to address" versus, "residents said they wanted to have a more resilient city"... etc etc

Probably start with the problem, end with the desired outcome? This is how the document is laid out...