Satine
Organic Milk

As a UX design intern at VMLY&R, I worked on redesigning the SATINE Organic Milk e-commerce app.

The Details

Company
VMLY&R
Client
Satine
Organic Milk
Time
Feb 2022
(3 weeks)
Role
UX design Intern
Team Member
2 UX designer
4 Developer
Product manager

I redesigned the homepage,
and iterated 5 high-fidelity wireframes within 3 weeks.

The APP was launched in Feb 2022,
and the promotional gift cards sold 400 in the first week.


3-week timeline

To ensure that our product was delivered on time, we implemented a strict schedule that involved conducting two rounds of thorough usability testing, creating two low-fidelity prototypes, and iterating through five rounds of high-fidelity development.

Define the problems

We first conducted user interviews to gather feedback on the old homepage design and identified areas that needed improvement.

Unclear membership benefits

Many users were confused about the function and benefits of membership cards.

"Could you please clarify the benefits of the membership card? Is there any discounts or rewards"

Bottom info ignored

The information located at the bottom of the page was frequently overlooked.

"To be frank, the homepage is excessively lengthy and I never actually scrolled all the way down."

Inadequate info for recent promotion

The "Recent Promotion" section lacked sufficient explanatory information and pictures, as it only displayed a title.

"This promotion is not very clear to me based on the limited information provided."

Low-fidelity 1.0

Based on user feedback, we made three updates to the homepage design:

Clients requirements

Test and refine

We received feedback from stakeholders and tested our Low-fidelity 1.0 with users. Based on their feedback and business considerations, we made the following changes in our low-fidelity 2.0 and high-fidelity prototype.

Clients requirements

"Some processes can be complicated, and it can be helpful to receive assistance from customer service."


Added sticky buttons for "customer service," "custom gift card", and "online shop," making them more accessible for users to reach from any part of the page.
"I am looking for more flexible options. I would like to buy two organic milk for my parents and one low-fat milk for myself."


Replaced "Celebrity endorsement gift cards" with "custom gift cards" to offer customers more flexibility in their product choices.
"Some processes can be complicated, and it can be helpful to receive assistance from customer service."


Added sticky buttons for "customer service," "custom gift card", and "online shop," making them more accessible for users to reach from any part of the page.

Clients requirements

High-fidelity Iteration

One

Two

Three

Four

Five