• Main

    The new Guardian app

Graphic Design

Behind The Scenes: The Guardian's creative director on their new app

Posted by Rob Alderson,

When it comes to mainstream media, few organisations have embraced digital innovation with quite the same appetite as The Guardian. This week sees the launch of their new and improved app which creative director Alex Breuer and his team have been working on for some months, hoping to create a newly coherent and content-friendly mobile and tablet experience. We spoke to Alex about the design thinking that went into it…

The last big Guardian redesign was a huge success; did that add to the pressure when starting this process?

It would be fair to say given the quality of work by my esteemed predecessors, that in my mind at least, there was a little extra pressure on this redesign.

The initial pressure at the that blank-sheet-of-paper-moment quickly subsided once we began the thorough validation process of the organisation’s and readers’ needs and the subsequent synthesis of the ideas into a coherent strategy. The challenge of this redesign is very different from the previous ones. The Guardian has rapidly evolved as a news organisation over the past few years, we have new offices in New York and Sydney, we passed the 100million unique browsers mark, we have a pioneering open journalism ethos.

The overarching goal was to evolve a new design and brand language that is consistent, coherent and has fidelity of presentation and interaction across all our platforms, that can adapt not just to serve the readers’ changing needs but also the evolving global news organisation that The Guardian has become.

With readers there is always an element of resistance to change that adds a little pressure to the process, but we were clear from the outset that we would be developing and designing in the open so both readers and key voices within The Guardian were all part of the evolution of the new design. This not just alleviates some of the “shock of the new” but gives confidence that we were solving the right problems.

  • 7inch-home

    The new Guardian app homepage

What were the core improvements you wanted to make to the app?

When I arrived here it was clear that we were giving users completely different experiences – in terms of fidelity to the core Guardian brand – across all platforms. We have our Editions app, we had the old smartphone app, we had an Android app that was slightly different, we had desktop website and we had a mobile site worked on by a third party which also had a different design – all of which were vague interpretations of the original Berliner newspaper design.

The first improvement was to evolve a new design and brand language presented a familiar and consistent experience but was also adaptable and responsive to the volatile needs across the whole digital landscape. But as the new mantra goes, design is not just how it looks, it’s how it works. So some of the key facets and functions of the new improvements are:

– A new responsive design built around the key proportion of the core image size we use across digital platforms. This substrate helps us enforce how we use space across headlines and pictures, which has always been a very key part of our brand identity. 

– For the first time we have consistent use of Guardian Egyptian across all our products and platforms.

– We commissioned Territory Studio to design us a custom set of icons that had the character of and form of Guardian Egyptian. We felt it was a really important part of the detail of the design that even at the this small but high functioning level the fidelity of the brand was delivered.

– A new colour language highlights the significance of stories and guides readers to discover new writers and subjects. We have an overarching news colour palette, a features colour palette, one for multimedia and one for live content. This transfers to all the various touchpoints and platforms. In the past if you clicked on sports article everything would be green, but now for onward links we’re using the livery of that type of article, so you can quite quickly move to comment pieces for example.

– Greater personalisation means users can tailor the types of articles they want featured on their homepage, and create bespoke alerts to follow favourite journalists, stories and football teams, as well as having region-specific editorial curation.

– Flexible formatting allows editors to curate stories and clearer design and navigation helps readers to discover new stories and writers with greater ease. Also we are getting to the stage where we can art direct content allowing us to have bespoke presentation created within the tools. 

– First impressions are always powerful, we were keen that the animations and transitions within this app were at a level consistent with the latest evolutions of native operating systems. One of may favourites is the animation of our new ‘g’ brand as the refresh animation. A small touch but one of the elements that core to our unique brand.

  • G10

    Initial sketches for the redesign

  • G7

    The Territory Studio icons

  • G8

    Design guidelines for the redesign

  • G9

    Design guidelines for the redesign

  • G10

    Design guidelines for the redesign

Mobile and tablet design seems to be changing all the time; how do you future proof designs with this in mind?

We are reaching the stage where presentation is evolving beyond skeuomorphic presentation of non digital content and as using mobile devices becomes second nature, we can develop designs that are inherently of the devices and how people use them.

