SlideShare a Scribd company logo
1 of 38
Download to read offline
Content is King
the DNA of designing a citizen-centred local authority website for
dlr County Council
Daniel Alb
Design Lead @ Monsoon Consulting
daniel.alb@monsoonconsulting.com
@danielalbro
What to expect?
Layers
A-HA!
Moments
OH CRAP!
Problem
Solving
Occasional
Bragging
Content is king - Designing a Citizen-Centred Local Government Website
What I’ll cover…
1. Background
2. Project Goals
3. Context
4. Design Process
5. Design Principles
6. Challenges
7. Quick Recap
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
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
Context
New dlrcoco Website
Existing
dlr Libraries
Website
Existing
dlr Events
Website
Search
Events
News
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
What we have
THE PROCESS: RESEARCH
Customer Surveys
Pain Points
Website Analytics
Popular Content
Customer Calls
Nature of Enquiries
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
Content is king - Designing a Citizen-Centred Local Government Website
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
Content Audit
THE PROCESS: RESEARCH
No Clear Structure
Content Maze
Alphabetised Navigation
Guessing Game
External Google Search
Lack of Context
Content Audit
THE PROCESS: RESEARCH
Content Publishing Dependent on the IT Department
Bottleneck
Information Architecture
THE PROCESS: TAXONOMIES & HIERARCHY
Content
“I Want Information & Services”
Citizens
“I Work in This Department”
Content Editors
Content Tags
“I Want Information & Services”
Citizens
“I Work in This Department”
Content Editors
Information Architecture
THE PROCESS: TAXONOMIES & HIERARCHY
Onboard & Train Content Editors across All Departments
Streamlined Process
Information Architecture
THE PROCESS: TAXONOMIES & HIERARCHY
Content is king - Designing a Citizen-Centred Local Government Website
Service Listings
Generic Content Pages
Micro-sites: Parks, Arts
News
FAQs
Documents
Events
EMERGING THEMES &
CONTENT TYPES
Information Architecture
THE PROCESS: TAXONOMIES & HIERARCHY
Solution Planning
THE PROCESS: SKETCH & WIREFRAME
Design Principles
Mobile Mindset
Facts over
Assumptions
Tunneling
Distributed
Content
Define. Design.
Test. Repeat.
Design Process
THE PROCESS: SKETCH, WIREFRAME, DESIGN
Rough & Disposable Sketches
Pen & Paper
Prototype & Test
Greyboxing
UI & Style Guide
Pixel Pushing
Solution Design
THE PROCESS: SKETCH, WIREFRAME, DESIGN
V.1
V.2
V.5
V.7
Solution Design
THE PROCESS: SKETCH, WIREFRAME, DESIGN
V.21
Design Challenges
THE PROCESS: SKETCH, WIREFRAME, DESIGN
1. Deep Navigation
2. Powerful Search
3. Contextual Indicators
4. Distributed Content
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
The Burger Menu
DESIGN CHALLENGES: NAVIGATION
The Burger Menu
DESIGN CHALLENGES: NAVIGATION
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
Search
DESIGN CHALLENGES: NAVIGATION
Search
DESIGN CHALLENGES: NAVIGATION
Search Term
Predictive
Results
Direct Results
Links
Contextual Indicators
DESIGN CHALLENGES: NAVIGATION
Back
Button
Breadcrumbs
Service
Type
DESIGN CHALLENGES: INFORMATION ARCHITECTURE
Distributed Content
Distributed Content
DESIGN CHALLENGES: INFORMATION ARCHITECTURE
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
– 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.”
Thank you.
Get in touch
daniel.alb@monsoonconsulting.com
@danielalbro

More Related Content

Viewers also liked

A framework for workshop facilitation - UX Ireland 2016
A framework for workshop facilitation - UX Ireland 2016A framework for workshop facilitation - UX Ireland 2016
A framework for workshop facilitation - UX Ireland 2016Matthew Ovington
 
UX Ireland - Designers, take yourselves more seriously.
UX Ireland - Designers, take yourselves more seriously.UX Ireland - Designers, take yourselves more seriously.
UX Ireland - Designers, take yourselves more seriously.Hi Interactive
 
Beyond The Hamburger Menu, UX Ireland, 10 Nov 2016
Beyond The Hamburger Menu, UX Ireland, 10 Nov 2016Beyond The Hamburger Menu, UX Ireland, 10 Nov 2016
Beyond The Hamburger Menu, UX Ireland, 10 Nov 2016Anna Dahlström
 
