KYMANI

Mobile E-Commerce

KYMANI is a fictional Mountain Bike Company created by prompt from fictional Product Manager.

The Problem

This company's goals are to create an easy shopping journey for serious bikers. They hope to promote good conversion from browse to completion of checkout as a result of this user centered experience.

My Role

Solo Designer

Tools

Figma

Dovetail

Paper and Pencil

Timeline

4 weeks (90 hours)

Methods

Project Planning, Competitive Analysis, Heuristic Evaluation, Sketching, Wireframe, High Fidelity, Prototyping

Project Brief

Info from fictional Product Manager:

Company Context

This company wants to have a user centered browsing and checkout experience. They want this to improve the conversion from browse to completion of checkout to increase revenue on the product’s mobile-web experience.

Target Users

● 24 - 38 years old ● User base is 72% men ● High income earners ● They take biking very seriously and will spend a lot of money on this investment. ● They are very picky and do their research.

Timeline

Time Management Goals

Time budget: 90 hours

Span: 4-6 weeks

Budgeting this time needs to coincide with my full time job. Time management needed to be very meticulous and strategic on this project.

I had a weekly mentor meeting and set fluid deadlines for each phase of this project - keeping the end date rigid. I ended up at 4 weeks for this full project. Thankfully my full time job was flexible, and I utilized a couple of days off to get ahead of my projected schedule.

Secondary Research

How might we improve conversion from browsing to checkout?
How are other companies catering this experience?

To increase conversion and decrease cart abandonment:

Implement a Guest Checkout
Forced account creation can deter potential one-time shoppers. Especially in the case of a bike, where this is a big purchase and could potentially be a one time purchase.

Have inclusive shipping options and pricing
Customers don’t want to be surprised by cost once they get to their cart. Having an unexpected cost could cause them to abandon their order.

Create a fast and simple checkout experience
If users aren't satisfied with this process or get confused in this process, they might abandon their cart.

Have alternative payment options
Inadequate payment options is another reason for cart abandonment. Users prefer differing payment options for many reasons - One being it builds trust.

Competitive Analysis // Heuristic Evaluation

In the Industry Leader Study, I compared these three mobile experiences and gathered screen shots and notes. I paid attention to what I believed was working, what could be improved, and how this would affect my actions in my design. For the Heuristic Evaluations I continued looking into Trek and REI, but decided to add Cannondale to the lineup.

Check out the full Industry Leader Study by clicking the link below:

*Link to full Industry Leader Study Here

Check out the full Heuristic Evaluation by clicking the link below:

*Link to full Industry Leader Study Here

Secondary Research & Competitive Analysis Findings:

Understanding goals of different brands

Different companies caters to different goals. These might not align with our goal of completion of checkout. Some didn't have an experience that was well catered to shopping and purchasing products on their site, such as Trek. They seemed to prioritize finding their products in store vs. for purchase on their site. This is one area that I wanted my design to be different.

REI however had a contrasting browsing experience. This one was simple and simplified the process of finding a bike to purchase.

Information Architecture
Every company had very different ways they organized information. I spent a lot of time evaluating - If I were a new customer, and my goal was to actually purchase a bike on this site, what would I want/expect and why? What things were I experiencing that seemed helpful or hindering?

Sketches

Sketches were designed based upon findings from Competitive Analysis, and Industry Leader Study, as well as research on cart abandonment

Inspiration/Priorities when designing:

REI's information architecture
Product categories on home page in an easy to find location
Intentional when placing suggestions for similar products
Consider audience - how to cater to users who know this product, as well as those who don't
Having guest checkout
Simplifying checkout process
Having alternative payment methods

First round of testing

First round of testing was on these sketches with 5 participants

Goals:

1) test flow of design

2) collect data on past mobile shopping experiences and habits when mobile shopping

Findings:

Most participants window shop more than with intent to buy.

Some prioritize purchasing in person and use online shopping to research and find inventory nearby.

All participants had negative mobile shopping experiences in the past
Some of the most reported issues:

experience was not tailored to a mobile platform, inputting information can be challenging partly due to small screen size, items in cart not populating or timing out too quickly, some things that should be clickable aren't, products or images can be hard to scroll through or zooming isn't intuitive, searching for things with specific dimension can be unsuccessful.

Most participants prefer guest checkout

Many participants have an aversion to creating accounts

Some said they would make an account for perks such as discounts.

Changes to Design:

Improve CTA

There was an area missing the CTA, and another where the CTA could be improved

Refine steps for checkout
I was able to remove an entire step during checkout by consolidating what was on two different screens. This made the flow less confusing as well as more simple.

