Intro to the project
I was brought in to this project to help get structure around a sign in and registration, transactional flow for a luxury brand. They wanted me to use the knowledge that I had gained at The Guardian to work on an MVP for the brand.


The client wasn’t ready to conduct research/testing at this point, so we used the insight they had already generated, as well as best practice design methods to create the MVP of the journey.

Mapping out the experience in Figma for a general user to create an account or sign in
Our focus for the MVP was around a general user creating an account. We identified many different user types and scenarios, but wanted to focus on this core user journey initially. 

I documented the current experience for a user going through the transactional experience on the existing site.

Understanding the key hypothesis of problems identified
Before I arrived the team had identified a set of hypothesis by going through the experience and suggesting best practice improvements.

As the client wasn’t ready to conduct user research, testing or analysis, the hypotheses were identified but not proven. We used best practice knowledge and best practice product design to solve key problems that had been defined.


However, more work was needed to understand the problems correctly and gain insight around the user base. It wasn’t possible for us to generate the knowledge we needed about the most important problems to solve.
I documented the current experience for a user going through the transactional experience on the existing site.

Mapping out a basic wireframe journey in Figma
We mapped out the basic steps of the journey in wireframes. This allowed us to get a really good overview of the journey agreed as soon as possible.

Creating complex prototypes & mapping complex flows
This journey involved hugely complex form completion. I felt it wasn’t possible to understand the interactions and steps, which I mapped out in wireframe format before moving to end UI design.
This allowed me visualise all of the actual steps in the journey, creating form fields, dynamic panels, password entry, cases to communicate to the team all of the different interactive elements required to get the user through the process.
Once we had done this we were ready to create the final UI components.

Developing a copy strategy & copy sign off
It was hard for the client and team to get good visibility of the copy across the journey, so I put it into an Excel document, which would be easily accessible.
This allowed me to highlight the key areas where I needed sign off, and also get a good understanding of the story through the flow.
I also created sections for the country list, telephone numbers, and date picker to be clear about how we would structure and lay out the copy on these components.

Working with the product team
I worked with the product/development team in an Agile way, on two week sprints.
We worked very closely together to solve problems as we went on, and to understand what might be possible on each part of the journey.

Working on the final designs and UI design system elements
The final stage was building the UI components into a brand new design system in Figma and building out the final flows using these components.

Increase in engagement and registrations since re-design
One year after releasing the new reigstration and sign in flows I was sent some analytic data about the performance of the new designs and it showed a significant increase in registrations and engagement.
