Upload
daniel-alb
View
1.074
Download
0
Embed Size (px)
Citation preview
Content is Kingthe DNA of designing a citizen-centred local authority website for
dlr County Council
Daniel AlbDesign Lead @ Monsoon Consulting
[email protected] @danielalbro
What to expect?
Layers A-HA! Moments OH CRAP! Problem
SolvingOccasional Bragging
What I’ll cover…1. Background 2. Project Goals 3. Context 4. Design Process 5. Design Principles 6. Challenges 7. Quick Recap
BackgroundTotal 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 Process1. 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 haveTHE PROCESS: RESEARCH
Customer SurveysPain Points
Website AnalyticsPopular Content
Customer CallsNature of Enquiries
Website AudiencesTHE 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 InterviewsTHE 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 AuditTHE PROCESS: RESEARCH
No Clear StructureContent Maze
Alphabetised NavigationGuessing Game
External Google SearchLack of Context
Content AuditTHE PROCESS: RESEARCH
Content Publishing Dependent on the IT DepartmentBottleneck
Information ArchitectureTHE 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 ArchitectureTHE PROCESS: TAXONOMIES & HIERARCHY
Onboard & Train Content Editors across All DepartmentsStreamlined Process
Information ArchitectureTHE PROCESS: TAXONOMIES & HIERARCHY
Service Listings Generic Content Pages Micro-sites: Parks, Arts News FAQs Documents Events
EMERGING THEMES &CONTENT TYPES
Information ArchitectureTHE PROCESS: TAXONOMIES & HIERARCHY
Solution PlanningTHE PROCESS: SKETCH & WIREFRAME
Design Principles
Mobile Mindset Facts over Assumptions Tunneling Distributed
ContentDefine. Design. Test. Repeat.
Design ProcessTHE PROCESS: SKETCH, WIREFRAME, DESIGN
Rough & Disposable SketchesPen & Paper
Prototype & TestGreyboxing
UI & Style GuidePixel Pushing
Solution DesignTHE PROCESS: SKETCH, WIREFRAME, DESIGN
V.1
V.2
V.5
V.7
Solution DesignTHE PROCESS: SKETCH, WIREFRAME, DESIGN
V.21
Design ChallengesTHE PROCESS: SKETCH, WIREFRAME, DESIGN
1. Deep Navigation 2. Powerful Search 3. Contextual Indicators 4. Distributed Content
The Burger MenuDESIGN 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 MenuDESIGN CHALLENGES: NAVIGATION
The Burger MenuDESIGN CHALLENGES: NAVIGATION
SearchDESIGN 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
SearchDESIGN CHALLENGES: NAVIGATION
SearchDESIGN CHALLENGES: NAVIGATION
Search TermPredictive Results
Direct Results Links
Contextual IndicatorsDESIGN CHALLENGES: NAVIGATION
Back Button
Breadcrumbs
Service Type
DESIGN CHALLENGES: INFORMATION ARCHITECTURE
Distributed Content
Distributed ContentDESIGN CHALLENGES: INFORMATION ARCHITECTURE
Enterprise ContentQUICK 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
[email protected] @danielalbro