top of page

My role:

UI Design

UX Heuristics

User Interviews

User Flows
Wireframing

Testing

​

​

Duration:

7 days

​

Tools:

InVision

Sketch

Marvel

Illustrator

​

YHG logo@4x.png

e-commerce design sprint

Cog.png

DISCOVERY 

Cog.png

DESIGN & VALIDATE 1 

Cog.png

DESIGN & VALIDATE 2 

Cog.png

NEXT STEPS 

Screen Shot 2021-02-05 at 4.16.29 PM.png

See the prototype here!

lift%404x_edited.jpg

THE PROBLEM

Cog.png
Cog.png

Your HOME Gym is a website store
selling new and used gym equipment - specifically designed for people who prefer
to work out at home vs. a commercial gym.

THE BRIEF

Improve the conversion from
browse to completion-of-checkout
in order to increase revenue
at the Your HOME Gym store.

​

bike%404x_edited.jpg
Cog.png
row%404x_edited.jpg

THE GOALS

  1. Create a seamless and welcoming
    on-boarding experience

  2. Encourage buying confidence

  3. Increase check out rate

​

Cog.png
Discovery

DISCOVERY
understand and map

weights%404x_edited.jpg

I started with a competitive
analysis research of 3 sites: 

​

1

  • Academy

  • Dicks Sporting Goods

  • Gym Source

​

Screen Shot 2020-10-27 at 1.29.14 PM.png
Screen Shot 2020-10-27 at 1.29.24 PM.png

Competitive analysis flows provided
the following takeaways:

  • Keep “branding ads” to a minimum

  • Reassure users with security symbols

  • Offer a clear return policy

  • 2 pages maximum check out screens

  • Provide multiple payment options

2

Conducted 5 remote user interviews
in order to Identify potential users and find ways to improve engagement  shopping for gym equipment online.  
 

​

Participants Interviewed

  • Users think new gym equipment is
    too expensive

  • Quality, condition & brand of equipment
    costing over $250 is important

  • Not confident in their decision making
    process at checkout

  • Can’t find what they are looking for

  • Deterred by cost, they lose their nerve

Interview Summary

step%25404x_edited_edited.jpg

Users aged 25-55

Workout regularly (3+ times a week)

Own a smartphone / computer

Experienced with gym equipment


Due to Covid, the cleanliness of used gym equipment was a such a hot topic that I decided to focus this iteration of the project on purchasing NEW gym equipment. 

​

Affinity Map

affinity map.png
lift%202%404x_edited.jpg

3

PERSONAS
From the user interviews
and affinity map I was able
to create two personas for
our home gym shopper:

​

Screen Shot 2020-10-27 at 3.40.12 PM.png

Janice

Screen Shot 2020-10-27 at 3.40.20 PM.png

Jim

Screen Shot 2020-11-02 at 11.26.09 AM.pn
lift%25404x_edited_edited.png

This data inspired the following
How Might We questions...

 

​

HMW make searching for gym equipment more organic for the user? 

HMW create a faster way to checkout? 

HMW make a user feel confident/reassured about their purchase?

​

Cog.png
Anchor 1

DESIGN & 
VALIDATE 1

DESIGN (1)

weights%404x_edited.jpg

1

After I created an onboarding user flow, I designed the wireframes I needed to create lo-fidelity screens in order to put the flow to the test

​

user flow.png

user flow

wireframes

wire frames.png

lo-fi screens

Screen Shot 2020-10-30 at 9.12.43 AM.png

2

step%25404x_edited_edited.jpg

VALIDATE (1)

I remotely tested 5 people
that fit the application's demographics.
Each interview lasted 20 minutes.

 

TASKS

  1. Find an elliptical and add it to the cart.

  2. Purchase the elliptical

  3. Find and review the Return Policy.

​

LO fiproduct.png
Lo-fi cart.png
Lo-fi Checkout.png

DISCOVERIES

  • Users said the "big" pictures made finding the eliptical "easy"

  • Many wanted to see the “return” policy on the product page

  • Wished that the checkout page “looked more secure”

  • Wanted to see payment options on the cart page

lift%25404x_edited_edited.png

These key takeaways provided the
 following recommendations...

 

​

  • Remove the third step in the checkout process

  • Replace "next" with “confirm order” button on 2nd step

  • Add the "return" policy button to the product page

  • Add security icons to the checkout page

​

Cog.png
Anchor 2

DESIGN & 
VALIDATE 2

DESIGN (2)

weights%404x_edited.jpg

1

Considering our key personas, the spirit of the brand evokes:

• affordability

• strength

• approachibility

YHG logo@4x.png

style guide

Screen Shot 2020-11-02 at 10.26.29 AM.pn
Cog.png

2

step%25404x_edited_edited.jpg

VALIDATE (2)

For the 2nd round of testing
I remotely tested 5 NEW people
that fit the application's demographics.
Each interview lasted 20 minutes.

 

TASKS (2)

  1. Find an elliptical and add it to the cart.

  2. Purchase the elliptical

  3. Find and review the Return Policy.

​

DISCOVERIES/IMPLEMENTATIONS

  • Users wished they had seen the return policy earlier
     FIX: Added return policy to the product page

  • Questioned the need for a “quanitity” option on the cart page
     FIX: Remove quantity option for high ticket items

  • Wished to see the security icons during the first step of checkout- rather than just on the credit card page
    FIX: Move the security icons to the item card on the checkout screen

key screen iterations

Lo-fi testing round 1

Hi-fi testing round 2

Final iteration implemented

Landing page

LO fi landing.png
01 Landing page.png
01 Landing page.png

Cart page

Lo-fi cart.png
04 Cart modal.png
04 Cart modal.png

Product page

LO fiproduct.png
03 Product page.png
03 Product page.png

Lo-fi testing round 1

Hi-fi testing round 2

Final iteration implemented

Checkout page

Lo-fi Checkout.png
06 Checkout field 2.png
06 Checkout field 2.png

Confirmation page

Confirmation page.png
07 Confirmation page.png
07 Confirmation page.png
lift%25404x_edited_edited.png

  • Add membership profile so that ads could carter specifically to users' budgets

  • 30 day return no-hassle return policy stated up front and often afterwards

  • Further explore a selling option for used gym equipment or trade-ins

  • Offer one-step checkout for members

  • Add "points" to purchases for members

​

See the prototype here!

Next Steps

Anchor 3
bottom of page