Ｃａｍｐｅｒｓ　Ｗｅｂｓｉｔｅ

An online camping supply platform

Campers website is an online camping supply platform, it provides campers with comprehensive camping support such as camping supplies, experiences, and advices.

Project duration

Mar 2024 - June 2024

My role

UX designer

Responsibilities

User research
Interviews
Competitive audits
Wireframing
Mockups
Prototyping
Usability studies
Accessibility
Iterating

Tools

Figma
Adobe Creative Suite

The problem

New campers often have difficulties when shopping for camping, including the camping supplies list and how to choose the right items.

The goal

The goal is to provide sufficient support for camping purchases, including a camping planner, camping knowledge base, personalized product recommendations, worry-free after-sales service, etc.

Understanding the user

➤ User research: Pain points

The goal of this user research is to discover the needs of potential users and summarize their pain points when purchasing camping products.
The survey targets people aged 18-55 who have camping experience.

Efficiency

Some users will re-order products from previous orders, and many repetitive user operations can be simplified.

Experience

Many camping novices have difficulty purchasing camping items due to lack of experience.

Assistance

Some campers lack guidance and advice on camping.

Service

Many shopping platforms have poor warranty and return procedures, and some even cannot track the progress.

➤ Personas

Problem statement:

Neelam is a teacher who needs to order camping supplies easily because he is usually busy, and the camping supplies he orders are very similar.

Problem statement:

Zarren is a university student who needs recommendations while shopping for camping supplies because she lacks camping experience, and she doesn't know how to choose from different items.

➤ User journey map

Mapping out the flow of Neelam and Zareen’s user journey revealed the benefits of providing campers with online purchasing of camping supplies.

➤ Value Proposition

Features and benefits

Value of the product

Accessible
Newbie Friendly
Professional
AI Solution
Worry - free After Sales

Specific value proposition

It only takes 5 seconds to order from history.
7 days free return and 14 days free replacement
Optional extended warranty
Detailed and easy product descriptions & advice
List of products with comparison marks/compare tool
Smart Camping Plan Generator

➤ Competitive Audits and Report

In the competitive audits stage I picked 3 direct competitors including REI Shop, Backcountry, Cabela's; and 2 Indirect competitors including ARC'TERYX and DECATHLON. Then I compared and analyzed from the following aspects:

General Information (Location, Price, Business size, Target audience Unique value proposition)
First impressions (Desktop website, mobile website, App)
Interaction (Features, Accessibility, User flow, Navigation)
Visual design (Brand Identity)
List of products with comparison marks/compare tool
Content (Tone, Descriptiveness)

‍

Please refer the links below for details::

Starting the design

➤ Sitemap

As an online sales platform, placing the categories most frequently used by users in the first-level menu will save users a lot of time.

➤ Digital wireframes

Home page

As the initial design phase continued, I made sure to base screen designs on feedback and findings from the user research.

➤ Low-fidelity prototype

Link of Campers Website Low-fidelity prototype

Lo-fi

To create a low-fidelity prototype, I connected all the screens involved in the primary user flow of adding an item to the cart and checking out.
At this point, I had received feedback on my designs from users and I implemented several suggestions in places that addressed user pain points.

➤ Usability study

A usability study helped me understand how well the product can help users make decisions and if the main user experience is easy for users to complete, and I used Conversion rates and SUS as KPIs.

Usability study parameters

Study type

Moderated usability study

Location

Canada, onsite

Participants

5 participants

Length

20-30 minutes

Usability main findings

Pop cart

The closing method of pop cart does not conform to user habits

Cart

The relationship between cart list, wish list and order summary is confusing

Searchbox
(Mobile)

The search box on mobile is not obvious enough

Refining the design

➤ Mockups - improvements

Based on the insights from the usability study, I made changes to improve the site’s checkout flow. One of the changes I made was The shopping cart page was rearranged to make the relationship between cart, wishlist and order summary more clearer.

The search box on mobile is not obvious enough, So I swapped it with the logo.

➤ Mockups - Original screen size

Home Page

Category result

Product page

Cart

➤ Mockups - screen size variations

I included considerations for additional screen sizes in my mockups based on my earlier wireframes. Because users shop from a variety of devices, I felt it was important to optimize the browsing experience for a range of device sizes, such as mobile and tablet so users have the smoothest experience possible.

➤ Hi-fidelity prototype

Link of Campers website Hi-fidelity prototype

Hi-fi

The Hi-fi followed the same user flow as the Lo-fi, and included the design changes made after the usability study, as well as several changes suggested by users.

➤ Accessibility considerations

The three main accessibility considerations are as follows:

The design system ensure that all text and interactive areas have sufficient contrast and text legibility. Icons are used overall to help interpret the meaning.
I used landmarks to help users navigate the site, including users who rely on assistive technologies
I designed the site with alt text available on each page for smooth screen reader access

Going forward

➤ Takeaways

Impact

Compared with other outdoor product sales apps, Campers focuses more on helping camping novices. Through research, I found that many camping novices have difficulty in purchasing products, and they are not even sure what to buy for camping. Therefore, camping planner can fundamentally alleviate user pain points, recommend camping checklists based on users' camping information, and promote users to purchase products on the platform.
‍

What I learned

I learned a lot of details about the early stages of UX design, especially about persona, journey map, value proposition, and storyboard design.

➤ Next steps

This is an exercise project, I hope to have the opportunity to implement this product in the future and continue to improve the following aspects:
‍

Functional and interactive

Filtering and sorting functions, information pages, product order and tracking related functions, comment and rating system, coupon, payment verification, multi-language, product sharing, interaction details and information feedback of each component, etc.
‍

Marketing strategy

Reward and point strategies, specific product recommendation and search sorting algorithms, camping planner’s AI and big data algorithms, after-sales processing procedures, discount and promotion strategies, warranty strategies, etc.
‍

Content

Standardization of product information, establishment of knowledge base, privacy and legal terms, etc.

Ｃａｍｐｅｒｓ Ｗｅｂｓｉｔｅ