top of page

UBT Technology Home

This project stemmed from a business challenge — the Technology department was underperforming against revenue targets.

Through analysis of website performance and user behaviour in Google Analytics, I uncovered usability and structural issues affecting conversion.

To address these, I proposed a dedicated Technology homepage — a focused entry point featuring tailored product recommendations and simplified filtering to create a more intuitive, personalised shopping experience.

Tech Home Mockup Laptop Mob.png

Overview

Objectives
  • Increase conversion rates for Technology products

  • Improve the end-to-end shopping experience

  • Reduce cognitive load and overwhelm during product discovery

Audience Background

UBT serves members of the Plymouth Brethren Christian Church, a closed Community that primarily engages with internal media, shops through affiliated businesses, and places strong trust in UBT’s guidance and recommendations.

Given this unique audience, the design challenge was not about user acquisition, but about reinforcing trust and enhancing the experience for an existing, loyal customer base through usability and design clarity.

Constraints
  • User access limitations:
    Due to religious privacy constraints, direct user interviews and usability testing were not permitted. Insights were instead derived from behavioural analytics and internal stakeholder feedback.

  • Platform restrictions:
    Limited backend access within Magento 2 required that all enhancements be implemented using standard templates and front-end code blocks, without custom development.

Software:

image.png
image.png
image.png
image.png
image.png
image.png

Results

Company Impact
Second-highest revenue-driving campaign in October 2025.
Improved experience
with engagement sitting between 87–91%
and bounce rates below 12%
Revenue Impact
Within a month of launch, they received a 20k lead
Improved journey with users were actively engaging with the page as their primary access point for technology products

Research

 Competitor Research
  • Navigation from browsing to a specific product required significantly more steps than on competitor sites.

  • Existing product features were underused; presenting them visually could drive greater engagement.

  • Unlike competitors, UBT lacked a dedicated Technology landing page to act as a clear entry point and reduce friction in discovery.

  • No recommendation mechanisms were in place. Introducing dynamic, frequently updated suggestions could reduce decision fatigue and support faster discovery.

Currys Mockup.png
Currys Phone Mockup.png
Currys Phone Mockup 2.png

Competitors analysed include Currys, Samsung and AO.

Google Analytics
  • When browsing for phones, users face up to three pages of products. Page one receives 135% more views than page two, indicating that products buried deeper in pagination are rarely seen.

  • Filters below the first visible section were rarely used, suggesting low visibility or relevance.

  • Most purchases followed targeted campaigns, reinforcing that users value curated, trusted recommendations and respond well to guided discovery.

I worked with the marketing team to create a dashboard showing the key data from GA highlighting key information.

GA Mockup2.png
User Flow Diagram
  • By introducing the Technology homepage concept,
    I reduced interaction steps by 50% and shortened journey time by 9 seconds.

  • The path to the most popular product took 8 interactions and 15 seconds from the homepage.

User Flow 2.png

Showing the flow for the existing navigation vs. the new design.

Key Research Findings

Website_Icons-01.png
Reduce the number of clicks to reach top-selling products.
Website_Icons-02.png

Highlight popular and high-performing products.

Website_Icons-03.png
Incorporate recommendations based on the latest campaigns
and product popularity.

Ideation

Solution Exploration

After exploring several potential solutions to address the conversion barriers, it became clear that introducing a dedicated Technology homepage would have the greatest impact.

This new entry point would not only provide a curated space for tailored product recommendations but also act as a flexible platform for campaigns, marketing content, and targeted promotions, aligning business goals with user needs.

Wireframes

During ideation, I noticed that many competitors overlooked their mobile experiences, often scaling down desktop designs rather than optimising layouts. Oversized banners and lengthy scrolls created friction on smaller screens.

To counter this, I designed mobile and desktop experiences independently, ensuring the interface was responsive, lightweight, and intuitive across devices.

Using insights from Google Analytics and campaign performance, I identified the most visited sections and products to form the foundation of the homepage. Each section was prioritised by popularity and user intent, creating quick-access pathways to high-interest areas.

