a new global visual language for the BBC

a new global visual language for the BBC
6 May 2011 | | Creative Design, Internet

Yesterday, the BBC announced the launch of the long awaited redesign of its website. This site is viewed by millions of people daily, so will therefore affect a large amount of people in the UK and abroad.

The BBC wanted to create a fresh, new, up to date design, focusing mainly on usability and visual aesthetics, boasting that the new design changes are the most significant since 2002!

So what has changed with the design of the BBC website over time, and what new features are available for the public? The following article explains all!

The BBC website began its with this very simple design.

It was a basic offering with two sections to the site. Over time it has grown to encompass a great deal more. However due to the organic way in which the website evolved and the old structure of the business, with dozens of small design teams working independently of each other, the site had a fairly schizophrenic nature once you delved into its depths.

About 2 years ago, after printing out the site onto what has now become jokingly known as the “Wall of Shame” we decided to embark on an ambitious project, called Global Visual Language 2.0, with the aim of unifying the visual and interaction design of bbc.co.uk and the mobile website.

We created a new wider, centred page template to take advantage of wider screen resolutions and for the first time created an underlying grid.

We rationalised the hundreds of different banner styles into a new global and local branding and navigation system.

We discontinued the scores of different audio and video players and created a universal .

And we redesigned the homepage creating a visual style that began to ripple through the site and onto the mobile platform.

We”ve lived with and loved the distinctly “web 2.0” design for a while now and it”s done us proud. However, time”s moved on, and in autumn last year we decided it was time to resurrect the project.

We set out to broaden our ambitions; to create a design philosophy and world-class design standards that all designers across the business could adhere to. We wanted to find the soul of the BBC. We wanted something distinctive and recognisable; we wanted drama. We knew whatever we created needed to be truly cross-platform and that we needed to simplify our user journeys.

We didn”t do it on our own. We pulled together representatives from across the business, led by the project”s Creative Director, Ben Gammon, to form a Global Design Working Group, and we created a GVL Steering Group to help manage and direct the course of the project. We also went out into the industry to find a partner to co-create the styleguide: Neville Brody and his agency, Research Studios.

After going through a tender process in which we invited six agencies to pitch for the work, we chose Research Studios because we felt they had demonstrated a good insight into the BBC, its public purposes and they way in which it functions. We were also impressed with the work created for the pitch and Neville”s back catalogue of work.

Together, over the last four months, we”ve spent countless hours and created countless iterations of designs, components, mastheads, footers, polar maps, word documents, pdfs and grids… and whilst it”s still a work in progress, I”d like to share with you where we”re at with both the design philosophy and the latest version of our global visual language styleguide.

We wanted to create a design philosophy, or a set of values, to unite the user experience practitioners across the business. We settled on nine keywords which we think sum up what we”re about and what we”re trying to achieve:

Modern British
We want to create a modern British design aesthetic, something vibrant and quirky that translates outside our national boundaries.

It needs to feel current and reflect what”s happening in the UK right now, in real-time. We curate a timeline of Britain and create links to the past – to our rich archive.

Wherever we are heard we need to sound authentic and relevant, warm and human. We want to reference the BBC”s iconic design and broadcasting heritage. We value the trust placed in us.

We engage our audiences with compelling storytelling. Our voice ranges from serious and authoritative through to witty and entertaining.

We stand out from the crowd. We strike a balance between overly templated, cookie-cutter design and beautiful anarchy. We are bold and dramatic.

We pioneer design innovations that surprise and delight. But we take our audiences with us.

We view all services and platforms as one connected whole but deliver experiences that are sensitive to their context of use.

Our services are open and accessible. Our interfaces are simple, useful and intuitive.

Our ambition is to be the best digital media brand in the world.

Armed with our new philosophy we began creating conceptual designs for various properties: BBC news, homepage, search, iPlayer, programme pages and the embedded media player.

Through doing this work we began to distill the essence of a new visual style. I”m going to take you through some of the key elements, starting with the page grid.

