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
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
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
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

DAKSHIN BIHAR GRAMIN BANK: REDEFINING THE DIGITAL BANKING EXPERIENCE WITH A U...
DAKSHIN BIHAR GRAMIN BANK: REDEFINING THE DIGITAL BANKING EXPERIENCE WITH A U...DAKSHIN BIHAR GRAMIN BANK: REDEFINING THE DIGITAL BANKING EXPERIENCE WITH A U...
DAKSHIN BIHAR GRAMIN BANK: REDEFINING THE DIGITAL BANKING EXPERIENCE WITH A U...Rishabh Aryan
 
(办理学位证)约克圣约翰大学毕业证,KCL成绩单原版一比一
(办理学位证)约克圣约翰大学毕业证,KCL成绩单原版一比一(办理学位证)约克圣约翰大学毕业证,KCL成绩单原版一比一
(办理学位证)约克圣约翰大学毕业证,KCL成绩单原版一比一D SSS
 
办理澳大利亚国立大学毕业证ANU毕业证留信学历认证
办理澳大利亚国立大学毕业证ANU毕业证留信学历认证办理澳大利亚国立大学毕业证ANU毕业证留信学历认证
办理澳大利亚国立大学毕业证ANU毕业证留信学历认证jdkhjh
 
General Knowledge Quiz Game C++ CODE.pptx
General Knowledge Quiz Game C++ CODE.pptxGeneral Knowledge Quiz Game C++ CODE.pptx
General Knowledge Quiz Game C++ CODE.pptxmarckustrevion
 
Business research proposal mcdo.pptxBusiness research proposal mcdo.pptxBusin...
Business research proposal mcdo.pptxBusiness research proposal mcdo.pptxBusin...Business research proposal mcdo.pptxBusiness research proposal mcdo.pptxBusin...
Business research proposal mcdo.pptxBusiness research proposal mcdo.pptxBusin...mrchrns005
 
办理(UC毕业证书)查尔斯顿大学毕业证成绩单原版一比一
办理(UC毕业证书)查尔斯顿大学毕业证成绩单原版一比一办理(UC毕业证书)查尔斯顿大学毕业证成绩单原版一比一
办理(UC毕业证书)查尔斯顿大学毕业证成绩单原版一比一z xss
 
昆士兰大学毕业证(UQ毕业证)#文凭成绩单#真实留信学历认证永久存档
昆士兰大学毕业证(UQ毕业证)#文凭成绩单#真实留信学历认证永久存档昆士兰大学毕业证(UQ毕业证)#文凭成绩单#真实留信学历认证永久存档
昆士兰大学毕业证(UQ毕业证)#文凭成绩单#真实留信学历认证永久存档208367051
 
Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Rndexperts
 
Iconic Global Solution - web design, Digital Marketing services
Iconic Global Solution - web design, Digital Marketing servicesIconic Global Solution - web design, Digital Marketing services
Iconic Global Solution - web design, Digital Marketing servicesIconic global solution
 
cda.pptx critical discourse analysis ppt
cda.pptx critical discourse analysis pptcda.pptx critical discourse analysis ppt
cda.pptx critical discourse analysis pptMaryamAfzal41
 
Untitled presedddddddddddddddddntation (1).pptx
Untitled presedddddddddddddddddntation (1).pptxUntitled presedddddddddddddddddntation (1).pptx
Untitled presedddddddddddddddddntation (1).pptxmapanig881
 
原版1:1定制堪培拉大学毕业证(UC毕业证)#文凭成绩单#真实留信学历认证永久存档
原版1:1定制堪培拉大学毕业证(UC毕业证)#文凭成绩单#真实留信学历认证永久存档原版1:1定制堪培拉大学毕业证(UC毕业证)#文凭成绩单#真实留信学历认证永久存档
原版1:1定制堪培拉大学毕业证(UC毕业证)#文凭成绩单#真实留信学历认证永久存档208367051
 
Unveiling the Future: Columbus, Ohio Condominiums Through the Lens of 3D Arch...
Unveiling the Future: Columbus, Ohio Condominiums Through the Lens of 3D Arch...Unveiling the Future: Columbus, Ohio Condominiums Through the Lens of 3D Arch...
Unveiling the Future: Columbus, Ohio Condominiums Through the Lens of 3D Arch...Yantram Animation Studio Corporation
 
Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Rndexperts
 
FiveHypotheses_UIDMasterclass_18April2024.pdf
FiveHypotheses_UIDMasterclass_18April2024.pdfFiveHypotheses_UIDMasterclass_18April2024.pdf
FiveHypotheses_UIDMasterclass_18April2024.pdfShivakumar Viswanathan
 
原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degreeyuu sss
 
Call Girls Aslali 7397865700 Ridhima Hire Me Full Night
Call Girls Aslali 7397865700 Ridhima Hire Me Full NightCall Girls Aslali 7397865700 Ridhima Hire Me Full Night
Call Girls Aslali 7397865700 Ridhima Hire Me Full Nightssuser7cb4ff
 
澳洲UQ学位证,昆士兰大学毕业证书1:1制作
澳洲UQ学位证,昆士兰大学毕业证书1:1制作澳洲UQ学位证,昆士兰大学毕业证书1:1制作
澳洲UQ学位证,昆士兰大学毕业证书1:1制作aecnsnzk
 
group_15_empirya_p1projectIndustrial.pdf
group_15_empirya_p1projectIndustrial.pdfgroup_15_empirya_p1projectIndustrial.pdf
group_15_empirya_p1projectIndustrial.pdfneelspinoy
 
