Barberitos:A new (burrito) skin
My role: Lead UI/UX Designer
*Due to an NDA, I can’t show you everything that went into this project. Read the case study here, or reach out to learn more.
Although the old Barberitos app was functional, tex-mex fans and Barberitos HQ alike had several main complaints:
- Customers couldn’t place orders through the app. As evidenced by the app store comments below, this really irked Barberitos patrons.
- Users could see the location of various Barberitos restaurants– but there were no options for users to call or get directions to the restaurant.
- Users couldn’t scan in-store QR/barcodes at restaurants.
- The branding on the app was outdated and did not reflect Barberitos’ current branding guidelines.
GOALS + OBJECTIVES
Implement a new order ahead flow allowing users to place and schedule orders
Simplify the mobile user experience by adding clear CTAs
Improve the look & feel of the Barberitos app, reinforcing key branding elements.
Previously, the app would just open right into the home page.
We implemented a series of tutorial screens to be displayed the first time a new user opens the Barberitos app, directing users to the main app functionalities.
Instead of a static image, there is a carousel of images on the new homepage, meaning Barberitos can feature three promotional campaigns at once.
We put large CTAs to the most popular and most frequently used functions.
We implemented a new order ahead flow that allows users to select their Barberitos restaurant, schedule an order for a specific time/date, or order for pickup ASAP.
We also rearranged the hierarchy of information to focus on the actual percentage instead of Pepe, the beloved mascot (sorry Pepe).
We added burrito status levels, reward tiers users can unlock after reaching milestones in their Barberitos careers.
SCAN QR CODE
Users could continue to scan to pay with their Barberitos app, but we expanded upon the original functionality by offering loyalty points as well.
CONCLUSIONS / KEY TAKEAWAYS
- The Grubhub enterprise team is an agency organization, meaning we design apps for a variety of clients. This was my first time working on an agency team, and I learned a great deal about the importance of communication not only within the product/design team, but also with the clients themselves. What we think is best as designers is not always the right fit for the client, and it is our job to make sure their voices are heard and championed in the app.
- Design without attachment. Realize that what you make today could easily be shelved tomorrow, and put aside your ego to become a better listener, communicator, and designer.
- Something I thought would be as simple as a new button shape or an extra feature could actually create a ton of new work for developers, so it’s important to follow the SDK and communicate often with product managers and developers to see what can/can’t be done. It’s better to have these conversations earlier rather than later so you can better understand the limitations of the functionalities of your designs.