We took inspiration from many sources. What we were trying to achieve is an underlying grid system that was flexible enough to enable many unique design variations whilst still feeling coherent and considered.

The new grid is based on 31 sixteen pixel columns with two left hand columns that can be split into four, and one wider right hand column, which accommodates the ad formats that appear on the international facing version of the site.

We”re looking to create the effect of interwoven vertical and horizontal bands, making a feature of the right hand column across the site.

Along with the 16 pixel vertical grid we”ve also for the first time got an integrated 8 pixel baseline grid so that we can align elements on a page both vertically and horizontally.

A key feature of the new GVL is a much more dramatic use of typography. As well as Gill Sans we”ve introduced big bold type in Helvetica or Arial and restricted variations in size so that we have much greater consistency across the site.

More posts from our team

Previous Post:
Next Post:

Back to all news

Five Star
Reviewed Marketing
5 gold stars
google review logofacebook review with 5 stars
"Excellent service from James at Dental Design, thank you very much for your prompt attention whenever I get in touch! Would definitely recommend to a friend" Alison Tarmey View Full Testimonial
Google reviews logo "Would definitely recommend to a friend"
5 gold stars
"As a dental practice manager I cannot recommend Dental Design highly enough. They are just brilliant at what they do. Lucy and her colleagues are just an email or a phone call away...." Emma Smith View Full Testimonial
Google reviews logo "I cannot recommend Dental Design highly enough"
5 gold stars
"Really great company to deal with. They always respond quickly and are truly reliable. I would 100% recommend, the staff are so friendly and helpful." Michelle Molloy View Full Testimonial
Google reviews logo "Really great company to deal with"
5 gold stars
"I got increased traffic and new patients applying to my surgery, once Dental Design upgraded my website. They are very professional, efficient & adaptive to new situations..." Joanna Gallop View Full Testimonial
Google reviews logo "Very professional, efficient & adaptive to new situations"
5 gold stars
"Lucy has been a star, responding to and acting upon our requests in a prompt, efficient and professional manner, as well as the rest of the Dental Design team..." Abhay Shah View Full Testimonial
Google reviews logo "I cannot recommend them highly enough"
5 gold stars
"...Since the website has been up and running Lucy Mander has been our point of contact. She has been invaluable and gone out of her way to help us, especially during COVID-19 lockdown... " Lucy Jones View Full Testimonial
Google reviews logo "Has been invaluable and gone out of her way to help us"
5 gold stars
"Thank you for all your help and support, and the provision of valuable learning aids for our patients and staff alike in these difficult times. We love the look of our practice website. Very professional!" Sandra Luck View Full Testimonial
Google reviews logo "We love the look of our practice website. Very professional!"
5 gold stars
"Dental Design stood out both in their knowledge of the industry and their professionalism and can-do attitude. All of their staff are exceptionally competent and knowledgeable..." Harvey Rook View Full Testimonial
Google reviews logo "Dental Design stood out both in their knowledge of the industry and their professionalism"
5 gold stars
"Having done extensive research into all the dental website companies, the team and package offered at dental design was unrivalled..." Neil Shah View Full Testimonial
Google reviews logo "The team and package offered at dental design was unrivalled"
5 gold stars
"The team at dental design (especially Rosie) are absolutely fantastic and are always on hand to help. They are professional, friendly and extremely efficient. Rosie always gets back..." KiKi Wilmot View Full Testimonial
Google reviews logo "absolutely fantastic and are always on hand to help"
5 gold stars
"Dental Design are fantastic to work with, our website is amazing and the support they provide is second to none. Our account manager Rosie L is a fabulous point..." Luke Lucas View Full Testimonial
Google reviews logo "Dental Design are fantastic to work with"
5 gold stars
"Having worked with the Dental Design team for the last six months, I've found them not only helpful, but friendly and approachable too. I bombard Marcus with regular..." Sophie Harper View Full Testimonial
Google reviews logo "always met with a swift and professional response"
5 gold stars
desk with branded documents