uDine

timeline

1 week

MY roles

UX/UI Designer, Interaction Designer

In a nutshell..

Uneager for uDine to be a yet another meal kit delivery service, I scrutinized the research findings handed to me in order to find a unique touch that this company could offer. I worked up a simple and intuitive user flow and spiced it up with rich and interactive visuals.

the challenge

I looked into the business goals..

Being a food enthusiast, the company owner set out to reshape the way New Yorkers dine. However, with all the emerging meal kit delivery and grocery delivery services, he wasn't sure how to beat the competition.

..and scrutinized the research findings.

Looking over survey and interview reports, I started to get a sense of what direction to go.

the process

Synthesis

✓ Empathy map

✓ Problem Statement

Ideation

✓ Focus Areas

✓ Mid-Fidelity flow

✓ Usability Testing

UI Design

✓ Brand Assets

✓ Custom Signature Icons

✓ Hi-Fi Prototype

Animation

✓ Hero Carousel

✓ How It Works Section

✓ Specials Section

the synthesis

In an effort to empathize, I found gold.

A quick empathy mapping exercise lead to a few helpful findings.

There's a market opportunity for fast meal kit delivery
It can be achieved by offering a daily menu
The landing page would have to be highly interactive to catch attention
100% of users are looking for pricing info
Initial discount could be a nice incentive
Most foodies interviewed were using the office computers to order food, so we'd start with a web app.

Problem Statement

HOW MIGHT WE help busy foodies cook healthy meals without planning too far ahead?

ideation

I outlined the key areas..

Hero

✓ CTA

How It Works

✓ Visualized process

Testimonials

✓ Ratings & reviews

..and defined a simple flow

I added a secondary CTA upon testing.

Usability sessions revealed that the users who skipped the above-the-fold CTA and went onto the How It Works section were undecided on whether to go back or keep on scrolling. The solution was to add a secondary CTA into the How It Works section. I addressed this in the hi-fi prototype.

UI design

I worked up a few things to make the landing page stand out.

Designed the logo
Crafted a set of descriptive icons
Used eye-catching rich imagery

best part

I started the interaction with an out-of-the box (pun intended) hero area.

Moved on to my favorite part of the whole process.

I animated the icons in the How It Works section.

Last but not least - the shopping itself.

This last interaction features clicking on the product tile in order to view details.

the handoff

Putting it all together

I annotated the hi-fi landing page prototype and handed it off to the developer, together with the .aep files.

Future Considerations

Market analysis to better understand the needs, assumptions and behaviors of the foodies
Establish a way for comparing meals
Exploring the timing options for orders
Researching if mobile app is needed

Thank you! Your submission has been received!

Oops! Something went wrong while submitting the form.