(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一
(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一
(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一Fi sss
 

Recently uploaded (20)

DAKSHIN BIHAR GRAMIN BANK: REDEFINING THE DIGITAL BANKING EXPERIENCE WITH A U...
DAKSHIN BIHAR GRAMIN BANK: REDEFINING THE DIGITAL BANKING EXPERIENCE WITH A U...DAKSHIN BIHAR GRAMIN BANK: REDEFINING THE DIGITAL BANKING EXPERIENCE WITH A U...
DAKSHIN BIHAR GRAMIN BANK: REDEFINING THE DIGITAL BANKING EXPERIENCE WITH A U...
 
(办理学位证)约克圣约翰大学毕业证,KCL成绩单原版一比一
(办理学位证)约克圣约翰大学毕业证,KCL成绩单原版一比一(办理学位证)约克圣约翰大学毕业证,KCL成绩单原版一比一
(办理学位证)约克圣约翰大学毕业证,KCL成绩单原版一比一
 
办理澳大利亚国立大学毕业证ANU毕业证留信学历认证
办理澳大利亚国立大学毕业证ANU毕业证留信学历认证办理澳大利亚国立大学毕业证ANU毕业证留信学历认证
办理澳大利亚国立大学毕业证ANU毕业证留信学历认证
 
General Knowledge Quiz Game C++ CODE.pptx
General Knowledge Quiz Game C++ CODE.pptxGeneral Knowledge Quiz Game C++ CODE.pptx
General Knowledge Quiz Game C++ CODE.pptx
 
Business research proposal mcdo.pptxBusiness research proposal mcdo.pptxBusin...
Business research proposal mcdo.pptxBusiness research proposal mcdo.pptxBusin...Business research proposal mcdo.pptxBusiness research proposal mcdo.pptxBusin...
Business research proposal mcdo.pptxBusiness research proposal mcdo.pptxBusin...
 
办理(UC毕业证书)查尔斯顿大学毕业证成绩单原版一比一
办理(UC毕业证书)查尔斯顿大学毕业证成绩单原版一比一办理(UC毕业证书)查尔斯顿大学毕业证成绩单原版一比一
办理(UC毕业证书)查尔斯顿大学毕业证成绩单原版一比一
 
昆士兰大学毕业证(UQ毕业证)#文凭成绩单#真实留信学历认证永久存档
昆士兰大学毕业证(UQ毕业证)#文凭成绩单#真实留信学历认证永久存档昆士兰大学毕业证(UQ毕业证)#文凭成绩单#真实留信学历认证永久存档
昆士兰大学毕业证(UQ毕业证)#文凭成绩单#真实留信学历认证永久存档
 
Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025
 
Iconic Global Solution - web design, Digital Marketing services
Iconic Global Solution - web design, Digital Marketing servicesIconic Global Solution - web design, Digital Marketing services
Iconic Global Solution - web design, Digital Marketing services
 
cda.pptx critical discourse analysis ppt
cda.pptx critical discourse analysis pptcda.pptx critical discourse analysis ppt
cda.pptx critical discourse analysis ppt
 
Untitled presedddddddddddddddddntation (1).pptx
Untitled presedddddddddddddddddntation (1).pptxUntitled presedddddddddddddddddntation (1).pptx
Untitled presedddddddddddddddddntation (1).pptx
 
原版1:1定制堪培拉大学毕业证(UC毕业证)#文凭成绩单#真实留信学历认证永久存档
原版1:1定制堪培拉大学毕业证(UC毕业证)#文凭成绩单#真实留信学历认证永久存档原版1:1定制堪培拉大学毕业证(UC毕业证)#文凭成绩单#真实留信学历认证永久存档
原版1:1定制堪培拉大学毕业证(UC毕业证)#文凭成绩单#真实留信学历认证永久存档
 
Unveiling the Future: Columbus, Ohio Condominiums Through the Lens of 3D Arch...
Unveiling the Future: Columbus, Ohio Condominiums Through the Lens of 3D Arch...Unveiling the Future: Columbus, Ohio Condominiums Through the Lens of 3D Arch...
Unveiling the Future: Columbus, Ohio Condominiums Through the Lens of 3D Arch...
 
Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025
 
FiveHypotheses_UIDMasterclass_18April2024.pdf
FiveHypotheses_UIDMasterclass_18April2024.pdfFiveHypotheses_UIDMasterclass_18April2024.pdf
FiveHypotheses_UIDMasterclass_18April2024.pdf
 
原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
 
Call Girls Aslali 7397865700 Ridhima Hire Me Full Night
Call Girls Aslali 7397865700 Ridhima Hire Me Full NightCall Girls Aslali 7397865700 Ridhima Hire Me Full Night
Call Girls Aslali 7397865700 Ridhima Hire Me Full Night
 
澳洲UQ学位证,昆士兰大学毕业证书1:1制作
澳洲UQ学位证,昆士兰大学毕业证书1:1制作澳洲UQ学位证,昆士兰大学毕业证书1:1制作
澳洲UQ学位证,昆士兰大学毕业证书1:1制作
 
group_15_empirya_p1projectIndustrial.pdf
group_15_empirya_p1projectIndustrial.pdfgroup_15_empirya_p1projectIndustrial.pdf
group_15_empirya_p1projectIndustrial.pdf
 
(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一
(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一
(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一
 

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
  • 4.
  • 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
  • 12.
  • 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
  • 19.
  • 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