BACK TO PORTFOLIO
YELP REDESIGN
YELP BRAND + APP
5 hours quick prototype.
Focusing on the re-design of Yelp brand, Yelp App UI (home / profile). Partial UX and user flow.
NOV 2017
The Brief
A five hours quick prototype
to re-design Yelp, from brand to visuals.

I decided to do the brand and UI,
instead of complete UX flows.
So follows are UI designs from sketches,
to wireframes, and to designs.
SAY HI TO THE NEW YELP
Simple and fresh
Here's how the new launch screen
looks on a brand new iPhone X.
SAY HI TO THE NEW UI
All about
Gestures
I am a gesture believer.
From the day when multi-touch was born,
I wish I could use my finger to interactive with
everything on a touch screen.
(I didn't mean to "click" or "tap")

A perfect UI for a mobile device
shoule never be designed to look or work
like a smaller version of a webpage,
which unfortunately a lot of App designs are.

Here are the UIs for switching
between categories, and reading an article.

Detailed UI and UX are as follows.
SKETCH EXPLORATIONS 1
Gestures
1. Swipe left and right for switching cards

2. Pinch in to see a full view,
pinch out to see one

3. Tap on one card to see details
WIREFRAME EXPLORATIONS 1
Gestures!
As I mentioned in sketches,
swipe to switch between cards,
pinch to go in and out.
WIREFRAME EXPLORATIONS 1
Gestures!!
...and tap to see detailed cards,
swipe left and right to switch categories,
swipe up and down to switch articles.
SKETCH EXPLORATIONS 1
A new user
As a new user to Yelp,
he/she needs to find some friends,
find or check-in a restaurant,
or write a review.

I designed a consistant UI system for
both experienced users, and new users.
WIREFRAME EXPLORATIONS 1
A new user
Here it goes.
SKETCH EXPLORATIONS 2
Less crazy version
By "less crazy", I mean a standard layout,
but still works with lots of gestures.
WIREFRAME EXPLORATIONS 2
Less crazy version
SKETCH EXPLORATIONS 3
Less crazy and
colorful
WIREFRAME EXPLORATIONS 3
Less crazy and
colorful
LOGO EXPLORATIONS
Logo sketch
From a polygon to the classic Yelp shape (lemon?)
with rotation, shrink and pop up animations.

It also represents the review stars.
NEW YELP
Logo design
1. The new typography has a up-to-date simplicity,
and unbalanced letter shapes.

2. The animation is always on.

3. It's alive!