This is not just a challenge of presentation but also acutely tied to content types and strategy. As an editorial organisation we know going forward that the form digital journalism will take is evolving. We felt it important to build a system that didn’t merely tag different types of content in simple lists as links to “article pages” (video/podcast/gallery etc) but gave enough space to properly present and signal the rich variety of content.

If I am honest there is a small proportion of the people using the new app who are convinced it should be just a list of articles. To me this would shackle our evolving content strategy; our competitors in terms of great presentation and usability are not just news apps. We have learnt from a whole range of other experiences in the space and tried to build an experience that doesn’t just sit comfortably alongside the best out there, but always gives us a platform to evolve the form of Guardian journalism in the future.

How much do you test changes like this with focus groups etc?

Even from early stages before we committed any code we built wireframes and flats – we have a great UX and testing lab here – and so from the very beginning we put our ideas in front of readers. We started with some very radical ideas but we knew we had to see if our thinking really tackled the right challenges.

We had three very different initial takes: one which was completely socially driven, where we took cues from how people were responding to content that was out there; one which was led by our open journalistic ethos and one which looked at that fact that there are multiple news sources out there, but people come to The Guardian for our particular take – so what if we dealt with stories as particular packages that lead people through the arc of comment and analysis of a story as well as the core new reporting?

We decided a quick browsable app combined with that authorial story arc and social cues is what people want. After that initial wireframing we went very quickly to rough prototypes and when we had a Beta version we opened up access to our most engaged users to let them play with it. We learned a huge amount that influenced the design and structure. Getting the balance right between beautiful presentation and story density was one of the key issues we did a lot of work on.

  • Nav-3-example

    Navigation page example from the new app

  • Footballtest-4col

    The new football homepage

Ra

Posted by Rob Alderson

Editor-in-Chief Rob oversees editorial across all three It’s Nice That platforms; online, print and events. He has a background in newspaper journalism and a particular interest in art, advertising and photography. He is the main host of the Studio Audience podcast.

