“Perfectly well designed. The typographical choices are exemplary.” —juror Guillaume Braun
“Progressively enhanced and aptly accessible to the visually impaired, On Being is a great example of what a modern website should be.” —juror Dan Mall
Overview: Designed by Upstatement, this new digital platform for the On Being Project houses its podcasts and publications, and promotes resources and events. The site reflects the project’s radio show roots while empowering it to reach for an expansive future; the new back end enables editors to customize nearly every piece of the experience, from podcast episodes to the extensive archive, which dates back to 2003, to curated collections of audio, essays and poetry. Upstatement user tested the site with members of On Being’s community to ensure it serves the needs of the project.
Solr powers robust search functionality to get users to the content they’re looking for, and a persistent audio player ensures that browsing won’t interrupt users’ listening experience.
More than four million sessions have been logged on the site since its launch.
The site was completed in eight months.
Comments by Tito Bottitta, Nick Braica, Holly Copeland and Emily Theis, Upstatement:
What was the thinking behind the navigational structure? “The truncated menu at the top of the site gives users quick access to On Being’s core offerings, like radio and podcasts and the Civil Conversations Project, as well as the new curated Starting Points and Libraries. The expanded full menu reflects the same core offerings, but with more entry points to specific pages throughout the site. We designed the navigational structure through a collaborative card-sorting exercise with the On Being team, reordering and grouping the elements together.”
Are there any other technical features you’d like to call attention to? “We built a custom audio player that enables a user to listen to a podcast episode while browsing any other content on the site. Since the audio player needed to be consistent between pages, we couldn’t have the browser reload while navigating through the site—the audio would then stop! We solved this by transitioning between pages using an Ajax solution to fetch and render the next page while keeping the browser history consistent. This also enabled us to create smooth transition animations between pages.”
Were there any specific demands that made the project easier or harder? “A focus on future flexibility guided our project. In the past, On Being’s editors spent hundreds of hours sourcing images for every episode. The updated site relies on typography, optional imagery and illustration to make publishing more sustainable. A module-based page-builder tool empowers the team with a flexible editing experience, preparing On Being for whatever great challenge of humanity they tackle next. While we rebuilt the foundational pieces of their website, the On Being team also asked us to reevaluate their editorial and blog strategy as a whole. Our recommendations led them to shift away from commissioning time-consuming blog posts and focus on repackaging their work while engaging in two-way conversations on social, particularly on Instagram.”
