Adams Foodservice

Adams Foodservice, valued at £80 million and with 8 branches across the UK, is a trusted partner to the catering trade.

I led the UI/UX overhaul of Adams Foodservice’s app to migrate & streamline online ordering for 5,000 existing B2B customers and expand the company’s reach by 1,500 new customers.

By introducing our new design, Adams app successfully reduced ordering friction by 25%, leading to a 50% growth in new customer sign-ups over just six months.

The challenge

My Role

As the Lead UI/UX Designer, I was responsible for end-to-end product design from user research and wire framing to prototyping, user testing, and guiding developers on final implementation.

UX Artefacts

Research Report, User Personas, Wireframing, Usability Test Reports, Style Guide Prototyping, User Flows, Information Architecture.

Visit Adams App

Upon joining Adams, I was tasked with overhauling the system to migrate 5,000 customers online and attract new ones within a year, ensuring a seamless ordering experience.

UX audit & key findings

Before initiating the redesign, I conducted a UX audit of the existing Adams app and found that it was built using a basic template with no structured UX approach.

Research backing these findings

🚨 Low digital adoption → Walk-in customers weren’t apprehensive converting to digital platform

🛒 Drop-off at checkout → Users found the ordering process confusing

🗺️ Navigation issues → Products were hard to find, causing frustration.

🎨 Outdated UI & Inconsistencies → No design system, leading to poor user experience.

📊 Analytics Review → 40% of users dropped off during order checkout.
📞 Customer Service Insights → Frequent complaints about order tracking & unclear pricing.
📢 Stakeholder Feedback → Business owners emphasised that the app wasn’t converting walk-in customers into digital buyers.

Armed with these insights, I moved to the second phase to uncover user behaviours & competitor benchmarks.

Approach

📌 Step 1: UX Audit & Key Issues Identified

Reviewed existing UI challenges: Incomplete Figma files, unclear processes, outdated designs.
Discovered navigation, checkout friction, and personalisation gaps affecting user experience.

📌 Step 2: Data-Driven Redesign Strategy

Used customer feedback + competitor benchmarks to prioritise usability improvements.
Focused on reducing checkout friction & improving digital adoption.
The redesign was approached with a mobile-first mindset, ensuring that the user experience was optimised for mobile devices before scaling up to larger screen

📌 Step 3: Scalable & User-Centric Redesign

Built a design system to streamline UI consistency.
Simplified key workflows (onboarding, checkout) to enhance conversion rates.

💡 Outcome: This approach laid the groundwork for a frictionless user experience, boosting signups, order completion, and engagement

Internal research insights

User Research Report

To achieve this goal, a user research study was conducted to understand the needs, preferences, and pain points of users, particularly those from Asian backgrounds running takeaway shops, restaurants, and wholesalers.

To ensure the redesign was truly user-centric, I conducted a qualitative research study using

👥 User Interviews → 12 in-depth sessions with takeaway owners and restaurant managers.

📊 Surveys → responses capturing frustrations with the existing platform.

🗂 Competitor Analysis → Benchmarked against leading B2B foodservice apps.

Screenshot 2025-03-01 at 21.09_edited.jp

Demo Graphics

70% takeaway shops, 25% are in the restaurant business, and 5% are wholesalers
Users between 35-68 and located in Uk cities such as Bradford, Leeds, Birmingham, Hull, Nottingham, Sheffield, and Preston

Current Pain Points

Users face challenges in order tracking, lack of digitisation, and personalisation.
Managing multiple takeaway shops without the ability to share shopping lists is a significant pain point.
Expect a variety of products with similar discounts

Preferences And Behaviours

Users appreciate transparent information, easy navigation, and expect the app to run smoothly even on low-quality devices.
They prefer direct communication for issue resolution and value personal connections with higher-ups
Immediate resolution of issues is crucial, as users may become easily irritated due to age-related factors

User Goals And Needs

Users prioritise centralised management, easy checkout, personalised experiences, and food quality assurance.
They seek credit facilities within the app and desire a tailored experience that addresses their specific business needs.

Feedback On Competitors

Competitor apps are criticised for confusing interfaces and lack of clear direction.
Users appreciate promotional offers but dislike additional charges for collection.

Expectations

Users expect smooth service, easy checkout and payment processes, credit facilities, and personalised experiences.
Competitive pricing and discounts are desired, particularly on a wider range of products.

Why the old UX was failing?

🚦 Confusing Navigation → Users struggled to find key sections, increasing frustration.

Issue: No logical structure for "Recently Viewed," "Special Offers," and "Categories."
Impact: Increased drop-off rates due to difficulty finding products.

⚠️ No Error Handling & Guidance → Users didn’t know when they made a mistake.

Issue: No clear error messages or guidance in forms & checkout.
Impact: More failed transactions and higher customer support dependency

❌ Lack of Clear User Journey → No clear indicators of what users should do next.

Issue: Users were uncertain about checkout steps & product selection.
Impact: More cart abandonment & support requests for missing order details.

Making on boarding easy

User Behaviour Before

Customers preferred calling in orders rather than using the app because it felt easier.

