In week 3, I have been starting to consider format and the layout of various content types. Structuring the content to have focus points is a critical part of organising a project in this format, the differentiation in style will keep users interested and allow them to be drawn to some areas over others. In my wireframes, I looked at the options for the main home page which gives access to menu (menu will be carried throughout entire document), block quote styling and the style of paragraphs.

In the home page I explored having different elements and formats along with various menu styles. This included adding illustrations of the characters, a London skyline and magnifying glass in various sizes and styles whether that be in full colour or greyscale. I also experimented with title size and the call to action button to move onto the next section. I think it is key in a project like this to maximise real estate for content to be presented to the user so this will be considered when adding the fixed menu element.

The Block quote section included looking at 4 different formats, including a modern block style to draw focus to the quote, the letter with block quote on the front, and two simpler options - one a regular simple block quote and another with enlarged quote marks. All four of these may be used in my prototype to add differences to the design.

Finally the paragraph section again offered four versions with thought into the background and structure. I considered dark and light backgrounds along with having a faded map of London in the background. This content will be paired with illustrations relating to the topic and I experimented with layout of text and images. Again, there is a chance that more than one of these styles will be used - something I need to consider again in the future is further links and buttons to move through the prototype.

I will move on to refine these rough sketches further on paper and then create low fidelity screen versions which will allow me to get a visual understanding of how the final prototype will look.

Next Post:

Refined Wireframes with Structure

Main Project page:

IXD304 - Storytelling and Narrative