Most participants prefer guest checkout

Many participants have an aversion to creating accounts

Some said they would make an account for perks such as discounts.

High Fidelity

Second round of testing

The second round of testing was on the high fidelity prototype. This was a usability test where the main focus was to test people's experience with the product.

Findings:

Participants reported that this process was simple and intuitive for them

When given a task, users completed it without any questions or hesitation.

The only points of confusion were differences in Filter/Sort and Description/Specs
Some participant admitted they always get confused about these when shopping. This makes me wonder how other designs accommodate for this confusion, and will definitely be something I add into my next steps.

Next Steps:

For my next iteration I would like to work on the hierarchy a bit. I think I could simplify my text styles, as right now I have many contexts that I'm not using in my design. I could also look at utilizing color to achieve hierarchy. I think I would like some kind of accent/highlight color.
I want to adjust my grid and give myself larger side margins.

Additionally I want to add more interactive screens into my prototype so that a user can play around instead of going down one singular route. As mentioned earlier, I also want to investigate if there is a better way to design Filter/Sort and Description/Specs since this seems confusing to a few users I spoke with.

So keep an eye out for that update if you're interested. As for now I have another project in the real world that I'm excited to be starting soon.

Jenn Toby

KYMANI

Mobile E-Commerce

The Problem

My Role

Tools

Timeline

Methods

Project Brief

Company Context

Timeline

Secondary Research

How might we improve conversion from browsing to checkout?
How are other companies catering this experience?

To increase conversion and decrease cart abandonment:

Implement a Guest Checkout
Forced account creation can deter potential one-time shoppers. Especially in the case of a bike, where this is a big purchase and could potentially be a one time purchase.

Have inclusive shipping options and pricing
Customers don’t want to be surprised by cost once they get to their cart. Having an unexpected cost could cause them to abandon their order.

Create a fast and simple checkout experience
If users aren't satisfied with this process or get confused in this process, they might abandon their cart.

Have alternative payment options
Inadequate payment options is another reason for cart abandonment. Users prefer differing payment options for many reasons - One being it builds trust.

Secondary Research & Competitive Analysis Findings:

Sketches

Sketches were designed based upon findings from Competitive Analysis, and Industry Leader Study, as well as research on cart abandonment

Inspiration/Priorities when designing:

First round of testing

Findings:

Many participants have an aversion to creating accounts

Some said they would make an account for perks such as discounts.

Changes to Design:

Many participants have an aversion to creating accounts

Some said they would make an account for perks such as discounts.

High Fidelity

Second round of testing

Findings:

Next Steps:

Return to top

KYMANI

Mobile E-Commerce

The Problem

My Role

Tools

Timeline

Methods

Project Brief

Company Context

Timeline

Secondary Research

How might we improve conversion from browsing to checkout? How are other companies catering this experience?

To increase conversion and decrease cart abandonment:

Implement a Guest Checkout Forced account creation can deter potential one-time shoppers. Especially in the case of a bike, where this is a big purchase and could potentially be a one time purchase.

Have inclusive shipping options and pricing Customers don’t want to be surprised by cost once they get to their cart. Having an unexpected cost could cause them to abandon their order.

Create a fast and simple checkout experience If users aren't satisfied with this process or get confused in this process, they might abandon their cart.

Have alternative payment options Inadequate payment options is another reason for cart abandonment. Users prefer differing payment options for many reasons - One being it builds trust.

Secondary Research & Competitive Analysis Findings:

Sketches

Sketches were designed based upon findings from Competitive Analysis, and Industry Leader Study, as well as research on cart abandonment

​

Inspiration/Priorities when designing:

​​

First round of testing

Findings:

Many participants have an aversion to creating accounts

Some said they would make an account for perks such as discounts.

Changes to Design:

Many participants have an aversion to creating accounts

Some said they would make an account for perks such as discounts.

High Fidelity

Second round of testing

Findings:

Next Steps:

Return to top

How might we improve conversion from browsing to checkout?
How are other companies catering this experience?

Implement a Guest Checkout
Forced account creation can deter potential one-time shoppers. Especially in the case of a bike, where this is a big purchase and could potentially be a one time purchase.

Have inclusive shipping options and pricing
Customers don’t want to be surprised by cost once they get to their cart. Having an unexpected cost could cause them to abandon their order.

Create a fast and simple checkout experience
If users aren't satisfied with this process or get confused in this process, they might abandon their cart.

Have alternative payment options
Inadequate payment options is another reason for cart abandonment. Users prefer differing payment options for many reasons - One being it builds trust.