Design in Tech Report 2017
Design in Tech Report 2017Design in Tech Report 2017
Design in Tech Report 2017John Maeda
 
How To Run A Great Workshop (Beginner & Advanced)
How To Run A Great Workshop (Beginner & Advanced)How To Run A Great Workshop (Beginner & Advanced)
How To Run A Great Workshop (Beginner & Advanced)Hussein Hallak
 
Arquitectura de la información y SEO - Fernando Maciá en Search Congress Barc...
Arquitectura de la información y SEO - Fernando Maciá en Search Congress Barc...Arquitectura de la información y SEO - Fernando Maciá en Search Congress Barc...
Arquitectura de la información y SEO - Fernando Maciá en Search Congress Barc...Human Level
 
Fernando Maciá: Posicionamiento Web Internacional
Fernando Maciá: Posicionamiento Web InternacionalFernando Maciá: Posicionamiento Web Internacional
Fernando Maciá: Posicionamiento Web InternacionalHuman Level
 
Search marketing: cuando el SEO ya no es suficiente
Search marketing: cuando el SEO ya no es suficienteSearch marketing: cuando el SEO ya no es suficiente
Search marketing: cuando el SEO ya no es suficienteHuman Level
 
TMRC-Avinash Web Analytics 2.0
TMRC-Avinash Web Analytics 2.0TMRC-Avinash Web Analytics 2.0
TMRC-Avinash Web Analytics 2.0Gemma Muñoz
 
Conversion Thursday Madrid Nov-08
Conversion Thursday Madrid Nov-08Conversion Thursday Madrid Nov-08
Conversion Thursday Madrid Nov-08Gemma Muñoz
 
Practitioner Gemma
Practitioner GemmaPractitioner Gemma
Practitioner GemmaGemma Muñoz
 
Analitica Web Salvaje
Analitica Web SalvajeAnalitica Web Salvaje
Analitica Web SalvajeGemma Muñoz
 
Sacar jugo a la analítica web
Sacar jugo a la analítica webSacar jugo a la analítica web
Sacar jugo a la analítica webGemma Muñoz
 
Analitica web y Redes Sociales
Analitica web y Redes SocialesAnalitica web y Redes Sociales
Analitica web y Redes SocialesGemma Muñoz
 
SEO para E-Commerce - Raul Carrión
SEO para E-Commerce - Raul CarriónSEO para E-Commerce - Raul Carrión
SEO para E-Commerce - Raul CarriónHuman Level
 
Posicionamiento internacional en buscadores ft walqa fernando maciá
Posicionamiento internacional en buscadores ft walqa fernando maciáPosicionamiento internacional en buscadores ft walqa fernando maciá
Posicionamiento internacional en buscadores ft walqa fernando maciáHuman Level
 
SEO para E-Commerce - Fernando Maciá - SmashTech Barcelona 2014
SEO para E-Commerce - Fernando Maciá - SmashTech Barcelona 2014SEO para E-Commerce - Fernando Maciá - SmashTech Barcelona 2014
SEO para E-Commerce - Fernando Maciá - SmashTech Barcelona 2014Human Level
 
Analítica Web y SEO: análisis y segmentación de fuentes de tráfico - Human Le...
Analítica Web y SEO: análisis y segmentación de fuentes de tráfico - Human Le...Analítica Web y SEO: análisis y segmentación de fuentes de tráfico - Human Le...
Analítica Web y SEO: análisis y segmentación de fuentes de tráfico - Human Le...Human Level
 
Impacto de Internet sobre la actividad comercial - IX Feria de Tiendas Virtua...
Impacto de Internet sobre la actividad comercial - IX Feria de Tiendas Virtua...Impacto de Internet sobre la actividad comercial - IX Feria de Tiendas Virtua...
Impacto de Internet sobre la actividad comercial - IX Feria de Tiendas Virtua...Human Level
 
MEDIR EL ROI EN UX - MIDIENDO LO INTANGIBLE
MEDIR EL ROI EN UX - MIDIENDO LO INTANGIBLEMEDIR EL ROI EN UX - MIDIENDO LO INTANGIBLE
MEDIR EL ROI EN UX - MIDIENDO LO INTANGIBLEGemma Muñoz
 

Viewers also liked (20)

A framework for workshop facilitation - UX Ireland 2016
A framework for workshop facilitation - UX Ireland 2016A framework for workshop facilitation - UX Ireland 2016
A framework for workshop facilitation - UX Ireland 2016
 
