As Lead UX Designer at THG, I led a 4-week initiative to optimise the UX design team’s workflows across multiple squads. The goal was to streamline design processes, improve team collaboration, and enhance communication with stakeholders, ensuring scalable and consistent workflows.
The Challenge
Previous initiatives surfaced several operational challenges:
⚠️ Inconsistent Figma file organisation and naming conventions.
⚠️ Inconsistent presentation of work from different team members
⚠️ Lack of clarity in design annotations and prototyping.
⚠️ Misalignment between designs and requirements.
⚠️ Difficulty distinguishing finalised designs from work-in-progress.
⚠️ Inconsistent Figma file organisation and naming conventions.
⚠️ Inconsistent presentation of work from different team members
⚠️ Lack of clarity in design annotations and prototyping.
⚠️ Misalignment between designs and requirements.
⚠️ Difficulty distinguishing finalised designs from work-in-progress.
Actions
•Approaching the challenges
•Naming conventions
•Interaction behaviour & accessibility notes
•Clickable prototypes for all designs
•Behavioural archetype templates
•Training session and resources
•Naming conventions
•Interaction behaviour & accessibility notes
•Clickable prototypes for all designs
•Behavioural archetype templates
•Training session and resources
Approaching the challenges
Stakeholders from product, engineering and the senior leadership team shared operational challenges with my manager (Head of UX). I established a small team with 2 other designers who I knew were passionate about improving workflow operations to collaborate with.
I facilitated a 'How might we' workshop to tackle the challenges head on, giving the team the opportunity to put forward suggestions for how we might solve each problem.
I facilitated a 'How might we' workshop to tackle the challenges head on, giving the team the opportunity to put forward suggestions for how we might solve each problem.
Finalising the scope
The UX leaders aligned on how we were going to solve each problem, putting forward solution ideas to improve our ways of working as a function.
Continue reading to see what a few of these process improvements looked like for the team...
Naming conventions & design flow direction
We introduced a rule to show that progression along the happy path would move left to right within the document, and different screen states would move top to bottom.
Frame titles should have a numeric prefix eg. 1.0, 2.0, 3.0 for key journey steps and 1.1, 1.2, 1.3 for different states. This helped us communicate our designs effectively with stakeholders for reference.
Frame titles should have a numeric prefix eg. 1.0, 2.0, 3.0 for key journey steps and 1.1, 1.2, 1.3 for different states. This helped us communicate our designs effectively with stakeholders for reference.
Interaction behaviour and accessibility notes
There is much more to design than what you can see on a flat wireframe design. This is why we use this section to explain any interaction behavioural expectations, how we might want something to animate in or the transition direction for example.
Accessibility notes are there to show that the consultants have reviewed the designs and are happy it’s compliant with our standards (WCAG 2.1 AA).
Accessibility notes are there to show that the consultants have reviewed the designs and are happy it’s compliant with our standards (WCAG 2.1 AA).
Clickable prototypes for all designs
Ever been in a meeting with a designer and they are flying around the canvas, upwards... downwards... from one side to the other trying to find something? It’s completely distracting.
We made a rule to stop our stakeholders experiencing this motion sickness - for those audiences, interactive prototypes had to be presented to avoid this overwhelming issue.
A bonus advantage of this change was that designers were more thorough with this as a task, improving the overall quality of their deliverables and communication.
We made a rule to stop our stakeholders experiencing this motion sickness - for those audiences, interactive prototypes had to be presented to avoid this overwhelming issue.
A bonus advantage of this change was that designers were more thorough with this as a task, improving the overall quality of their deliverables and communication.
Behavioural archetype templates
We don’t have time to design for every behaviour, in every scenario. But we can start to understand what people are doing, and why. Understanding behaviour helps us deliver the right value, to the right people. This is what it means to be truly customer-centric...
The templates I designed are meant to sit at the start of a design flow to help set the context, communicate pain points and frame design work to effectively solve problems.
Feedback from stakeholders was that it’s fantastic to have this in such close proximity to the designs.
The templates I designed are meant to sit at the start of a design flow to help set the context, communicate pain points and frame design work to effectively solve problems.
Feedback from stakeholders was that it’s fantastic to have this in such close proximity to the designs.
Training session and resources
To support the rollout of these changes to the ways of working, we presented the deck at the top of this page in a full-team session so everyone had visibility of the improvements to the way we should structure our Figma files.
We put together Confluence documentation for new starters, as well as 'what a good job looks like' examples so the team could reference them. Blank starter template files helped designers whenever they had a new project, ensuring they have the correct structure every time.
We put together Confluence documentation for new starters, as well as 'what a good job looks like' examples so the team could reference them. Blank starter template files helped designers whenever they had a new project, ensuring they have the correct structure every time.
Lessons learned
Communication is key: Early alignment with business stakeholders fosters strategic improvements, and providing knowledge-sharing sessions with the UX team ensured smoother adoption of process changes.
Iterate and adapt: Flexibility in refining processes based on feedback is essential and is something we should strive for every single day.
Consistency matters: Clear standards prevent miscommunication and enhance efficiency across teams, freeing up mental bandwidth for creativity and innovation.
These improvements have become the foundation for future UX design projects at THG, and now part of the onboarding process for new starters to learn the team ways of working and expectations of design deliverables.
Iterate and adapt: Flexibility in refining processes based on feedback is essential and is something we should strive for every single day.
Consistency matters: Clear standards prevent miscommunication and enhance efficiency across teams, freeing up mental bandwidth for creativity and innovation.
These improvements have become the foundation for future UX design projects at THG, and now part of the onboarding process for new starters to learn the team ways of working and expectations of design deliverables.