Feefo’s feedback emails underperformed, with low Click-Through Rates (CTR) and Click-to-Open Rates (CTOR). This directly impacted client data quality and engagement metrics.

The redesign led to a 43% increase in response rates, enhancing client satisfaction and data quality.

Feefo sought to improve the response rates of their feedback emails, a key metric tied to user engagement and data quality. Their email response rates lagged behind industry standards, impacting client satisfaction. As the lead Product Designer, I identified user pain points, redesigned templates, and worked with engineering to implement solutions, achieving a 43% uplift in response rates.

<ul><li>Objective: Increase user engagement through improved email design.</li><li>Key Results: Achieve a 60% increase in response rates.</li><li>Achieved: 43% response rate uplift.</li></ul>

<ul><li>Research: Analysed existing metrics, interviewed users, and mapped the feedback journey.</li><li>Design: Prototyped and tested iterations to optimise layout and content.</li><li>Test: Collaborated with engineering to roll out and A/B test solutions.</li></ul>

We focused on reducing cognitive load, enhancing the call-to-action, and improving content hierarchy. Through iterative design and data-driven decisions, we created new templates that were more user-friendly.

Increasing Email Response Rates

The previous website was cluttered, hard to navigate, and didn’t effectively showcase RGW’s services. The goal was to create a clean, modern site that made it easy for users to find information and contact the business.

The redesign prioritised user experience, ensuring customers could easily find services and get in touch. The clean, professional aesthetic also better reflected the quality of RGW’s work.

The client was extremely pleased with the redesign, noting increased website traffic and more customer inquiries through the online contact form.

RGW Heating & Plumbing, a local plumbing service, wanted a modern website that would attract more customers and improve their online presence. The existing site was outdated, difficult to navigate, and lacked clear calls-to-action. As the lead designer, I focused on creating a user-friendly layout, ensuring mobile responsiveness, and improving overall usability. The client was thrilled with the result, which led to a noticeable increase in customer inquiries.

<ul> <li>Discovery: Discussed client needs and preferences to understand their vision.</li> <li>Design: Created wireframes and visual designs focusing on clarity and ease of use.</li> <li>Development: Built a responsive website optimised for both desktop and mobile users.</li> <li>Delivery: Conducted a walkthrough with the client and refined the site based on feedback.</li> </ul>

I developed a straightforward, mobile-responsive website with intuitive navigation and clear service descriptions. Strategic placement of call-to-action buttons and a simplified contact form ensured users could easily reach out.

RGW Heating & Plumbing Website Redesign

Users found the existing form cumbersome, difficult to complete, and not mobile-optimised. Despite improvements to the email templates, the disconnect between the email and the form led to lower engagement. Many form elements were fiddly and hampered quick user completion.

The redesign led to a 28% increase in form completion rates and a 2.05% overall response rate (+70% compared to the original control group), significantly enhancing user engagement and the number of customer reviews.

Form completion rates for customer reviews were falling below expectations, despite improvements in the email template. As the lead Product Designer, I led the redesign to improve user engagement and increase the form completion rate. Our efforts resulted in a 28% improvement in form completions and a 70% uplift in overall response rates.

<ul><li>Objective: Improve form completion rate by 30%.</li><li>Achieved: 28% improvement in form completions.</li><li>Overall Response Rate: Increased to 2.05% (+70% vs. control group).</li></ul>

<ul><li>Research: Analysed drop-off points using quantitative data and conducted user interviews through usertesting.com.</li><li>Design: Created reusable components using Figma and developed a component library with Storybook.</li><li>Testing: Conducted iterative A/B testing to validate design decisions and measure improvements.</li></ul>

We redesigned the form with a component-led approach, focusing on usability, accessibility, and mobile responsiveness. By collaborating closely with engineers and product managers, we ensured feasibility while enhancing the user experience. Improvements included clearer error handling, microinteractions, and faster load times.

Form Redesign

With no existing website or digital presence, CJP Flooring needed a platform to promote their services and build credibility. The challenge was to design a site that would appeal to potential clients, be easy to navigate, and present the company as a trusted provider.

This project was about more than just designing a website — it was about helping CJP Flooring establish a digital footprint. The clean, modern design highlights their professionalism and makes it easy for potential customers to explore services and get in touch.

The launch of CJP Flooring’s first website has provided the business with an essential online presence, resulting in increased customer inquiries and improved visibility in their local market. The professional design has helped establish trust with potential clients.

CJP Flooring, a flooring solutions provider, needed their first-ever website to establish an online presence and showcase their services. Without an existing site, the challenge was to build a platform from the ground up that reflected their brand and effectively communicated their offerings. As the lead designer, I focused on creating a clean, user-friendly layout with high-quality visuals and straightforward navigation. The launch of the website has significantly improved customer engagement and inquiries.

