Digitalisation of Design Codes
Client: Ministry of Housing and Local Government
Role: Interaction Designer and Lead Researcher
TL;DR: Design Codes
Design codes are hard to write, find, and use. I built and tested an AI-assisted writing tool to improve clarity and consistency, along with a map-based search to make codes faster to produce and easier to apply in real projects.
What are Design Codes — and what’s wrong with them?
Design Codes set the rules/policy for how places are built — things like how tall buildings can be, how far apart trees should sit, or what materials are allowed. They’re published by local councils and used when making planning applications.
But they’re often difficult to use:
- Hard to find — hidden in 300-page PDFs
- Inconsistent — every council does it differently
- Unclear — language is vague and not actionable for developers who abide by them
- Slow — they take a long time to create and update
Client Objectives
1
Design and test a new service for creating better Design Codes
Map user journeys, build prototype screens, and test concepts to support code writers in producing clearer, more consistent guidance.
2
Understand user groups and their needs
Identify and map the different types of users — those who write codes and those who use them — through research and prototype testing.
3
Define what the MVP could look like
Explore service and technical feasibility and outline the core features needed for an initial minimum viable product.
Discovery Research & Mapping User Flows
Discovering research was conducted through workshops and interviews with expert user groups consisting of local authorities and architectural consultants responsible for creating design codes. Data was analysed and put together a comprehensive flow of the design coding process.
Mocking up Wireframes
High-level user needs and design coding pain points were identified during discovery and informed the creation of initial wireframes, which were developed using the GOV.UK Design System. These wireframes were validated with client stakeholders through iterative stages of refinement before being concept-tested with participants.
Testing Assumptions
I built a series of high-fidelity, interactive prototypes with v0.dev to test how users understand, write, and find design codes.
Because we were exploring reactions to AI suggestions in an expert field, realistic prototypes were essential.
Right Place Right time Guidance
We tested content design patterns using examples of good and bad design codes to understand how people interpret national guidance.
Insight: Contextual, “just-in-time” guidance can support users without replacing expertise — showing the value of consistent language across varied local contexts.
How to provide feedback?
Tested LLM-powered feedback on user-written requirements.Users liked the clarity prompts but stressed the need for context-sensitive feedback.Action: Refine feedback to reflect real-world scenarios and avoid generic suggestions.
Image before text or text before image?
We tested where images fit in the writing process and how easy forms of annotation could empower councils to produce images themselves rather than use consultants.
Findability for decision makers
We explored how end users — such as developers and planning officers — search for and review design code information.
This helped us identify what makes design codes easier to find, understand, and act on.
- Developing archetypes of design code writers
Creation of Archetypes
:
Matrix Analysis
- We plotted the archetypes on a matrix to show the service’s impact across different user groups and their needs.
If we focus on these participants it may be more of a publishing and collaboration tool
If we focus on these participants it may be more of a guidance process scaffolding tool
- We defined the strategic direction of the research to shape the MVP and identify the user group for the private beta trial.
User research showed the design code builder delivers value through guidance for writing codes and tools for creating visuals. Its usefulness depended on each LPA’s expertise and capacity.
Mapping Service Insights and Establishing MVP Flow
We mapped the service journey to identify user breaking points and linked these to the mindsets where the service had the most impact. This helped clarify which features — within and beyond the core service — shaped the final value proposition flow.
Global Service map incorporating archetypes experience
MVP Feature Proposition
Mapping alternative flows
Outputs
1
Validated service concept and mapped user journeys
Delivered conclusive concept validation and mapped the service flow, defining how the new approach could work end-to-end.
2
User research insights and audience archetypes
Produced a research report outlining key user types, their needs, and strategies for engaging the most impactful groups.
3
Defined MVP and next steps
Established a clear MVP path and technical feasibility, with recommendations and next steps handed over for build.
Credits
Conclusion
DevOpsTess B
Data EngineerDan K
Project LeadTonya B
Client IllustratorSirdeep S
Client LeadMatt P
Service DesignSergei W
conclusion about how we decided on an mvp based on
Digitalisation of Design Codes
Client: Ministry of Housing and Local Government
Role: Interaction Designer and Lead Researcher
TL;DR: Design Codes
Design codes are hard to write, find, and use. I built and tested an AI-assisted writing tool to improve clarity and consistency, along with a map-based search to make codes faster to produce and easier to apply in real projects.
What are Design Codes — and what’s wrong with them?
Design Codes set the rules/policy for how places are built — things like how tall buildings can be, how far apart trees should sit, or what materials are allowed. They’re published by local councils and used when making planning applications.
But they’re often difficult to use:
- Hard to find — hidden in 300-page PDFs
- Inconsistent — every council does it differently
- Unclear — language is vague and not actionable for developers who abide by them
- Slow — they take a long time to create and update
Client Objectives
1
Design and test a new service for creating better Design Codes
Map user journeys, build prototype screens, and test concepts to support code writers in producing clearer, more consistent guidance.
2
Understand user groups and their needs
Identify and map the different types of users — those who write codes and those who use them — through research and prototype testing.
3
Define what the MVP could look like
Explore service and technical feasibility and outline the core features needed for an initial minimum viable product.
Discovery Research & Mapping User Flows
Discovering research was conducted through workshops and interviews with expert user groups consisting of local authorities and architectural consultants responsible for creating design codes. Data was analysed and put together a comprehensive flow of the design coding process.
Mocking up Wireframes
High-level user needs and design coding pain points were identified during discovery and informed the creation of initial wireframes, which were developed using the GOV.UK Design System. These wireframes were validated with client stakeholders through iterative stages of refinement before being concept-tested with participants.
Testing Assumptions
I built a series of high-fidelity, interactive prototypes with v0.dev to test how users understand, write, and find design codes.
Because we were exploring reactions to AI suggestions in an expert field, realistic prototypes were essential.
Right Place Right time Guidance
We tested content design patterns using examples of good and bad design codes to understand how people interpret national guidance.
Insight: Contextual, “just-in-time” guidance can support users without replacing expertise — showing the value of consistent language across varied local contexts.
How to provide feedback?
Tested LLM-powered feedback on user-written requirements.Users liked the clarity prompts but stressed the need for context-sensitive feedback.Action: Refine feedback to reflect real-world scenarios and avoid generic suggestions.
Image before text or text before image?
We tested where images fit in the writing process and how easy forms of annotation could empower councils to produce images themselves rather than use consultants.
Findability for decision makers
We explored how end users — such as developers and planning officers — search for and review design code information.
This helped us identify what makes design codes easier to find, understand, and act on.
- Developing archetypes of design code writers
Creation of Archetypes
:
Matrix Analysis
- We plotted the archetypes on a matrix to show the service’s impact across different user groups and their needs.
If we focus on these participants it may be more of a publishing and collaboration tool
If we focus on these participants it may be more of a guidance process scaffolding tool
- We defined the strategic direction of the research to shape the MVP and identify the user group for the private beta trial.
User research showed the design code builder delivers value through guidance for writing codes and tools for creating visuals. Its usefulness depended on each LPA’s expertise and capacity.
Mapping Service Insights and Establishing MVP Flow
We mapped the service journey to identify user breaking points and linked these to the mindsets where the service had the most impact. This helped clarify which features — within and beyond the core service — shaped the final value proposition flow.
Global Service map incorporating archetypes experience
MVP Feature Proposition
Mapping alternative flows
Outputs
1
Validated service concept and mapped user journeys
Delivered conclusive concept validation and mapped the service flow, defining how the new approach could work end-to-end.
2
User research insights and audience archetypes
Produced a research report outlining key user types, their needs, and strategies for engaging the most impactful groups.
3
Defined MVP and next steps
Established a clear MVP path and technical feasibility, with recommendations and next steps handed over for build.
Credits
Conclusion
DevOpsTess B
Data EngineerDan K
Project LeadTonya B
Client IllustratorSirdeep S
Client LeadMatt P
Service DesignSergei W
conclusion about how we decided on an mvp based on
Digitalisation of Design Codes
Client: Ministry of Housing and Local Government
Role: Interaction Designer and Lead Researcher
TL;DR: Design Codes
Design codes are hard to write, find, and use. I built and tested an AI-assisted writing tool to improve clarity and consistency, along with a map-based search to make codes faster to produce and easier to apply in real projects.
What are Design Codes — and what’s wrong with them?
Design Codes set the rules/policy for how places are built — things like how tall buildings can be, how far apart trees should sit, or what materials are allowed. They’re published by local councils and used when making planning applications.
But they’re often difficult to use:
- Hard to find — hidden in 300-page PDFs
- Inconsistent — every council does it differently
- Unclear — language is vague and not actionable for developers who abide by them
- Slow — they take a long time to create and update
Client Objectives
1
Design and test a new service for creating better Design Codes
Map user journeys, build prototype screens, and test concepts to support code writers in producing clearer, more consistent guidance.
2
Understand user groups and their needs
Identify and map the different types of users — those who write codes and those who use them — through research and prototype testing.
3
Define what the MVP could look like
Explore service and technical feasibility and outline the core features needed for an initial minimum viable product.
Discovery Research & Mapping User Flows
Discovering research was conducted through workshops and interviews with expert user groups consisting of local authorities and architectural consultants responsible for creating design codes. Data was analysed and put together a comprehensive flow of the design coding process.
Mocking up Wireframes
High-level user needs and design coding pain points were identified during discovery and informed the creation of initial wireframes, which were developed using the GOV.UK Design System. These wireframes were validated with client stakeholders through iterative stages of refinement before being concept-tested with participants.
Testing Assumptions
I built a series of high-fidelity, interactive prototypes with v0.dev to test how users understand, write, and find design codes.
Because we were exploring reactions to AI suggestions in an expert field, realistic prototypes were essential.
Right Place Right time Guidance
We tested content design patterns using examples of good and bad design codes to understand how people interpret national guidance.
Insight: Contextual, “just-in-time” guidance can support users without replacing expertise — showing the value of consistent language across varied local contexts.
How to provide feedback?
Tested LLM-powered feedback on user-written requirements.Users liked the clarity prompts but stressed the need for context-sensitive feedback.Action: Refine feedback to reflect real-world scenarios and avoid generic suggestions.
Image before text or text before image?
We tested where images fit in the writing process and how easy forms of annotation could empower councils to produce images themselves rather than use consultants.
Findability for decision makers
We explored how end users — such as developers and planning officers — search for and review design code information.
This helped us identify what makes design codes easier to find, understand, and act on.
- Developing archetypes of design code writers
Creation of Archetypes
:
Matrix Analysis
- We plotted the archetypes on a matrix to show the service’s impact across different user groups and their needs.
If we focus on these participants it may be more of a publishing and collaboration tool
If we focus on these participants it may be more of a guidance process scaffolding tool
- We defined the strategic direction of the research to shape the MVP and identify the user group for the private beta trial.
User research showed the design code builder delivers value through guidance for writing codes and tools for creating visuals. Its usefulness depended on each LPA’s expertise and capacity.
Mapping Service Insights and Establishing MVP Flow
We mapped the service journey to identify user breaking points and linked these to the mindsets where the service had the most impact. This helped clarify which features — within and beyond the core service — shaped the final value proposition flow.
Global Service map incorporating archetypes experience
MVP Feature Proposition
Mapping alternative flows
Outputs
1
Validated service concept and mapped user journeys
Delivered conclusive concept validation and mapped the service flow, defining how the new approach could work end-to-end.
2
User research insights and audience archetypes
Produced a research report outlining key user types, their needs, and strategies for engaging the most impactful groups.
3
Defined MVP and next steps
Established a clear MVP path and technical feasibility, with recommendations and next steps handed over for build.
Credits
Conclusion
DevOpsTess B
Data EngineerDan K
Project LeadTonya B
Client IllustratorSirdeep S
Client LeadMatt P
Service DesignSergei W
conclusion about how we decided on an mvp based on