Before → High friction in multi-field form (40% drop-off)

💡 Solution

I led a frictionless, intuitive onboarding redesign making sign-up as effortless as a phone call, directly driving higher customer adoption.

Merged login & signup into a single streamlined flow, guiding users automatically.
Replaced overwhelming multi-step forms with a one-question-per-screen approach.
Clickable buttons replaced manual text input, reducing effort and increasing engagement.
Progress bar added for clear guidance and to reduce drop-offs

After → Smoother, step-by-step sign-up (20% drop-off).

Results and Impact

The login and signup flow was redesigned for effortless navigation, directing users based on their email or phone entry to eliminate unnecessary steps. The previous long-form layout led to high drop-off rates, so I introduced a one-question-per-screen format with clickable buttons, streamlining data entry. Essential enquiries were retained, and a progress bar provided visual guidance, making the signup journey seamless and intuitive

📉 40% to 20% drop in sign-up abandonment after streamlining the onboarding process.

🚀 50% increase in customer sign-ups within 6 months as more users completed onboarding instead of calling to order.

✅ 1,500 new B2B customers acquired through the improved digital experience.

⭐ 70% of users rated the new onboarding 4+ stars, highlighting ease of use

Reducing order friction - checkout flow improvements

🔍 Problem

The checkout process was causing friction, leading to abandoned carts, slow order processing, and user confusion. Multiple screens, unclear payment methods, and lack of order personalisation resulted in frustration and lost revenue.

No direct ‘Add to Cart’ option → Users had to slide a product, increasing friction.

Poor visual hierarchy → Inconsistent font sizing & layout made key information hard to scan.

No sticky checkout button → Users had to scroll back up to proceed with checkout.

No slot selection for collection orders → Users had to accept the default slot without flexibility.

Additional pain point discovered →

💡 Solution

To reduce order friction, we implemented

⚡ Direct ‘Add to Cart’ option → Users could now add products instantly.

🔍 Improved Visual Hierarchy → Cleaner UI made scanning & navigation effortless.

📌 Sticky Checkout Button → Users could checkout from anywhere without scrolling.

📅 Slot Selection Feature → Users could now choose their collection time.

👥 Child Memberships Integration → Users could select the correct business account at checkout, eliminating manual switching.

Results and Impact

📉 25% reduction in checkout drop-offs → Fewer abandoned carts.

⏳ 30% faster order processing → Checkout was more efficient & seamless.

📈 Higher conversion rates → Users completed purchases with fewer obstacles.

👥 Reduction in checkout errors → Users stopped placing orders under the wrong account.

⚡Faster checkout for multi-location businesses → No need to switch accounts manually.

Ensuring scalability & consistency with a design system

🔍 Problem

A Fragmented UI Slowing Growth

Pain Points Identified

❌ No Design System → Each feature was built separately, causing inconsistencies.

⏳ Slow Dev Cycles → Developers rebuilt UI components manually, leading to delays.

⚡ Lack of Scalability → Hard to introduce new features without breaking existing UI.

📉 Inconsistent User Experience → Users faced confusion due to unstructured layouts.

Developer Frustrations or Old UI

"Every new feature felt like we were building from scratch. There were no reusable components, so we kept redesigning buttons, input fields, and modals from one screen to another. A single UI update meant we had to manually fix dozens of screens."

- Frontend Developer, Adams Foodservice

A Unified, Scalable Design System for Efficiency & Consistency: To solve these issues, I single handed built a centralised design system in Figma, ensuring

Standardised UI components → Buttons, inputs, modals, dropdowns, and typography.

Reusable components → Created modular elements to ensure consistency across screens.
Global styles & tokens → Unified typography, colors, spacing, and grid systems.
Faster developer handoff → Integrated Figma with developer tools for seamless implementation.

Results of having a design system

Before →

After →

Design System In Figma

The Impact (Results & Business Benefits)

Measurable Impact – Faster, More Scalable UI Development

📉 40% reduction in UI inconsistencies → A polished, professional, and cohesive user experience.

⏳ 30% faster design-to-development handoff → Developers worked more efficiently with clear specs.

📈 2X faster feature rollouts → Standardised components allowed new screens to be designed & implemented with minimal effort.

⭐ Improved user experience → A cohesive UI improved engagement and navigation.

The design system significantly accelerated development by enabling teams to reuse standardised components, reducing manual redesigns by 50%. Beyond just improving UI aesthetics, this structured approach future-proofed the Adams app for long-term scalability. By ensuring design consistency and reducing developer workload, we facilitated rapid feature rollouts, making the design system a key driver of business growth

Achievements and summary

Reflecting on my journey with the Adams project, key achievements include prioritising user-centric design to create intuitive interfaces, driving engagement and satisfaction. Iterative development and regular feedback cycles allowed me to continuously refine our solutions, ensuring their effectiveness in a dynamic environment. Collaboration across

departments proved essential, leveraging diverse perspectives to overcome challenges and achieve impactful results.

I look forward to applying these insights to future projects, driving scalable, user-centric solutions that enhance business outcomes.