<ul> <li>Discovery: Conducted meetings with the client to understand their goals, target audience, and key services.</li> <li>Content Planning: Collaborated with the client to gather service details and select imagery to highlight their work.</li> <li>Design: Created wireframes and high-fidelity prototypes in Framer, focusing on usability and visual appeal.</li> <li>Development: Built the website with responsiveness in mind to cater to both desktop and mobile users.</li> <li>Delivery: Walked the client through the finished product, incorporating feedback before the final launch.</li> </ul>

I designed and developed a modern, mobile-responsive website using Framer. The site features intuitive navigation, high-quality images of completed projects, and clear service descriptions. Prominent calls-to-action ensure users can easily get in touch or request quotes.

CJP Flooring Website Design

Feefo’s existing design system was outdated, lacked scalability, and led to inefficiencies in both design and development. Key challenges included: <ul> <li>Inconsistent component designs across platforms.</li> <li>Lack of a structured naming convention for design tokens.</li> <li>Slow handoff process between design and engineering teams.</li> <li>Redundant development efforts due to missing or poorly documented components.</li> </ul>

This redesign wasn’t just about creating components — it was about enabling Feefo’s teams to work smarter, faster, and with greater confidence. The new design system empowers designers and developers to focus on solving user problems rather than rebuilding UI from scratch.

The new design system has significantly improved Feefo’s digital product development process: <ul> <li>Faster Design and Development: Teams now design and build components 40% faster than before.</li> <li>Reduced Redundancy: Centralised components and documentation eliminated duplicate work.</li> <li>Improved Consistency: Achieved a 95% consistency rate across all digital platforms.</li> <li>Enhanced Collaboration: Designers and developers now have a single source of truth, improving handoff efficiency.</li> <li>Better Accessibility: All components meet WCAG 2.1 AA standards.</li> </ul>

Feefo’s digital products had grown over time, but without a unified design system, inconsistencies in design, slower development times, and fragmented collaboration became significant challenges. To address these issues, I led the redesign of their design system, focusing on improving component consistency, creating a robust set of design tokens, and collaborating closely with engineering to implement a scalable component library in Storybook.

<ul> <li>Objective: Redesign and implement a scalable design system to improve product development efficiency.</li> <li>Key Results:</li> <ul> <li>Reduce component development time by 30% — Achieved: 40% reduction</li> <li>Achieve design consistency across products — Achieved: 95% consistency</li> <li>Increase design system adoption among teams — Achieved: 100% adoption</li> </ul> </ul>

The redesign process was highly collaborative, iterative, and user-focused: <ul> <li>Discovery: Conducted stakeholder interviews and audited the existing design assets to identify key areas for improvement.</li> <li>Design Exploration: Created new component designs in Figma with semantic naming conventions and responsive variants.</li> <li>Token Creation: Developed a scalable token system in Figma, mirrored in the codebase for consistency.</li> <li>Engineering Collaboration: Held weekly syncs with engineers to ensure alignment, validate designs, and review Storybook components.</li> <li>User Testing: Ran usability testing sessions with internal teams to ensure the components were intuitive and easy to implement.</li> </ul>

The solution involved a comprehensive overhaul of the existing design system with a focus on scalability, consistency, and usability for both designers and developers: <ul> <li>Component Redesign: Audited and redesigned over 50 UI components with a focus on usability, accessibility, and visual consistency.</li> <li>Design Tokens: Established a robust set of design tokens to manage colours, typography, spacing, and elevations for easy theme management.</li> <li>Storybook Integration: Worked closely with engineering to build a comprehensive component library in Storybook, ensuring accurate implementation and documentation.</li> <li>Documentation: Created thorough documentation for designers and developers, hosted in Figma and utilising the Dev Mode functionality, to ensure ease of use and adoption.</li> </ul>

Feefo Design System Redesign

As a new company, Dot Studio needed to build its website quickly without sacrificing quality or scalability. Key challenges included: <ul> <li>The need for a reusable system to streamline the website development process.</li> <li>Avoiding repetitive design work for future website updates and other digital products.</li> <li>Ensuring consistency across components to reflect the brand identity.</li> <li>Facilitating smooth collaboration between the design and development teams.</li> </ul>

The Dot Studio Design System has enabled us to work smarter, not harder. By creating a solid foundation, we can build faster, maintain consistency, and focus on delivering high-quality digital experiences. It has proven invaluable in launching our website efficiently and will continue to serve as a cornerstone for future projects.

The Dot Studio Design System enabled rapid website development while ensuring long-term benefits: <ul> <li>Reduced development time by 50% for the website build compared to starting from scratch.</li> <li>Consistent user experience across all pages with reusable components.</li> <li>Improved collaboration between design and development teams, reducing back-and-forth communication.</li> <li>Future scalability: The system now serves as the foundation for upcoming products and marketing materials.</li> <li>Faster iteration cycles: New pages and features can be built quickly with existing components.</li> </ul>

