BeazleyUX and UI Design
Beazley Insurance needed a team to deliver a website to help guide new recruits through the lengthy onboarding process. I was the consultant and UX/UI designer on this project.
Fitzrovia Barbers are masters of barbering – their shop is based in central London and I had the pleasure of designing and building their new website.
I kicked pff the project with a discovery meeting with the clients where I tried to ascertain all the stakeholder needs and desires. Unfortunately, the previous version of the website didn’t have any tracking or analytics so I couldn’t rely on user/performance data. However, it was safe to assume that the main user need is to be able to quickly book an appointment and any potential pain points lie in this particular journey. The other considerations were related to the features, functionalities and content required by the clients.
After taking everything into account, I proposed a simple, two-step approach – planning the information architecture and then applying new, fresh designs to approved wireframes.
I created a new sitemap to illustrate the content architecture and then produced low-fidelity wireframes to showcase the user flow and demonstrate how I have introduced easy and quick access to booking appointments throughout the the site.
The client want a new look that was on-brand. However, as a fairly new business their brand was not visually established yet. This allowed for some room to explore different styles and approaches. I created 4-5 different design routes and together with the client I filtered out the elements they felt strongly about until we reached a look and feel that they were happy with.
Once the clients had approved a design route, I applied the agreed look and feel to the wireframes to create the new UI designs. I handed off to the developers designs for desktop and mobile together with supporting imagery and iconography. The site is built in WordPress and the front-end editor is Elementor so I also advised and implemented some improvements in the front-end directly – including micro interactions and animations.
As a UX Producer & Designer at TMP Worldwide, I had the pleasure to work a very interesting pitch for the redevelopment of the the Aldi careers website for UK and Ireland.
The Aldi careers website was extremely heavy content-wise and it contained multiple layers of information which was hard to navigate through. The goal was to “clean up” the information hierarchy, trim down the steps users had to take to reach application and propose simpler, cohesive user journeys with different entry/acquisition points.
I analysed the current information architecture, evaluated all the different routes and user journeys, and narrowed down the acquisition points. I also created a hypothetical persona based on key audience pointers provided by the client.
I then created an improved and much simplified sitemap to illustrate the proposed information architecture. In order to showcase how all the findings, improvements, and user flows come together, I prototyped low-fidelity but fully interactive wireframes.
PeopleScout evaluate the experience of candidates when applying for a job with a specific company. Their final report needed to be translated from simple PDF format to a more engaging platform fit for the web.
As the new product was meant to be a completely different format compared to its initial version (only a PDF report), and the current target users were unaccustomed to this format, it was crucial to perform user testing first. This allowed me to test and validate the initial personas, and also to uncover the major usability flaws of the proposed tool. The quick turnaround meant that low-fidelity wireframes could be used to align the stakeholders and dev team, while a high-fidelity prototype was necessary to get feedback from users that is as precise as possible.
The timeframe and budget of the project were fairly tight which didn’t allow for extensive research and a more iterative, lean UX approach.
Firstly, I conducted initial conversations with the stakeholders to better understand the needs and goals of the business, and also to establish KPIs.
I then conducted some research on similar reports, services and tools, and created user personas. I put forward a proposal to create a platform with a dashboard interface. The preferred approach by the key stakeholders was to first create low- and high-fidelity prototypes and them conduct user testing with the prototype.
I started with a few different versions of low-fidelity sketches and user flows which I tested in catch-ups with the stakeholders and the dev teams. I created the first high-fidelity prototype based on the team’s feedback and tested it with 6 users.
I analysed the feedback from the first round of usability testing, refined the prototype to minimise UX and UI pain points and presented it to the team and stakeholders. I repeated these steps in two more rounds of user testing. In total I tested the hi-fi prototype with 17 participants in order to cover approximately 85% of the potential major usability issues.
The timeframe and scope of the project were fairly tight which didn’t allow for extensive research and a more iterative approach during the initial stages. However, as the goal for this first release of the product was to be an MVP, I proposed that the live CX dashboard is tracked with analytics and heatmaps which will provide data for future UX improvements and will allow other useful testing techniques (A/B testing) to be implemented more easily.
Designed with Adobe XD.
GLL College offer courses and training in the sports and leisure industry for both individuals and businesses. Their website wasn’t fulfilling the needs of their users so it needed new functionalities and interface.
The client’s request was to achieve a complete revamp of their platform in terms of performance, user experience, and look and feel. In order to achieve that, I had to start from the basics which meant analysing the current performance of their platform and finding the user pain points before suggesting ways to improve the UX. The full proposed scope included:
I added heat / scroll / click mapping to the key pages, as well as set up screen recordings to track users behaviour when on the site. While these were capturing over the following weeks, I took a look at Google Analytics to gather insights into high-level user demographics, behaviour and preferences.
The insights from the analytics shaped the initial draft of the various user personas. Based on their needs and desires, and together with the collected data, I mapped out new user flows and information architecture.
Direct user interviews were organised to gain insights and confirm the hypotheses made in the user personas and flows.
I also set up a voluntary survey on the GLL site to capture some high-level feedback from our current users, and iterated on the questions to really hone in on the assumptions that were created on the basis of the quantitive research.
A key milestone in the project was converting all the insights into actions. The next was to apply the knowledge and feedback of the user research into a new and improved interface. I created low-fidelity wireframes to clearly illustrate what the need updates, why the changes are necessary and also how they will improve the overall UX and website performance.
The final stage was to create new UI designs which are still adhering to the brand guidelines but give the website a slicker, fresher look. Once the new look and feel was approved, I applied the updated UI kit to the signed-off wireframes and handed off the project to the developers.
This approach allowed the team and the stakeholders to not only create a better version of their platform with a refreshed look and extra functionalities, but also to give voice to their users and discover crucial details about the the faults in the user experience and therefore – the conversion rates!
A key moment was finding out that there was a very high % of people who said they didn’t find what they were looking for on the site, which eventually lead GLL to reconsider their general offering and re-evaluate their business strategy. This only goes to show the power of user research!
I was approached by a SaaS company to help them develop a new product – a virtual events platform, which repurposes a wide range of their existing tools and features. The development is in progress and the client and the project are confidential.
I kicked off the project by having multiple conversations with the stakeholders. The aim was to determine the business goals and desires, gain more insight into the existing products, establish limitations, define KPIs and educate the different stakeholders on the key aspects of UX (and its importance). I also used the opportunity to find out more about any existing user insights and competitor research the team already had.
After gaining a good idea of the business needs and the project constraints, I created a proposal outlining the methodology and timeline I planned to implement. As the new platform is supposed to be largely based on tools and features the business already offers, there was a certain frame I could work with. The key here was to find out what the user needs and pain points are and how these features and functionalities can potentially address their needs.
The first step was to define the target users. I used the insights provided by the stakeholders in combination with competitor research to create the initial user personas. Even though at this point the personas were mostly hypothetical due to insufficient user data, this served as a springboard for creating user flows and putting together a selection of questions for a user survey.
The user survey aimed to test the assumptions made so far and help better understand the user needs, clearly outline their needs, pain points and priorities.
In addition to the survey, I reviewed feedback from users who had previously used the platform’s other existing tools.
While the survey was running and collecting responses, I sketched the first draft of the wireframes. The sketches were based on the proposed user flows. After a few revisions, I transformed the drawn wireframes into low-fidelity wireframes (using Adobe XD) which I presented to the stakeholders in order to get their input but also to bring them up to speed with the scope of the proposed new platform.
Once I had analysed the survey responses and previous user feedback, I tweaked my previous work refined, data-informed user personas and flows. The research confirmed most of the assumptions made in the earlier stages of the project but it also gave me ideas for other opportunities and ways to address essential pain points. This user data played a key role in defining priorities (for both users and the product team), shaped the crucial user stories and helped outline the first draft of the MVP.
Having implemented all the user findings into improved versions of the wireframes, the next step was to bring the mockups to life using the established design system*. I created two separate and slightly different hi-fidelity prototypes. This enabled me to test the multiple proposed features in a way that is less overwhelming for the users and me.
I tested the prototypes with users in three consecutive rounds and refined the UX and UI after each round to eliminate major issues, minimise unclarity/confusion and re-align priorities. The final result was the first draft of the MVP.
The approach I proposed for the development of this product was iterative, lean UX. The goal of the first stage was to rapidly create an MVP and launch it as quickly as possible so that there can be more input from real users and much bigger/better user data. The new platform needs constant revisions and optimisation in order to grow and adhere to the ever-changing needs of its users.
Prior to this project, I had worked with this client on a few other UI projects including a design system. I had already created a detailed, centralised library of styles, components and guidelines that reflect the company products’ neutral look & feel. This allowed me to speed up the UI design and prototyping process for this particular projects as reused and repurposed many of the elements from the UI kit.