Most Recent: Graphic Design View Archive

  1. Main8

    Google Jack Kerouac’s The Dharma Bums and almost every book cover design that appears either depicts someone hitchhiking or it has the aesthetic of a grotty travel diary of someone who’s been “finding themselves” along a motorway for a month or two too long. Kerouac’s novels don’t even need covers, right? They’re stand-alone pieces of literary genius. Big applause is needed then for Copenhagen designer Torsten Lindsø Andersen who has taken the rulebook of second-rate Kerouac book design and thrown it out the train window on to the track where it belongs. These ambient, sterile designs he’s proposed for the author’s back catalogue are the perfect fit to the words within: weird, unpredictable, drunk and unique.

  2. List

    I am a big believer that every magazine should be able to sum up what it does in a few words. New title The-Art-Form does just that with the pithy statement that it’s “a limited edition publication about art and artists.” Issue one features six artists – Ian Davenport, Peter Liversidge, Rana Begum, Dan Baldwin, Michael Reisch and Paul Insect – and each has been asked 13 questions ranging from why they make art to their favourite place. The answers vary not only in tone and subject matter (as you’d expect) but also in form, so while Ian has provided handwritten answers, Michael, Dan and Rana have created paintings, drawings and sketches in response to the questionnaire.

  3. List

    Over the last few weeks we have been exploring how Shillington College are revolutionising design education through their own model of practically-focused graphic design tuition. We talked to the teachers about how they put together this new kind of course and to those employers who have found the college to be an invaluable resource of young design talent. To round off this series of features, we went along to the London Graduation Show a few weeks ago to chat to some of the students about their experiences, so rather than hear it from us, best hit play and hear it straight from them…

  4. List

    It’s been a couple of years since we headed over to Sweden to celebrate the work of Stockholm studio Research and Development but in that time art directors Daniel Olsson and Jonas Topooco have kept the great work coming. They’re a versatile pair who pride themselves on working closely with their clients to produce design work that plays to their strengths without losing sight of the brief in a blaze of self-indulgence. Anyone who can make a publication for the Swedish Environmental Protection Agency look this interesting is always going to get in our good books.

  5. Main9

    Anyone who designs a clock that reminds you to “have a nice day” must be a good person, and it turns out Joe Cole Porter is not just nice, he’s also incredibly good at what he does. His work is the perfect balance of well-informed and actually fun. How many times have you watched through your fingers at corporate brands trying to be fun and ending up just being boring with a healthy dose of wacky? Exactly. They should take a leaf out of Joe’s book and produce design that is cheerful and colourful but intelligent enough to get the job done at the same time – a bit like a friendly builder, or a cheeky plumber. Some of Joe’s most exciting stuff is his record sleeve design, and we hope to see a little more of that in the future.

  6. List

    Five years ago when we first discovered Swiss designer Mathias Schweizer (thanks to Côme de Bouchony) he was an incredibly elusive fellow, with no online presence to speak of and little work to be found anywhere on the internet. Since then he’s been nothing short of prolific, producing exhibition identities, posters, publications, typefaces, solo and group shows as well as out and out experimental pieces. In fact the one thing that seems to define his work is experimentation; with classic design rules broken all over the place in his vast portfolio.

  7. List

    I’m not sure what it is about the Royal Academy of Art in The Hague that means it spews out so much creative talent at such an alarming rate, but it certainly doesn’t show any sign of stopping soon. Here’s an example; Marinus Schepen hasn’t even graduated from his Graphic Design studies there just yet, but the work he’s creating is of such a calibre that we can’t help but share it any how.

  8. Patlist

    Taking on the art direction of a musical installation touring about British woodlands sounds like a somewhat complex task. To be honest, I wasn’t sure what a musical installation set amongst trees would even involve. I assumed it wasn’t anything to do with singing pixies.

  9. Main

    Unless you’ve recently relocated from a teeny tiny little hut atop a snowy, sheep-covered mountain miles from the nearest village, you probably know that the Edinburgh Festival Fringe is on. It’s only the world’s biggest arts festival, after all. What you might not know is how it all began. Back in 1947, when corned beef was still a dietary staple and your granny was grateful for her bread and dripping sandwiches, eight rogue theatre troops gatecrashed the Edinburgh International Festival. These unofficial performers staged shows on the outskirts of the festival, and so “the fringe” was born.

  10. List

    This identity that design studio Bleed have created for a new office building called Monier in Oslo, Norway, is heavily founded on the principles of the building itself, as well as the history of the site it has been built on. The idea for the logo is derived from the building’s three different window shapes, the studio explains, which are a key aspect of the building’s cubistic architecture.

  11. List

    With Richard Turley now utilising his skills for the betterment of MTV’s creative offering, Bloomberg Businessweek has been left in the hands of his two former proteges, Rob Vargas and Tracy Ma. Rob’s work is already pretty well known by devotees of the title, but Tracy’s is arguably the most experimental of anyone working for a global publication like Businessweek. Her use of layout and typography is arresting to the point of distraction, but is always used in a manner that serves the story first and foremost. Similarly her aesthetic choices often feel informed by a lifetime spent online, with brash colours, textures and stock imagery proliferating her spreads – which for a title that deals with the politics and economics of the digital age feels impeccably on point.

  12. Main9

    Fantastic work here from Lyon’s boundary-pushing designers Antoine Eckart and Francis Josserand, also know as Alles Gut. How do you say Alles Gut? Here at It’s Nice That we say it as if we’re saying “all’s good” in a funny European accent. Each to their own. Anyway, Alles Gut make the kinds of fliers, posters and small publications that we are totally into – sharp, well-considered colours and well thought-out references come together to make modern printed matter with quick-witted retro aesthetic references. Personal favourites? I’d say the posters for the HASTE parties – they really, really make you want to go to those parties.

  13. List

    Roosje Klap and Mathias Schweizer have just finished work on a pretty extraordinary piece of digital collage for Dutch literary magazine De Gids – a publication that’s been in existence since 1837. The images on display propose rooms that reference literary voices of the past like Ovid and Baiga, compositing various erotic references into surrealist dreamscapes. The pair worked on them in tandem in the manner of an exquisite corpse – building on each other’s work in stages over time – only instead of strange little bodies as the final product, we’re met with what Roosje refers to as “graphic sex cadavre-exquis!”