Today Uber Eats is the fastest growing delivery service in the US, making up 10% of the company’s total bookings. When Uber Eats started, it was merely an extra feature within the main Rider app. But, in 2015, with surging demand for Eats, the Uber team launched Eats as a standalone service and app. Focused on growth into new markets, the internal design team didn’t have 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.
MetaLab is a talented group that proved a natural fit to supercharge our design team. Their attitude and work is top notch, with a focus on execution and impact.
We cared very much about getting this project right so it was great to collaborate with the Uber design team–even from here in South Africa.
It was great to see the two teams working together. We’re both fast-moving and focused on getting sh&^t done which allowed us to do some incredible work in a short period of time.