Roof Rack Superstore Case Study

Overview

Roofrack Superstore, an Australian-based e-commerce website, specialized in offering roof racks, bike racks, sports & cargo racks, tent racks and accessories for various purposes, such as camping gear, canoes, bikes, or work use. With the aim of expanding their online and physical reach across China, the company sought to communicate their expertise in car roof racks and provide customers with a wide range of options to choose from.

The overall need for the redevelopment of the new website for Roofrack Superstore was driven by a number of factors including a desire to improve the online customer experience, increase website performance and speed, and enhance search engine optimization (SEO) efforts. The company also wanted to focus on a mobile-first design approach, as well as offer bundled product options to simplify the purchasing process for customers. Additionally, the goal was to expand the business’s reach and establish a stronger presence in the competitive automotive accessory market in China. The new website would help to achieve these objectives and ultimately drive sales and customer satisfaction.

LEAD TIME

6 Months + Ongoing Campaign

SECTOR

Automotive Industry

DEMOGRAPHIC

25 - 60 Year Old

RESOURCES INVOLVED

10+ people

BUDGET

$100K +

TARGET TYPE

B2C

SERVICES

Digital Strategy, eCommerce Website, Integration, Digital Marketing

WEBSITE GOAL

Sell Roof rack & accessories Online

MARKET

China

Hover over to view website Touch the screen to view site

Our Approach

The Objectives

Since 2014, the Roof Racks Superstore has teamed up with ZOFELA with a focus on improving their eCommerce and digital marketing efforts. The primary objective of the Roofrack superstore website development was to upgrade the eCommerce platform to Magento, optimize loading speed, enhance eCommerce SEO, implement a mobile-first design approach, and design options for bundled products. The aim was to provide a better shopping experience for customers and increase sales and customer satisfaction.

To achieve this, the following initiatives were implemented:

Upgrading the eCommerce Platform to Magento
Optimizing loading speed
Enhancing eCommerce SEO
Implementing a mobile-first design approach
Designing options for bundled products.

By executing these efforts, the Roof Racks Superstore successfully achieved their objectives of providing a superior consumer experience and expanding their reach across China.

The Challenge

Primarily, the challenge facing this eCommerce focused objective was the outdated digital structure of the website that had been incorrectly indexed by Google in addition to a confusing user journey. This hurdle needed to be overcome efficiently to support customers shopping online or doing research online prior going to store.

Developing a website and marketing strategy for an e-commerce business like Roofrack Superstore can come with a variety of challenges, including:

Competition: There were numerous other businesses offering similar products and services, making it difficult to stand out in the market.
Customer needs: Understanding the needs and preferences of customers was critical to creating an effective website and marketing strategy.
Technical limitations: There were technical limitations, such as the limitations of the e-commerce platform, that impact the development and design of the website.
Changing market trends: Market trends and consumer preferences are constantly changing, and it can be challenging to stay ahead of these changes and remain relevant.
Measuring success: It can be difficult to accurately measure the impact and effectiveness of the website and marketing efforts, making it difficult to make informed decisions about future strategies.

The Solutions

To address the specific challenges faced in the roof rack industry customer journey, we devised a new solution by rethinking our UX assumptions through exploratory testing and creative strategy. We focused on a funnel approach, examining each crucial stage of the customer journey, including the home page, vehicle filtering tool, category pages, and product pages.

Starting with the home page, where many customers form their first impression, we experimented with different methods to optimize elements above the fold. It was believed that by finding the best combination of elements at this stage, there would be more engagement with the banner, guiding customers to the next stage in their journey and ultimately leading to an increase in transactions.

Replatforming the old website
Establishing a brand differentiation strategy
Mapping the customer journey
Improving UX/UI design
Designing an SEO-friendly eCommerce website
Improving eCommerce SEO
Optimising performance.

2. The Problem

The Roofrack Superstore website development project aimed to create an online platform where customers could purchase roof racks and related accessories. The website should have a user-friendly interface, fast load time, and secure payment options. Additionally, the website should include a roof rack selector tool that helped customers choose the right roof rack for their vehicle based on make, model, and year.

The selector should considere factors such as compatibility, weight capacity, and dimensions to ensure customers found the most suitable roof rack for their needs. The overall goal of the project was to improve the customer experience, increase sales, and enhance the reputation of the Roofrack Superstore brand.

"Empowering customers to find the perfect roof rack for their vehicle."

3. Competitor Analysis

Competitor analysis involved examining the strengths and weaknesses of competing businesses in the same market as Roofrack Superstore. By identifying these, Roofrack Superstore was able to identify areas for improvement and differentiate itself from its competitors.

