1.
Content is King
the DNA of designing a citizen-centred local authority website for
dlr County Council

2.
Daniel Alb
Design Lead @ Monsoon Consulting
daniel.alb@monsoonconsulting.com
@danielalbro

3.
What to expect?
Layers
A-HA!
Moments
OH CRAP!
Problem
Solving
Occasional
Bragging

4.
What I’ll cover…
1. Background
2. Project Goals
3. Context
4. Design Process
5. Design Principles
6. Challenges
7. Quick Recap

5.
Background
Total Population: 207k Educated & Tech Savvy Website Stats
102k 78.8% 30k
Professional or Managerial
& Technical
Broadband Connectivity
National average: 63.8%
Unique Website
Visitors per month

6.
Project Goals
1. Citizen-Centred public service platform
2. Modern website accessible across multiple devices
3. Highly Visual / Showcase the location
4. Easily Managed
5. Drive Efficiency / Decrease number of calls
Focus on Citizens
Focused on Organisation

7.
Context
New dlrcoco Website
Existing
dlr Libraries
Website
Existing
dlr Events
Website
Search
Events
News

8.
The Process
1. User Research - Understand the Users
2. Organisational Research - Understand the Organisation
3. Content Audit - Understand Content Types & Structure
4. Information Architecture - Taxonomies & Hierarchy
5. Sketch & Wireframe - Figure out solutions
6. Test - Make sure it works
7. Build - Rapid Development
8. Design - Define Styles & Interactions
9. Theme - Get it ready
10.Train - Onboard & Train Content Editors

9.
What we have
THE PROCESS: RESEARCH
Customer Surveys
Pain Points
Website Analytics
Popular Content
Customer Calls
Nature of Enquiries

10.
Website Audiences
THE PROCESS: RESEARCH
Proto-Persona
1. High Level understanding of Audiences
2. Start Designing for User Needs
3. Perfect for Agile Projects
4. Validate Later in the Process
5. Based on Secondary Research

11.
Stakeholders Interviews
THE PROCESS: RESEARCH
Interview Staff
Across All dlr Internal
Departments
WHO?
Senior Staff + People that Talk to People
WHY?
1. Understand the Structure of the Organisation
2. Understand the Services they Offer
3. Understand Department Public Content
4. Onboard Staff to become Content Editors
5. Validate User Needs & Pain Points

12.
Content Audit
THE PROCESS: RESEARCH
No Clear Structure
Content Maze
Alphabetised Navigation
Guessing Game
External Google Search
Lack of Context

13.
Content Audit
THE PROCESS: RESEARCH
Content Publishing Dependent on the IT Department
Bottleneck

14.
Information Architecture
THE PROCESS: TAXONOMIES & HIERARCHY
Content
“I Want Information & Services”
Citizens
“I Work in This Department”
Content Editors

15.
Content Tags
“I Want Information & Services”
Citizens
“I Work in This Department”
Content Editors
Information Architecture
THE PROCESS: TAXONOMIES & HIERARCHY

16.
Onboard & Train Content Editors across All Departments
Streamlined Process
Information Architecture
THE PROCESS: TAXONOMIES & HIERARCHY

17.
Service Listings
Generic Content Pages
Micro-sites: Parks, Arts
News
FAQs
Documents
Events
EMERGING THEMES &
CONTENT TYPES
Information Architecture
THE PROCESS: TAXONOMIES & HIERARCHY

18.
Solution Planning
THE PROCESS: SKETCH & WIREFRAME

19.
Design Principles
Mobile Mindset
Facts over
Assumptions
Tunneling
Distributed
Content
Define. Design.
Test. Repeat.

20.
Design Process
THE PROCESS: SKETCH, WIREFRAME, DESIGN
Rough & Disposable Sketches
Pen & Paper
Prototype & Test
Greyboxing
UI & Style Guide
Pixel Pushing

21.
Solution Design
THE PROCESS: SKETCH, WIREFRAME, DESIGN
V.1
V.2
V.5
V.7

22.
Solution Design
THE PROCESS: SKETCH, WIREFRAME, DESIGN
V.21

23.
Design Challenges
THE PROCESS: SKETCH, WIREFRAME, DESIGN
1. Deep Navigation
2. Powerful Search
3. Contextual Indicators
4. Distributed Content

24.
The Burger Menu
DESIGN CHALLENGES: NAVIGATION
The Burger Menu
WHY THE BURGER MENU?
1. People Recognise the Pattern
2. Unified Experience Across Devices
3. Department Agnostic
4. Focus Users on Content
5. Exploration Mindset
6. Cleaner Interface
7. No Inherited Navigation behaviour

25.
The Burger Menu
DESIGN CHALLENGES: NAVIGATION

26.
The Burger Menu
DESIGN CHALLENGES: NAVIGATION

27.
Search
DESIGN CHALLENGES: NAVIGATION
Website Search
SEARCH FEATURES
1. Search as the main navigation tool
2. Powerful & Predictive
3. Short Journey from Input to Result
4. Visible Action Flags
CHALLENGES
• Contextual Indicators
• Cater for Novice & Expert Users

28.
Search
DESIGN CHALLENGES: NAVIGATION

29.
Search
DESIGN CHALLENGES: NAVIGATION
Search Term
Predictive
Results
Direct Results
Links

30.
Contextual Indicators
DESIGN CHALLENGES: NAVIGATION
Back
Button
Breadcrumbs
Service
Type

31.
DESIGN CHALLENGES: INFORMATION ARCHITECTURE
Distributed Content

32.
Distributed Content
DESIGN CHALLENGES: INFORMATION ARCHITECTURE

33.
Enterprise Content
QUICK RECAP: LEARNINGS
1. Onboard Stakeholders Early
2. Start with the Content
3. Understand the Users
4. Make it Error-proof
5. Always Iterate & Improve
6. Understand the Extent of Behaviour Change
7. Context over Content

34.
– Stephen Brady, IT Director @dlrcc
“Very obviously, Monsoon team provide strong
aesthetic and design skills. They underpin this
with thorough business analysis and
stakeholder engagement, and a robust project
management methodology. We’re very proud
of the resulting suite of websites this
engagement has produced.”

35.
Thank you.
Get in touch
daniel.alb@monsoonconsulting.com
@danielalbro