Early days visual exploration

A small sample of experimental sketches for visual language - looking at colour, typography, story packages, visual hierarchy, space and rhythm etc. The aim was a holistic experience across all digital product teams - the challenge was to define and share design principles across multiple scrum teams.

Designed in the open

An uncomfortable experience at first, but now I'm converted. Flats over-promise, they are good for conversations but they can't tell the full story. Visual design needs to evolve and mature in the browser. With so much varied content, visual nuances have to be experienced over time. You can't be too precious, things change. It's liberating. It's like an oil painting - editable layering, holistic tweaks, no one paints final detail from one corner to the other. The challenge of course - is managing the design/UX debt in a sprint process.

Design progress

TonE

We introduced colour to signify tone - a visual cue to define the character of the content.
The use of tone to drive design will always grow and be in progress. Colour coding is a learned experience. Some are obvious familiar patterns, some not so, but that's ok.

Banding - a new brand device

tonesandpapers2.jpg

Kickers

Kickers are a subtle way to draw the eye and break up headline monotony. They can also provide context of a story. Kickers can be served to a tag, a section, or custom written.

Sublinks logic

In the previous design, sublinks were used liberally to say the least - and often lost there purpose. We enforced a cultural shift for editorial to think about them. The 'blended containers' liberated the relationships of the story lists. Sublinks were stripped back a lot, reserved for stories of a certain importance.

Treats

weathercrossword.jpg

Governance and training

Launch day (UK)


Related work

the guardian

Responsive website & editing tool

The guardian

Twitter Avatars