Some potential competitors for Roofrack Superstore included well-established roof rack retailers and online marketplaces that sold roof racks. To be better than these competitors, Roofrack Superstore considered the following strategies:

Offering a wider range of roof rack brands and accessories to give customers more options and increase the chances of finding a product that met their specific needs.
Developing an easy-to-use roof rack selector tool that was more comprehensive and accurate than those offered by competitors.
Providing comprehensive product information and customer support services to help customers make informed decisions and resolve any issues they may have.
Offering competitive prices and promotions to attract customers who were looking for the best deals on roof racks.
Enhancing the website design and functionality to provide a better user experience and make it easier for customers to find what they were looking for.

By focusing on these areas, Roofrack Superstore was able to differentiate itself from its competitors and become a preferred choice for customers looking to purchase roof racks.

4. Persona Development

A user persona for the RoofRack Superstore website development:

User Persona:

Name: John, 36 years old
Occupation: Contractor, specializes in roofing and building services
Income: $75,000 Education: Trade school certificate
Location: Urban area

Goals:

To find the most durable and reliable roof rack system for his work truck
To compare prices and options from different brands and models
To read reviews from other customers to make an informed decision
To make a purchase easily and quickly

Frustrations:

Difficulty in finding the right roof rack system for his work truck
Inadequate product information and specifications
Unclear pricing and shipping information
Long and confusing checkout process

Online behaviors:

Uses search engines to research products and compare prices
Reads customer reviews before making a purchase
Expects a fast and user-friendly online shopping experience
Values clear and transparent information on product specifications and pricing

Design preferences:

Clean and simple website design
Clear and easy-to-find product information and specifications
Transparent pricing and shipping information
User-friendly navigation and checkout process
Trustworthy payment options

By understanding John’s goals, frustrations, online behaviors, and design preferences, the RoofRack Superstore website development team can create an effective website that meets his needs and provides a positive user experience.

5. User Flow Journey

A sample user flow diagram for the RoofRack Superstore website looked like this while analysing the requirement and challenges:

Homepage: The customer arrives at the homepage and is presented with the main categories of roof racks available, as well as a roof rack selector tool.
Roof Rack Selector: The customer uses the roof rack selector tool to find the appropriate roof rack for their vehicle by entering their make, model, and year.
Product Categories: Based on the information entered in the roof rack selector tool, the customer is taken to a page displaying the products within the relevant category.
Product Detail Page: The customer clicks on a specific product and is taken to a detailed product page, including product specifications, images, customer reviews, and related products.
Add to Cart: If the customer decides to purchase the product, they click on the “Add to Cart” button, and the product is added to their cart.
View Cart: The customer can view their cart by clicking on the “View Cart” button.
Checkout: The customer proceeds to checkout by clicking on the “Checkout” button. They enter their billing and shipping information, and select a payment method.
Order Confirmation: The customer reviews their order and clicks on the “Place Order” button. They receive an order confirmation and receipt via email.
Order Tracking: The customer can track their order by logging into their account or by clicking on the order tracking link in their order confirmation email.

This user flow incorporates the use of the roof rack selector tool, which provides a customized and efficient shopping experience for the customer. The selector tool helps the customer quickly find the appropriate roof rack for their vehicle, reducing the time and effort needed to search for products.

6. Wireframes

Wireframes are simple, black and white, low-fidelity visual representations of a website’s pages and layout. They are used to outline the structure, functionality, and content of a website before moving on to full-fledged designs and development.

A sample wireframe for the RoofRack Superstore website looked like below.

7. User Testing

Testing and iteration were important steps in the development of the RoofRack Superstore website. The purpose of testing was to identify and resolve any issues and ensure that the website functioned as intended. The following were some common testing methods that were used:

Functionality Testing: Testing the website’s functions, such as navigation, filtering, sorting, and checkout, to ensure that they worked as expected.
User Experience Testing: Testing the website’s usability and user experience, such as the placement of buttons and the ease of use of the website.
Compatibility Testing: Testing the website’s compatibility with different browsers, devices, and screen sizes, to ensure that the website was accessible to a wide range of users.
Performance Testing: Testing the website’s speed, load times, and stability, to ensure that the website performed well under heavy traffic.
Security Testing: Testing the website’s security features, such as SSL encryption and password protection, to ensure that the customer’s data was secure.

Based on the results of testing, the website was iterated upon to resolve any issues and improve the user experience. This process was repeated multiple times until the website was deemed ready for launch.

It’s important to note that testing and iteration were ongoing processes, and it was common for websites to be updated and improved even after launch to ensure that they continued to meet the needs of users.