As a startup, Dot Studio needed a strong foundation to build its digital presence. To ensure efficiency and consistency, we developed a scalable design system to serve as the backbone for our website and future digital products. By focusing on modular components, robust design tokens, and thorough documentation, the design system enables rapid development while maintaining visual and functional consistency.

<ul> <li>Objective: Build a scalable design system to accelerate website development and future product builds.</li> <li>Key Results:</li> <ul> <li>Reduce website development time by 40% — Achieved: 50% reduction</li> <li>Ensure 100% component reusability for future pages — Achieved</li> <li>Increase design-to-development handoff efficiency — Achieved: 45% faster</li> </ul> </ul>

Our process was structured to balance speed and quality while ensuring long-term scalability: <ul> <li>Discovery: Identified key website requirements and audited common UI patterns needed for initial launch and future scalability.</li> <li>Design: Created core components with responsive variants, ensuring they catered to both desktop and mobile use cases.</li> <li>Token Setup: Developed a robust set of design tokens for consistent use across the website and future products.</li> <li>Development Collaboration: Partnered closely with engineers to translate designs into coded components within Storybook.</li> <li>Implementation: Used the design system to build the Dot Studio website, significantly reducing development time.</li> </ul>

We created a comprehensive design system tailored to Dot Studio’s needs, focusing on rapid development and long-term scalability: <ul> <li>Reusable Component Library: Designed a modular set of components in Figma, with coded counterparts built in Storybook.</li> <li>Design Tokens: Established a token-based system for colours, typography, and spacing to maintain consistency and enable easy theme adjustments.</li> <li>Documentation: Developed clear guidelines to help team members quickly adopt and use the design system.</li> <li>Website Foundation: Utilised the design system to efficiently build Dot Studio’s website, ensuring reusability for future pages and features.</li> </ul>

Dot Studio Design System

Integrating Heatable’s booking tool into the Checkatrade user journey presented several challenges:<ul> <li>Ensuring a seamless transition between Checkatrade and Heatable branding without causing user confusion.</li> <li>Maintaining user trust while moving between two brands.</li> <li>Designing a consistent experience that felt native to both platforms.</li> <li>Validating that users understood the process and felt supported throughout.</li> </ul>

This project was about more than just embedding a tool — it was about ensuring users felt guided and supported throughout their journey. By focusing on visual consistency and trust signals, we created an experience where users felt confident transitioning from Checkatrade to Heatable.

The integration led to a more cohesive user journey and improved booking completion rates. Key outcomes included:<ul> <li>Increased User Trust: Users reported feeling more confident during the transition process.</li> <li>Improved Completion Rates: The seamless integration resulted in a higher percentage of users completing quotes and bookings.</li> <li>Enhanced Brand Perception: Both Checkatrade and Heatable benefited from the smooth, supportive user experience.</li> </ul>

Checkatrade partnered with Heatable to embed their instant quote and booking tool into the Checkatrade user journey. The goal was to provide a seamless experience where users could begin on the Checkatrade platform and smoothly transition to Heatable’s interface with full confidence and trust. As the lead Product Designer, I designed the end-to-end process, focusing on cross-brand consistency and user trust. I conducted user testing to validate the journey, ensuring that users understood they were still supported by Checkatrade while interacting with Heatable’s tool.

<ul> <li>Objective: Create a seamless cross-brand experience to increase user trust and booking completions.</li> <li>Key Results:</li> <ul> <li>Reduce drop-off rate during brand transition — Achieved: 25% reduction</li> <li>Increase booking completion rate — Achieved: +15% increase</li> <li>Improve user understanding of partnership — Achieved: 90% clarity in user testing</li> </ul> </ul>

<ul> <li>Research: Analysed user expectations, mapped the existing user journey, and identified potential friction points.</li> <li>Design: Created prototypes showcasing the transition between brands, focusing on trust-building elements and consistent design patterns.</li> <li>User Testing: Conducted usability tests to validate that users understood the partnership and felt confident when moving to Heatable’s tool.</li> <li>Iteration: Refined designs based on user feedback, ensuring clarity and a frictionless experience.</li> <li>Delivery: Collaborated with engineering to implement the designs and validate the live experience.</li> </ul>

We focused on creating a cross-brand design system that balanced both companies' visual identities. Key solutions included:<ul> <li>Visual Continuity: Used familiar Checkatrade elements during the initial journey, gradually introducing Heatable’s branding.</li> <li>Clear Communication: Added messaging to reassure users they were still supported by Checkatrade.</li> <li>Consistent UI Patterns: Maintained similar button styles, typography, and layouts to reduce cognitive load during the transition.</li> <li>Trust Indicators: Included subtle Checkatrade references even on Heatable’s interface to reinforce partnership trust.</li> </ul>

Case Studies