Last Minute Gear

Customer Flow and Visual Experience Design

Timeline: 3 weeks

Platform: Desktop, Mobile/Responsive Versions

Roles: User Research, UX Design, Wireframe, Prototype, Usability Test, Visuals.

Into the forest I go, to lose my mind and find my soul.

John Muir

Background

Living in the SF/Bay Area, we are blessed with the world-class nature getaways. However, San Franciscans ranks 5th smallest nationwide, having an average living space at 486 sq. ft per person. So for the city dwellers to follow the great John Muir venturing into the wilds, their caravans will mostly be outfitted with rental gears!

The #1 search result for gear rental shops in San Francisco did not go to one of the franchise chain stores in the suburbs, but to a little known store called Last Minute Gears, an intimate, local business, who reliably supplies its customers in the center of the metropolis, Union Square. 

This is a case study of a speculative redesign of their rental website.

Initial Observations

In opposition to the business’ expertise and its great service ethics, their E-commerce website has not yet lived up to its potential. For example, the customers learns about each gear by reading pages of dense gear guides. Here are a few more noticeable issues:

Purchasing Page is a
Google Sheet

Used item sales page is not well-supported, rather it is a complicated Google sheet, and their products are listed via KnockKnock.

Navigation Confusions

New tabs of products and guides multiply and fill up the browser bar. Rental page’s nav and sub-nav show no distinctions. Product descriptions are separated from the product pages.

Information Allocations

Starting at home page and onward through the rental or purchasing process, textual information crowds every pages and popups. Some organization and consolidations ought to be considered.

Discovery & Analysis

Design Approach

Rather than addressing the above issues, I began by making general business researches and focused on redesigning Last Minute Gear’s core task flows. By straightening the core flow, the “spine”, the various features and issues in questions may also be calibrated accordingly. This core flow is the gear rental experience.

Competitive & Comparative Analysis

First step was to explore the outdoor gears vendors and the online rental businesses. Through feature inventory and user testing exercises, I came a way with some understandings such as…

  • Various PLP, PDP, and checkout flow
  • Product bundles are well-liked
  • There are little to none beginner support

Empathize

The first steps I took in research and discovery phase were to observe and understand the habits and mentalities of the actual users. I used surveys and conducted behavioral interviews to gain insights on user habits using this and other similar websites. What were they looking for? Were they in a hurry? What did they think or seek at various junctures?

I synthesized the findings into a few noticeable themes, which can in turn be summarized into two personas. My core user flow will provide service and memorable experiences these two personas.

Personas

Previous
Next

User Journey Maps

Next I plotted user emotions as Journey Maps through the lenses of our user personas. With these I can visualize high and low points of their user experiences and areas to improve upon.

Travis, the expert wanderer and explorer, visits LastMinuteGear.com as frequently as his recurrent monthly trips into the nature. His hobby made him a collector of gears. And he often need to rent a large order of gears for his friends and family. Working with LastMinuteGear.com is a bitter-sweet experience. He enjoyed finding new gears to buy or rent. But he is discouraged first when he needs to make a purchase-only checkout. Then reach a lower point spending time collecting rental gears and go through a second checkout for rentals

Stephanie, as with all adventurers, may in her first time gear-shopping experience, realizing that she needs know a lot of things in a hurry to choose the right gears. Without the appropriate knowledge, the uninformed choices can make or break the success of the trip.

 At time like this she seeks assistance, a way to inform her fluidly and comfortably throughout the rental process. Without help, she is at risk leaving the website for Youtube help or for bigger stores.

How Might We Address Their Needs?

The two personas’ problems can be summed up as such:

  • How might we streamline the checkout process for purchasing and rentals?
  • How might we simplify bulk rental routines for new and returning users?
  • How might we effectively assist our amateur users with necessary knowledges to make decisions?
  • How might we adjust info and navigation architecture to increase user adaptability? 
These “how might we” questions will be the central topics to redesign the core user flow. I believe the solutions may also address the earlier issues and assumptions as well.

Effective Card Sorting

Next, I conducted card sorting to determining 2 quandaries regarding information and navigation architectures:

Inventory Sorting

Product Location Findings

The outcome was unexpected. I learned that seasoned renters browse products by activities, while new users browse products as if in a department store, that is, picking apart clothes, gears, and toiletries.

Rental Process Sorting

Rental Sequence Findings

This too was a surprise. The users chose Rental Dates first before Selecting Gears. Doing so to assure the availability of the gears in that time frame.

Design & Iterations

A New User Flow

Based on the evidence gathered, I came up with the following design ideas:

  • Place the first rental action, the reservation date, on home page.
  • Upgrade single-page filter PLP with navigation menu based on card sorting.
  • Embed short educational videos in strategical location to assist the users.
  • Offer gear rental bundles as products to speed up the shopping process.
  • Combine purchasing and rental checkouts as one process.