UX Ireland - Designers, take yourselves more seriously.
UX Ireland - Designers, take yourselves more seriously.UX Ireland - Designers, take yourselves more seriously.
UX Ireland - Designers, take yourselves more seriously.
 
Beyond The Hamburger Menu, UX Ireland, 10 Nov 2016
Beyond The Hamburger Menu, UX Ireland, 10 Nov 2016Beyond The Hamburger Menu, UX Ireland, 10 Nov 2016
Beyond The Hamburger Menu, UX Ireland, 10 Nov 2016
 
Design in Tech Report 2017
Design in Tech Report 2017Design in Tech Report 2017
Design in Tech Report 2017
 
How To Run A Great Workshop (Beginner & Advanced)
How To Run A Great Workshop (Beginner & Advanced)How To Run A Great Workshop (Beginner & Advanced)
How To Run A Great Workshop (Beginner & Advanced)
 
Arquitectura de la información y SEO - Fernando Maciá en Search Congress Barc...
Arquitectura de la información y SEO - Fernando Maciá en Search Congress Barc...Arquitectura de la información y SEO - Fernando Maciá en Search Congress Barc...
Arquitectura de la información y SEO - Fernando Maciá en Search Congress Barc...
 
Fernando Maciá: Posicionamiento Web Internacional
Fernando Maciá: Posicionamiento Web InternacionalFernando Maciá: Posicionamiento Web Internacional
Fernando Maciá: Posicionamiento Web Internacional
 
Search marketing: cuando el SEO ya no es suficiente
Search marketing: cuando el SEO ya no es suficienteSearch marketing: cuando el SEO ya no es suficiente
Search marketing: cuando el SEO ya no es suficiente
 
TMRC-Avinash Web Analytics 2.0
TMRC-Avinash Web Analytics 2.0TMRC-Avinash Web Analytics 2.0
TMRC-Avinash Web Analytics 2.0
 
Conversion Thursday Madrid Nov-08
Conversion Thursday Madrid Nov-08Conversion Thursday Madrid Nov-08
Conversion Thursday Madrid Nov-08
 
Practitioner Gemma
Practitioner GemmaPractitioner Gemma
Practitioner Gemma
 
Analitica Web Salvaje
Analitica Web SalvajeAnalitica Web Salvaje
Analitica Web Salvaje
 
Sacar jugo a la analítica web
Sacar jugo a la analítica webSacar jugo a la analítica web
Sacar jugo a la analítica web
 
Analitica web y Redes Sociales
Analitica web y Redes SocialesAnalitica web y Redes Sociales
Analitica web y Redes Sociales
 
SEO para E-Commerce - Raul Carrión
SEO para E-Commerce - Raul CarriónSEO para E-Commerce - Raul Carrión
SEO para E-Commerce - Raul Carrión
 
Posicionamiento internacional en buscadores ft walqa fernando maciá
Posicionamiento internacional en buscadores ft walqa fernando maciáPosicionamiento internacional en buscadores ft walqa fernando maciá
Posicionamiento internacional en buscadores ft walqa fernando maciá
 
SEO para E-Commerce - Fernando Maciá - SmashTech Barcelona 2014
SEO para E-Commerce - Fernando Maciá - SmashTech Barcelona 2014SEO para E-Commerce - Fernando Maciá - SmashTech Barcelona 2014
SEO para E-Commerce - Fernando Maciá - SmashTech Barcelona 2014
 
Analítica Web y SEO: análisis y segmentación de fuentes de tráfico - Human Le...
Analítica Web y SEO: análisis y segmentación de fuentes de tráfico - Human Le...Analítica Web y SEO: análisis y segmentación de fuentes de tráfico - Human Le...
Analítica Web y SEO: análisis y segmentación de fuentes de tráfico - Human Le...
 
Impacto de Internet sobre la actividad comercial - IX Feria de Tiendas Virtua...
Impacto de Internet sobre la actividad comercial - IX Feria de Tiendas Virtua...Impacto de Internet sobre la actividad comercial - IX Feria de Tiendas Virtua...
Impacto de Internet sobre la actividad comercial - IX Feria de Tiendas Virtua...
 
MEDIR EL ROI EN UX - MIDIENDO LO INTANGIBLE
MEDIR EL ROI EN UX - MIDIENDO LO INTANGIBLEMEDIR EL ROI EN UX - MIDIENDO LO INTANGIBLE
MEDIR EL ROI EN UX - MIDIENDO LO INTANGIBLE
 