Feedback & Test Analysis

Feedback and test analysis were critical components in the development of the RoofRack Superstore website. The following steps were taken to gather and analyze feedback and test results:

User Feedback Collection: Feedback was collected from users through surveys, focus groups, or other methods to understand their needs and experiences with the website.
Test Result Analysis: The results of performance, compatibility, and security tests were analyzed to identify areas of improvement and potential issues.
Usability Testing: Usability testing was conducted to understand how users interacted with the website and identify any pain points or barriers to using the site.
User Experience Analysis: The user experience on the website was analyzed, including the flow of tasks and the overall design, to identify areas for improvement.
Analytics Review: The website analytics, such as page views, bounce rate, and conversion rate, were reviewed to understand the behavior of users and identify areas of improvement.

By combining feedback from users and test results, the RoofRack Superstore website was improved to meet the needs of users and ensure a positive experience for all. This information was used to make iterative improvements to the website and ensure its continued success.

The Results

$Roofrack Superstore eCommerce Web Design$

The results that were achieved on the RoofRack Superstore ecommerce website with the combination of online marketing and a new website design, along with the national expansion through multiple store openings, were substantial. Some of the outcomes that were observed included:

Increased Traffic: With a well-designed website and effective online marketing, the number of visitors to the site increased, leading to a higher potential for sales.
Improved User Experience: A new website design and improved user flow resulted in a better user experience, making it easier for customers to find and purchase the products they wanted.
Higher Conversion Rates: A more user-friendly website and effective marketing led to higher conversion rates, meaning more customers completed a purchase on the site.
Increased Sales: The combination of increased traffic, higher conversion rates, and multiple store openings resulted in an overall 8X increase in sales for the RoofRack Superstore.
Better Brand Awareness: Effective online marketing helped increase brand awareness, leading to a larger customer base and more loyal customers.
National Expansion: The multiple store openings allowed the RoofRack Superstore to expand their reach nationwide, increasing their customer base and overall sales.

By focusing on both website design, online marketing, and national expansion, the RoofRack Superstore was able to achieve substantial results in terms of increased sales and improved customer satisfaction. These results were then used to further optimize the site and continue to drive success.

Case Studies . Work . Portfolio .

Brands we have empowered

HYDAC's Redesigned Website and Targeted SEO campaigns delivered 400% marketing ROI and drastically reduced cost per lead Usability & Site ArchitectureMagento CommercePerformance Marketing

32x Oragnic Traffic growth in 8 month through SEO and Magento Redevelopment eCommerce StrategyMagento CommerceStrategy SEO

Achieving a 180% Organic Traffic Surge, 110% increase in New Users, and 3X Revenue growth through Online Channels for Brooks Running Digital StrategyeCommerce CROSearch MarketingSEO

A holiday booking SaaS CRM platform for a Travel Technology Company eCommerceSEOMobile Optimized

8X revenue growth through custom ecommerce solution, back-office integration and innovative digital marketing campaign for Roofrack Superstore Digital StrategyeCommerce Web DesignDigital Marketing

New LMS development for Real Estate Courses under Six Months eCommerceDesign DirectionCustom ASP.NET

Delivering Digital platform solution to the Australia’s home of discounted group freight rates eCommerceDesign DirectionWordPress

East Bentleigh Dental Group experienced 245% increase in conversions with ZOFELA Digital StrategyDesign DirectionWeb Design

How The Bay Gallery Furniture Increased conversion & Organic Traffic in just under 12 months eCommerce StrategySEOMobile Marketing

View all Work

"We cooperated with ZOFELA for three years. Their team really help us a lot on SEO and other marketing jobs. I can see the results after their work. Highly recommend them. Great service and very helpful staff."

Christine Chan

La Belle Clinic Managing Director

"I have been using ZOFELA for just over a year now, they handle all of my advertising from SEO, Google Ads & Social media. I was very unsure of any company in this industry as there is a lot on the line when you spend money advertising, but ZOFELA have made a lot happen for my business so I can't be happier - they have built up trust with me and will handle all of my advertising for years to come - highly recommend."

Scott Emms

SE Plumbing & Airconditioning Director

"We recently moved our business's digital marketing with ZOFELA and so far it has been a refreshing experience for us. These guys are technically sound and responsive in their dealings. UD from ZOFELA is very helpful and goes above & beyond to help."

Sarbjit Brar

Barkly International College CEO

Have a project in mind? Let's talk

Full Name *

Company Name *

Email Address *

Phone Number *

Website

Budget

State

Service of Interest *

Describe your project

Email:info@zofela.com