Design 1: Speeding up Rental Action

The main service of LastMinuteGear.com is gear rental, yet the landing page lacks a strong call-to-action design. Only a small, ambiguous “Start” button is available. I shifted the first step of the rental process to the beginning in order to create a more efficient user experience and reduce bounce rate. This adjustment is intuitively in line with what users have experienced on other booking services such as Airbnb, U-Haul, Kayak, and many others.

Before

Wireframe

Hi-Fi

Design 2: Single-Page Filter PLP & New Navigation Structure

Adopting a single-page filter PLP is an easy decision. Not only this can scale with the inventory, this also align the browsing experience with the purchasing flow as well, and ultimately pave the way to combine the rental and purchasing checkout into a single trip.

At this point, I also applied the analysis from card sorting. While the experienced users browse by activities (camping, snowsport, climbing), the inexperienced users browse in department store mentalities (men, women, kids). The solution here was: Why not both? Moving these categories to the top tier nav. 

Single-Page Filter PLP

Design 3: Education in Motion

According to the research, new users want information to help them choose the correct gears, and they want it in a digestible format in the shortest time possible so they don’t leave the site. My new design features short movies that are placed vertically on the PLP page, similar to the appealing and familiar TikTok viewing approach. The video will play silently when hovered, or with sound when clicked upon.

The videos will be relevant to the products nearby. For example, a video explaining sleeping pad types is placed in the rows of the sleeping pad products. (The current gear guides are still resourceful and should remain as further readings.)

Additionally, these videos can also be utilized as marketing channels.

Wireframe

Hi-Fi

Another innovating idea is to include some side by side detail captioning when customers scroll through the item gallery

Descriptive Text in Galleries

Design 4: Quick-in, Quick-out, Gears in Bundles

In task analysis, both seasoned or new users reacted very well with multiple gears packaged as a single product. This saves time from learning or searching. It also can increase upsell for business on less recognizable items.  

The package bundles can differentiate by types or themes, such as car-camping, backpacking, snow apparels with or without skis, families gears, youth outfit ensemble, couples camp bundle, etc.

Customers can then customize each one the gear in size and functions at the PDP using accordion forms.

Design 5: No More Checking Out Twice!

Combining rental and purchasing checkout is already a common practice. By designing text fields for several scenarios in the checkout flow, any user case can be covered whether if they are renting via courier or pick-up, purchasing-only, or both. 

Rental-Only Checkout Flow

Rental + Purchase Checkout Flow

Usability Tests

The usability test yielded a positive feedback. Almost every design components were intuitive to users. They understood clearly what to do and where to go. The user comments that require changes occurred in the checkout phase. They asked for consistency on words like “courier”, “delivery”, “shipping”, “pick up”, and “return”. Once the terminology was aligned, the flow became fluid.

Color Experiment & Responsive Design

Color Schemes

LastMinuteGear.com does not have a coherent color scheme nor an adequate logo yet. These two matters are essential elements for successful branding. In the small window of time, I experimented with several unconventional color brands. My hope was to create a lasting impression with a distinct identity, not staying in the norm of another sporting good website.

The variations below show a variety of options. The green and yellow combo is more common, whereas the other two are unique. The tinted turquoise combo offers a relaxed, supportive experience. The deep purple and pink combo boldly stands apart from the competitors, as there is no color scheme quite like this. The pink stirs excitement, the purple lingers in memory.

Mobile Responsive Designs

Home

PLP

PDP

Outcome & Takeaways

Improved User Journeys

The resulting user journey maps should now be improved as such…

Takeaways 💡

The usability tests helped affirming that the new and improved core user flow, a combination of new design features, UI upgrades, and color experiments, addressed the synthesized personas’ problems and uplifted their experience using the website. I hope the redesign would elevate LastMinuteGear to have a reliable online presence as they scale up in the future.

Some lightbulbs and takeaways from this project were…

  • Customers have the mentalities that rental dates must come first in order to make sure the gears are available.
  • Rental package’s product image might not look appealing on PLPs, but both the new or experienced customers find these packages positively useful.
  • The design of embedding videos as product cards using TikTok layout in a PLP can be impactful for many future projects .

Next Steps

If more time is are available, more feature details can be hashed out, more test and interview data can be acquired, more visual design can be iterated. The possibilities goes on.  A few immediate steps to strengthen the redesign:

  • If there were more time, I would really hope to conduct stakeholder interviews to get more insights from the business point of view.
  • The gear guides here are more comprehensive and thorough than any other competitor websites. I wish to spend some time organizing the gear guides to be more accessible for the users.
  • Continue to iterate on UI and color design.

Share this:

Like this:

Like Loading...
%d bloggers like this: