Next Project
.svg)
Today Uber Eats is the fastest growing delivery service, with a $2.8 trillion addressable market, making up 22% of the company’s total bookings in 2019. When Uber Eats started, it was merely an extra feature within the main Rider app. But, in 2015, with surging demand, the Uber team launched Eats as a standalone product. Now focused on growth into new markets and growing from 3% to nearly 25% of Uber's revenue, the internal design team hasn't had time to slow down.
Having successfully helped with Uber's main Rider app, our team was asked to help bring Eats its own design system while staying true to the Uber brand. Their ask: build on their existing UI kit, Ceramic, to elevate and differentiate the Eats brand.
We went back to the basics by first establishing consistency across Ceramic then building upon the foundations of the product to create a memorable experience for the user. With a UI kit and design system built for a large dynamic team, we included Sketch symbols, text styles, motion guidelines, and color palette to allow designers to work faster while maintaining strong consistency.
Feeding people around the world is no easy feat. Uber Eats must translate across both digital platforms and international borders. Ceramic is like a plate; one that works with any type of cuisine, feels appropriate for every dish, and never overshadows the food. This is a principle we carried through to the motion framework.
The navigation framework we worked on with the Uber team visualizes how people move through the app. We used this to make motion meaningful and intuitive. Interactions on the same level, like menu to dish item in the figure above, have subtle animations, while we added more delight for movements between levels.
Walking into a restaurant is always a special moment. You enter into the space and immerse yourself into the aroma, the atmosphere, and the people. With conceptual animation garnishes, tapping into a restaurant in Uber Eats can share that special feel.
To celebrate that your food is on its way, there is garnish to take you from the purchase screen to the visual order tracking. Now you can follow your meal from diner to doorstep, easing all concerns about when your order will arrive.
We really enjoyed working with the Uber team, going back and forth until we got the design system to a place we were both proud of. It was a truly collaborative effort—one that took place across 3 countries and multiple continents. And it’s always fun to see our work out in the wild so quickly.