Similar to Content is king - Designing a Citizen-Centred Local Government Website

Geschäftliches Potential für System-Integratoren und Berater - Graphdatenban...
Geschäftliches Potential für System-Integratoren und Berater -  Graphdatenban...Geschäftliches Potential für System-Integratoren und Berater -  Graphdatenban...
Geschäftliches Potential für System-Integratoren und Berater - Graphdatenban...Neo4j
 
Cracking the Code of Managing The Chaos Of Everyday Project Management
Cracking the Code of Managing The Chaos Of Everyday Project ManagementCracking the Code of Managing The Chaos Of Everyday Project Management
Cracking the Code of Managing The Chaos Of Everyday Project ManagementFishbowl Solutions
 
Jim cassidy presentation
Jim cassidy presentationJim cassidy presentation
Jim cassidy presentationkmelliott
 
Responsive Web Design - Why and How
Responsive Web Design - Why and HowResponsive Web Design - Why and How
Responsive Web Design - Why and HowJudi Wunderlich
 
Let's get accessible!
Let's get accessible!Let's get accessible!
Let's get accessible!Tady Walsh
 
Agents for Agility - The Just-in-Time Enterprise Has Arrived
Agents for Agility - The Just-in-Time Enterprise Has ArrivedAgents for Agility - The Just-in-Time Enterprise Has Arrived
Agents for Agility - The Just-in-Time Enterprise Has ArrivedInside Analysis
 
BarCamp Sd Microformats
BarCamp Sd MicroformatsBarCamp Sd Microformats
BarCamp Sd MicroformatsJoshua Brewer
 
Web Design Solutions
Web Design Solutions Web Design Solutions
Web Design Solutions APARNA SANAKA
 
How to create accessible websites - Web Accessibility Summit
How to create accessible websites - Web Accessibility SummitHow to create accessible websites - Web Accessibility Summit
How to create accessible websites - Web Accessibility SummitRachel Cherry
 
Big Data Overview for Chinese University of Hong Kong Centre for Innovation a...
Big Data Overview for Chinese University of Hong Kong Centre for Innovation a...Big Data Overview for Chinese University of Hong Kong Centre for Innovation a...
Big Data Overview for Chinese University of Hong Kong Centre for Innovation a...orcsab
 
Enabling Data centric Teams
Enabling Data centric TeamsEnabling Data centric Teams
Enabling Data centric TeamsData Con LA
 
DITA and Information Architecture for Responsive Web Design
DITA and Information Architecture for Responsive Web DesignDITA and Information Architecture for Responsive Web Design
DITA and Information Architecture for Responsive Web Designdclsocialmedia
 
Information Architecture in Real Life - Part I
Information Architecture in Real Life - Part IInformation Architecture in Real Life - Part I
Information Architecture in Real Life - Part IAre Halland
 
Marvin Platform – Potencializando equipes de Machine Learning
Marvin Platform – Potencializando equipes de Machine LearningMarvin Platform – Potencializando equipes de Machine Learning
Marvin Platform – Potencializando equipes de Machine LearningDaniel Takabayashi, MSc
 
BA as Digital Systems Analyst
BA as Digital Systems AnalystBA as Digital Systems Analyst
BA as Digital Systems AnalystSQALab
 
Disruptive Technology in Architecture
Disruptive Technology in ArchitectureDisruptive Technology in Architecture
Disruptive Technology in Architecturekvetcher
 
Web3.0 or The semantic web
Web3.0 or The semantic webWeb3.0 or The semantic web
Web3.0 or The semantic webDarren Wood
 
Why IT needs more IT Architects (IASA style)
Why IT needs more IT Architects (IASA style)Why IT needs more IT Architects (IASA style)
Why IT needs more IT Architects (IASA style)Paddy Baxter
 
Who Wants to Become an IT Architect-A Look at the Bigger Picture - DigitalXch...
Who Wants to Become an IT Architect-A Look at the Bigger Picture - DigitalXch...Who Wants to Become an IT Architect-A Look at the Bigger Picture - DigitalXch...
Who Wants to Become an IT Architect-A Look at the Bigger Picture - DigitalXch...Lucas Jellema
 
Data-Driven Design for User Experience
Data-Driven Design for User Experience Data-Driven Design for User Experience
Data-Driven Design for User Experience Emi Kwon
 

Similar to Content is king - Designing a Citizen-Centred Local Government Website (20)

Geschäftliches Potential für System-Integratoren und Berater - Graphdatenban...
Geschäftliches Potential für System-Integratoren und Berater -  Graphdatenban...Geschäftliches Potential für System-Integratoren und Berater -  Graphdatenban...
Geschäftliches Potential für System-Integratoren und Berater - Graphdatenban...
 
Cracking the Code of Managing The Chaos Of Everyday Project Management
Cracking the Code of Managing The Chaos Of Everyday Project ManagementCracking the Code of Managing The Chaos Of Everyday Project Management
Cracking the Code of Managing The Chaos Of Everyday Project Management
 
Jim cassidy presentation
Jim cassidy presentationJim cassidy presentation
Jim cassidy presentation
 
Responsive Web Design - Why and How
Responsive Web Design - Why and HowResponsive Web Design - Why and How
Responsive Web Design - Why and How
 
Let's get accessible!
Let's get accessible!Let's get accessible!
Let's get accessible!
 
Agents for Agility - The Just-in-Time Enterprise Has Arrived
Agents for Agility - The Just-in-Time Enterprise Has ArrivedAgents for Agility - The Just-in-Time Enterprise Has Arrived
Agents for Agility - The Just-in-Time Enterprise Has Arrived
 
BarCamp Sd Microformats
BarCamp Sd MicroformatsBarCamp Sd Microformats
BarCamp Sd Microformats
 
Web Design Solutions
Web Design Solutions Web Design Solutions
Web Design Solutions
 
How to create accessible websites - Web Accessibility Summit
How to create accessible websites - Web Accessibility SummitHow to create accessible websites - Web Accessibility Summit
How to create accessible websites - Web Accessibility Summit
 
Big Data Overview for Chinese University of Hong Kong Centre for Innovation a...
Big Data Overview for Chinese University of Hong Kong Centre for Innovation a...Big Data Overview for Chinese University of Hong Kong Centre for Innovation a...
Big Data Overview for Chinese University of Hong Kong Centre for Innovation a...
 
Enabling Data centric Teams
Enabling Data centric TeamsEnabling Data centric Teams
Enabling Data centric Teams
 
DITA and Information Architecture for Responsive Web Design
DITA and Information Architecture for Responsive Web DesignDITA and Information Architecture for Responsive Web Design
DITA and Information Architecture for Responsive Web Design
 
Information Architecture in Real Life - Part I
Information Architecture in Real Life - Part IInformation Architecture in Real Life - Part I
Information Architecture in Real Life - Part I
 
Marvin Platform – Potencializando equipes de Machine Learning
Marvin Platform – Potencializando equipes de Machine LearningMarvin Platform – Potencializando equipes de Machine Learning
Marvin Platform – Potencializando equipes de Machine Learning
 
BA as Digital Systems Analyst
BA as Digital Systems AnalystBA as Digital Systems Analyst
BA as Digital Systems Analyst
 
Disruptive Technology in Architecture
Disruptive Technology in ArchitectureDisruptive Technology in Architecture
Disruptive Technology in Architecture
 
Web3.0 or The semantic web
Web3.0 or The semantic webWeb3.0 or The semantic web
Web3.0 or The semantic web
 
Why IT needs more IT Architects (IASA style)
Why IT needs more IT Architects (IASA style)Why IT needs more IT Architects (IASA style)
Why IT needs more IT Architects (IASA style)
 
Who Wants to Become an IT Architect-A Look at the Bigger Picture - DigitalXch...
Who Wants to Become an IT Architect-A Look at the Bigger Picture - DigitalXch...Who Wants to Become an IT Architect-A Look at the Bigger Picture - DigitalXch...
Who Wants to Become an IT Architect-A Look at the Bigger Picture - DigitalXch...
 
Data-Driven Design for User Experience
Data-Driven Design for User Experience Data-Driven Design for User Experience
Data-Driven Design for User Experience
 

Recently uploaded

UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024mikailaoh
 
How to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPTHow to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPTThink 360 Studio
 
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfBuilding+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfsaidbilgen
 
Cold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxCold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxSamKuruvilla5
 
The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024Alan Dix
 
Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...khushisharma298853
 
Embroidery design from embroidery magazine
Embroidery design from embroidery magazineEmbroidery design from embroidery magazine
Embroidery design from embroidery magazineRivanEleraki
 
High-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillHigh-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillCre8iveskill
 
Mike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtMike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtTeeFusion
 
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxWCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxHasan S
 
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Amil baba
 
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Ted Drake
 
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLMath Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLkenzukiri
 
LRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfLRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfHctorFranciscoSnchez1
 
Create Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.comCreate Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.comjakyjhon00
 
Production of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxProduction of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxb2kshani34
 
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Ed Orozco
 
Construction Documents Checklist before Construction
Construction Documents Checklist before ConstructionConstruction Documents Checklist before Construction
Construction Documents Checklist before ConstructionResDraft
 
Designing for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsDesigning for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsBlock Party
 

Recently uploaded (19)

UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024
 
How to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPTHow to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPT
 
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfBuilding+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
 
Cold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxCold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptx
 
The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024
 
Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...
 
Embroidery design from embroidery magazine
Embroidery design from embroidery magazineEmbroidery design from embroidery magazine
Embroidery design from embroidery magazine
 
High-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillHigh-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkill
 
Mike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtMike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy Shirt
 
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxWCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
 
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
 
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
 
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLMath Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
 
LRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfLRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdf
 
Create Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.comCreate Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.com
 
Production of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxProduction of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptx
 
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
 
Construction Documents Checklist before Construction
Construction Documents Checklist before ConstructionConstruction Documents Checklist before Construction
Construction Documents Checklist before Construction
 
Designing for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsDesigning for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teams
 

Content is king - Designing a Citizen-Centred Local Government Website

  • 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
  • 5. What I’ll cover… 1. Background 2. Project Goals 3. Context 4. Design Process 5. Design Principles 6. Challenges 7. Quick Recap
  • 6. 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
  • 7. 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
  • 8. Context New dlrcoco Website Existing dlr Libraries Website Existing dlr Events Website Search Events News
  • 9. 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
  • 10. What we have THE PROCESS: RESEARCH Customer Surveys Pain Points Website Analytics Popular Content Customer Calls Nature of Enquiries
  • 11. 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
  • 13. 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
  • 14. Content Audit THE PROCESS: RESEARCH No Clear Structure Content Maze Alphabetised Navigation Guessing Game External Google Search Lack of Context
  • 15. Content Audit THE PROCESS: RESEARCH Content Publishing Dependent on the IT Department Bottleneck
  • 16. Information Architecture THE PROCESS: TAXONOMIES & HIERARCHY Content “I Want Information & Services” Citizens “I Work in This Department” Content Editors
  • 17. Content Tags “I Want Information & Services” Citizens “I Work in This Department” Content Editors Information Architecture THE PROCESS: TAXONOMIES & HIERARCHY
  • 18. Onboard & Train Content Editors across All Departments Streamlined Process Information Architecture THE PROCESS: TAXONOMIES & HIERARCHY
  • 20. Service Listings Generic Content Pages Micro-sites: Parks, Arts News FAQs Documents Events EMERGING THEMES & CONTENT TYPES Information Architecture THE PROCESS: TAXONOMIES & HIERARCHY
  • 21. Solution Planning THE PROCESS: SKETCH & WIREFRAME
  • 22. Design Principles Mobile Mindset Facts over Assumptions Tunneling Distributed Content Define. Design. Test. Repeat.
  • 23. Design Process THE PROCESS: SKETCH, WIREFRAME, DESIGN Rough & Disposable Sketches Pen & Paper Prototype & Test Greyboxing UI & Style Guide Pixel Pushing
  • 24. Solution Design THE PROCESS: SKETCH, WIREFRAME, DESIGN V.1 V.2 V.5 V.7
  • 25. Solution Design THE PROCESS: SKETCH, WIREFRAME, DESIGN V.21
  • 26. Design Challenges THE PROCESS: SKETCH, WIREFRAME, DESIGN 1. Deep Navigation 2. Powerful Search 3. Contextual Indicators 4. Distributed Content
  • 27. 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
  • 28. The Burger Menu DESIGN CHALLENGES: NAVIGATION
  • 29. The Burger Menu DESIGN CHALLENGES: NAVIGATION
  • 30. 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
  • 32. Search DESIGN CHALLENGES: NAVIGATION Search Term Predictive Results Direct Results Links
  • 33. Contextual Indicators DESIGN CHALLENGES: NAVIGATION Back Button Breadcrumbs Service Type
  • 34. DESIGN CHALLENGES: INFORMATION ARCHITECTURE Distributed Content
  • 35. Distributed Content DESIGN CHALLENGES: INFORMATION ARCHITECTURE
  • 36. 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
  • 37. – 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.”
  • 38. Thank you. Get in touch daniel.alb@monsoonconsulting.com @danielalbro