JJ Roofing | Xigen

Mobile first eCommerce design for the largest roofing merchant in North London

JJ Roofing Supplies Limited (JJR) is the largest roofing merchant in North London with seven stores and growing eCommerce. Founded in 1989, JJR’s core business focuses on sourcing and supplying quality roofing materials to businesses across the UK and the Republic of Ireland.

Service overview

Competitor Analysis

Website redesign

eCommerce development

Hosting

The challenge

With the covid pandemic came lockdown restrictions and a new low-touch world, resulting in an unprecedented acceleration in the uptake of eCommerce.

To capitalise on this shift in behaviour JJR wanted to move to a best-in-class eCommerce website that would provide consistently outstanding UX, making buying easy. In particular the requirement was to remove barriers for trade businesses with low friction user journeys, simple checkout process and personalisation for more unique buying experiences. The website needed to provide JJR with the scalability and agility for operational resilience and future growth.

Xigen created a brand new eCommerce website that’s fast, simple to use and uncluttered, to reduce cognitive load and increase user engagement. Xigen used high performance hosting, a mobile first design approach, fast page load speeds, and streamlined buying journeys, built on a powerful eCommerce platform.

Sales driven design

Competitor Analysis

An important part of the discovery phase was to show JJR how Xigen intended to improve their standing against key competitors.

Xigen analysed the core journeys, fundamental pages and major benefit-added elements of competitor sites against each other whilst benchmarking against best-in-class examples. Xigen then gave a rating out of ten for each site element as well as breaking down the successes or areas of improvement for JJR.

Mobile First Design

In the UK more people buy online using a mobile device than with desktop or laptop computers, and recently Google modified the algorithm to rank mobile friendly websites higher in SERP.

These two factors mean that for outstanding mobile UX a ‘mobile first’ approach took priority and was vital for not only greater engagement and higher conversions, but also to offer JJR’s business customers more unified buying experiences.

Mobile first eCommerce design considers UIs such as smaller screen size, and swipe/tap instead of point/click. It’s much easier and cheaper to design for mobile and adapt for desktop than doing it the other way around.

Taking cues from competitor analysis, Xigen designed JJR’s mobile UX to be simple and intuitive for maximum buyer engagement.

Outstanding User Experience

For increased engagement and to better project JJR’s brand and products on the home page, Xigen included highly visible USPs and created an automated carousel hero banner using high quality images and bold CTAs.

This gives business customers an immediate sense of who JJR is and what they do. It also showcases additional services and resources. The USPs are displayed throughout the website along with product search and mega menus for easier site navigation.

Product Personalisation

To help improve user engagement and to streamline buying journeys Xigen introduced product personalisation, popular products and popular product categories. These more relevant product suggestions display on the homepage.

Personalised product recommendations can help business customers not only find what they need quickly, but because they’re based on search history, related products such as accessories and consumables can also be offered to help increase AOV.

This gives buyers more relevant and more valuable product recommendations - if a product served up is not relevant, it is of no value to the buyer.

Better product recommendations offer higher value buying experiences. Showing more relevant products in the right place on the page also helps to reduce cognitive load, enabling buyers find the right product(s) faster.

Social Proof

Xigen included Trust Pilot reviews on the JJR site to help build trust with new business customers. This communicates that JJR is a competent, professional, reputable business, with a current 4-star rating across 2600+ reviews.

Another way to leverage social proof is via social media. Xigen created a JJR blog page for news, insights, thought leadership, product demos and more for JJR to share on social channels. This helps to extend JJR’s business reach and build brand equity through buyer engagement with shares, likes, comments, recommendations etc.

Algolia On-Site Search

A vital UX element for eCommerce is on-site product search. Getting buyers to the products that they want fast and with as little friction as possible helps streamline user journeys.

The product search on JJR’s website is powered by Algolia, a site search that enables users to quickly find the products that they need by returning accurate search results.

Algolia provides semantic search for more relevant results, autocomplete to save search time, as well as including contextual filtering to refine search results by product type and attribute.

High performance platform

Magento 2 - Customisable eCommerce Technology

Xigen is platform agnostic. That means they have no vested interest in the eCommerce platforms that they use—only offering solutions that best suit client needs. The JJR website is build on the Magento 2 eCommerce platform.

Magento 2 is a world-class eCommerce platform that is highly customisable and scalable. It enables:

Mobile first design
Optimised product pages
Streamlined checkout
Wide range of integrations
Powerful marketing capabilities
Back-office functionality
High data and payment security

Load Speed Efficiency with Cloudflare CDN

To help increase page load speed Xigen implemented Cloudflare’s content delivery network (CDN).

Cloudflare optimises JJR’s website performance, dynamically distributing content for any device, so when traffic increases, JJR can cope with demand, maintaining faster page load speeds for lower friction UX.

Docker Containerisation

Xigen hosts JJR’s website using a containerisation approach with an application called Docker, a technology that enables Xigen to host JJR more reliably and stably, as well as providing greater agility.

The results

The new JJR website has seen improvement in overall performance. Comparing the last three months of the old JJR website with the first three months of the new site there has been a significant uptick in acquisition, behaviour, and conversions:

Conversion Rate

Number of Sessions

Total Conversions

Bounce Rate

New Users

"Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est”

Name
Job Title, JJ Roofing

Conclusion

Cras justo odio, dapibus ac facilisis in, egestas eget quam. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Maecenas faucibus mollis interdum. Cras mattis consectetur purus sit amet fermentum.

No matter what you sell, we can design, build, and launch a website that turns heads. Get in touch with us today to see how we can work together.

RELATED CASE STUDIES