Long PDF reports are often seen as an output of a long term project. However, it can be inaccessible for the general public.
The Digital Narratives: SuDS+ website comes from a desire to develop a new way to use the web to better communicate Arup’s specialist domain knowledge to clients and stakeholders. The SuDS+ project, and its outputs, were identified as an ideal pilot for this new service due to the close engagement with communities in the discovery phase and the production of a report as final output.
Early in the process it was decided a website would be an ideal way to create an engaging and accessible version of the ‘classic pdf’ report produced. It was also identified that it would ensure transparency and open communication about the project's principles, methods and tools, support future community engagement efforts as well as promote the idea of community-led approaches to water infrastructures.
3 months
web development timeframe, where we explored bespoke web design.
Iterative
design and development approach was adopted, working collaboratively with domain experts and clients.
Accessibility
was considered throughout the website.
SuDS+ Digital Narrative
Using web experience to enable community members to engage with the content of a formal written output in a digestible, accessible and playful way.
SECTOR
Public, Climate
CLIENTS
Durham County Council
SERVICES
Digital Products, Narrative, Visual
LOCATION
Stanley, Durham, United Kindom
Iterative design process
An iterative design and development approach was adopted which included working collaboratively with domain experts and clients, tailoring content to the need of a non-linear online format, and creating content-appropriate interactions and designs.
Accessibility
Make information accessible and inclusive is one of the key motives behind the web development. We have:
Create interactive illustrations and animations to explain the process more effectively than with static images
Using scrollytelling to make the experience more interesting
Write in plain English and use tooltips for definitions of terms that are not commonly known
Consider web accessibility, such as colours and keyboard navigation
Using bespoke illustrations from phase 1 of the project throughout the site to create a consistent and recognisable project identity across engagements
Keeping users engaged by creating animation easter eggs to surprise and delight
Avoiding text overload by breaking up information into interactive cards and popups