Designing and refiningA snapshot of a website design journey

Purpose of this talk• Give you an insight into my work• Provide me with a chance to reflect on the journey

Setting the scene

• Web Manager for CASS

About me

The brief• To create a website identity for CASS and its

Schools

‘a website identity’

‘we’re all individuals!!’

• Photoshop comp of web page

Where to start?

Drawbacks?• No guarantee that a website will look exactly the

same for every user

• Makes a catalogue of assumptions about the placement and position of elements

An alternative starting point…

• Style tiles establish a direct connection with actual interface elements without defining layout

Style Tiles

• A more developed form of mood board• Can compliment the traditional Photoshop comp route

• Listening, researching, ask questions

Style Tiles

The Process

• Break down and interpret feedback into themes and design principles

• Create a visual language

The advantages?• Making changes out of context allows me to

work faster• Suit ‘responsive’ design as they don’t imply

dimensions or device only that the design will be digital

Style tile to web page• Photoshop layouts• Designing in the browser• Further refinement of the style tile to create

user interface elements

CASS

Education

Psychology

Graduate School