Skip to content
Work

DEVELOPED AT ·GOOGLE BRAND STUDIO ·FOR ·RNIB ·WEB

Auditorial

We collaborated with RNIB, Google, and The Guardian to create 'Auditorial,' an accessible online editorial combining articles, visuals, voices, and spatial audio for the 2.2 billion visually impaired worldwide.

View live page

About

Auditorial is an experimental accessible storytelling platform created through a collaboration between Google Brand Studio, RNIB (the Royal National Institute of Blind People), The Guardian, and R/GA. Launched on Global Accessibility Awareness Day (May 20, 2021), the project addresses a stark inequality: while more than 2.2 billion people worldwide are blind or visually impaired, 97% of the top one million websites fail to meet standard accessibility requirements. Traditional screen readers convert text to synthetic speech, stripping away the emotion, emphasis, and nuance that makes storytelling compelling. Auditorial set out to demonstrate that inclusive design can enhance rather than limit a publisher's storytelling capabilities.

The creative approach centered on human-first design — rather than retrofitting accessibility features onto an existing design, the team included blind and low-vision collaborators in the design process from inception. The platform offers three distinct ways to experience the same story: a fully customizable audio-visual narrated experience with spatial audio, a written article with enhanced accessibility controls, or reading along with closed captions. The editorial content, provided by The Guardian, tells the story of Bernie Krause, a soundscape ecologist who has spent 50 years tracking the effects of the climate crisis through sound — a topic deliberately chosen for its focus on auditory experience.

The team developed 22 adaptive features enabling users to experience the same story in over 100 different ways. Visual customization includes six alternative color palettes, dark mode for photophobia, and motion graphics conversion to static keyframes. Audio capabilities include professional human narration, adjustable playback speed, ambient sound controls, and binaural 3D spatial audio. Content presentation features include narrative alt tags written as descriptions aligned with storytelling rather than succinct labels, and mindful language throughout. The platform was built using HTML, CSS, JavaScript, and Angular over a seven-month development period, with R/GA's London and São Paulo offices leading creative and technical delivery.

All development techniques and research learnings were documented in the Auditorial Accessibility Notebook, published alongside the site as a resource for web creators worldwide to implement inclusive design practices. The project was featured on the Google homepage at launch and won over 10 major industry awards, including a Cannes Lions Silver, two Clio Silvers, an ADC Gold Cube, and recognition at the One Show, D&AD, AICP Next, BIMA, and the Webby Awards.

Results

Over 100,000 readers and makers were reached, with 96% of user testers reporting a vastly improved experience compared to traditional websites. The project was featured on the Google homepage at launch. Inclusive design lectures from Google and RNIB continue to tour the creative community, and the Accessibility Notebook provides ongoing guidance for web developers. The site remains online as an example of accessibility best practice.

Quotes

“We hope this experimental project will raise awareness and spark a broader discussion about how the web in its entirety could become a more inclusive place for people with disabilities.”

Kate Baker , Creative Lead at Google Brand Studio EMEA Source

“We approached The Guardian to work on this because of the lack of equitable access to everyday news. It is like one of the most pointed inequalities of the web today.”

Kate Baker , Creative Lead at Google Brand Studio EMEA Source

“We have learned much more about accessibility and inclusive product design from RNIB during this project, and we plan to apply the skills and lessons in future. Building a website from the ground up with accessibility and inclusive design at the forefront has made us think about user experience from the point of view of blind and low-vision users.”

Max Sanderson , Acting Editor, Audio at The Guardian News & Media Source

“This experimental story format shows what can be done to place accessibility at the forefront of our design and development process.”

Max Sanderson , Acting Editor, Audio at The Guardian News & Media Source

“Far too many websites are not accessible. For people who use assistive technology like a screen reader or screen magnifier, the frustration of not being able to use or navigate a website is all too common. Auditorial is an example of how accessible online storytelling can be rich and engaging for everyone.”

David Clarke , Director of Services at RNIB Source

“The project has pushed forward our thinking in terms of inclusive storytelling experiences.”

Robin Spinks , Head of Inclusive Design at RNIB Source

“It unlocks a whole different area of the internet that we were shut off from, for so long.”

Anonymous User Tester Source

“I hope developers use this project as a benchmark.”

Anonymous User Tester Source

Press / Media

Further Reading

Title Publication URL
Auditorial Official website https://auditorial.withgoogle.com
Accessibility Notebook Auditorial / Google https://auditorial.withgoogle.com/accessibility-notebook
Google Auditorial — Agency case study R/GA https://rga.com/work/google-auditorial
Accessible Storytelling: Google, The Guardian, RNIB Duarte Carrilho da Graça https://www.duarte.gd/accessible-storytelling/
Auditorial; experiment in accessible storytelling Google Blog https://blog.google/around-the-globe/google-europe/united-kingdom/auditorial-accessible-storytelling/
Content for all, with Google and The Guardian RNIB Enterprises https://enterprises.rnib.org.uk/success-stories/google-and-the-guardian/

Credits

  • Front End Developer, Creative Technologist

    Pim de Wit

  • Designer, Illustrator

    Slav Vitanov
  • Front End Developer

    Craig Rogers

  • Producer

    Jenny Yeung

  • Technical Lead

    Ted Wallace-Williams

  • Front End Developer

    Eduardo Rodrigues Gomes

Stack

HTML, CSS, JavaScript, Angular