This approach reduced unnecessary scrolling and decision fatigue, helping users reach their goals faster while supporting ongoing marketing activity.

Iterations and Brand Application

The goal was to create a Technology homepage that aligned with UBT’s overall brand while establishing a distinct visual identity for this division. To achieve this, I developed and presented three tile design concepts, each exploring how visual styling could differentiate between user types.

We selected the design with a bold, colour-forward design tailored for business customers, supporting their need for quick scanning and high-impact visuals.

To strengthen hierarchy and readability, I experimented with UBT’s primary Technology blue, testing dark and light tints to balance contrast and depth. Careful use of layout, colour, weight, and spacing helped define hierarchy and guide the user’s visual flow throughout the page.

Thumbnails.png
Lo-fi Wireframes copy.png
Screenshot 2025-12-16 at 14.43.57.png
Screenshot 2025-12-16 at 14.45.15.png
Iterations 3.png
Iterations 4.png

The focus was on reducing visible choices and creating a streamlined, scannable experience. All key actions and pathways were designed to appear above the fold, ensuring that first-time users could orient quickly. Colour-based category grouping further simplified navigation, enabling faster recognition and decision-making.

Iterations 2.png
Mid-fi wireframe

The final designs were created in Figma and implemented on Magento 2. Due to platform limitations, I built separate content blocks for desktop and mobile, using conditional code to determine which version displayed based on device size.

This became the first UBT webpage to feature distinct mobile and desktop versions: a milestone that reshaped how the organisation approached responsive design.

By designing each version independently, I was able to optimise layout, hierarchy, and interaction patterns specifically for each device type, rather than relying on template scaling. This approach delivered a more tailored and seamless user experience across all platforms.

Hi-fi wireframe.png_2.png

Results and Development

Results

The Technology Homepage launched in September 2025 and quickly became UBT’s second-highest revenue-driving campaign in October. With engagement sitting between 87–91% and bounce rates below 12% across both versions, these pages are clearly delivering value. Simplifying navigation, guiding users to high-demand areas and driving measurable revenue.

Within a month of launch, we received a 20k lead from a Head of Technology wanting to buy new laptops for his team. He contacted through the Tech Home page demonstrating people are using it as a reference point.

Post-launch analytics showed that users were actively engaging with the page as their primary access point for technology products, validating its role as an effective discovery and navigation hub. Awareness campaigns explaining the page’s purpose further strengthened adoption and engagement.

This project reinforced the importance of early cross-team collaboration by aligning design, product development and marketing from the outset, ensuring that creative ideas were balanced with technical feasibility, ultimately resulting in a stronger, more user-focused outcome.

Development

Reconvening a few months later, I analysed the webpage with a fresh set of eyes. I looked at how people were interacting with the page and measuring the popularity of pages and products compared to first launch.

From this I identified that the phone and laptop link needed updating due to new releases as well as how despite the SIM add-on product being in the top 5 on this page it had very few clicks. Post-review we decided to update the copy for the SIM add-ons page as well as increase the size of the contact size since that is where the enquiries were coming from. 

Screenshot 2025-12-16 at 14.56.47.png

Learning Outcomes

Challenges

One of the biggest challenges was achieving stakeholder alignment. As this was a self-initiated project based on discovery (rather than a brief from stakeholders), I had to rely on clear communication, persistence, and evidence-based design to gain buy-in.

What to take to the next project

In future projects, I’d dedicate more time to broader discovery. While user privacy constraints prevented direct interviews, I’d explore alternative insight sources, such as anonymised customer support logs or collaborating with account managers for second-hand feedback.

I also learned the importance of pausing before jumping to solutions. By ensuring the problem is fully defined and validated before moving into design exploration. This reflection has strengthened my approach to creating purposeful, research-driven design solutions.

phone_icon.png
mail_icon.png
LinkedIn_icon.png

Get in touch

bottom of page