JAPP is the first Brazilian food delivery app focused on Japanese cuisine. Japanese restaurants in Brazil have created a culture of build-your-own combos, where the client chooses the pieces and quantities they wish to order.
Research & Discovery
During the discovery phase, we conducted extensive interviews in restaurants and followed up with testing using prototypes. We went through several wireframe experiments to understand how the path from choice to ordering was made.
Testing and Iterations
By conducting several interviews throughout the project and observing how potential users interacted with our first prototypes, we identified two key factors crucial to the development of our product’s experience, leading to a series of iterations.
The Urgency Factor:
We noticed that many users, driven by hunger, found the process of building combos from scratch too time-consuming. With this in mind, we took a new approach to the customization process, offering two ways of ordering.
Oh, the Satisfaction!
The second observation came when the order was finalized. Users felt a sense of pride and personal connection to the combos they had built, so we decided to emphasize this satisfaction more strongly in our product.
User Flow
Logo & Graphic Style
With many other food apps on the market, designing JAPP’s logo posed the challenge of portraying the Japanese cuisine niche in a straightforward yet original way. I created the logo with a playful use of a fish, taking advantage of the repetition of the letter “P” to express the options users have when building their orders. In the animated version of the logo, the two “Ps” are used to demonstrate the app’s exchange feature. The “P” became a memorable graphic element, serving as the app icon and appearing in various brand applications.
In JAPP’s case, all the restaurants it displays have similar menus with nearly identical piece options. We wanted to unify their appearance throughout the app but avoid using photographs and traditional vector icons. Our solution was to invite illustrator Liana Nigri to paint every menu piece in watercolor. The result was beautiful illustrations that give the interface a unique and special touch, unlike any other food app on the market.
Solutions
Building Your Order
Based on our observations during the prototype phase, we created two options for customizing orders. Having both options was crucial to the experience, allowing users to choose between a faster personalization process or total control over their order.
1. From Scratch
The user first decides the total number of pieces for the combo. Next, a menu of all available pieces is presented, and the user can start picking from three categories: sushi, sashimi, and rolls. At the top, two counters help the user: one for the selected category and one for the total pieces in the combo. The total cost of the combo is displayed in the footer.
2. Exchanging Pieces
The user selects a combo from the restaurant’s menu and can exchange specific pieces, like swapping Tuna for Salmon or a Philly Roll for a California Roll. In these pre-built combos, the restaurant controls the parameters, determining which pieces can be traded and which are non-exchangeable.
Reviewing Your Order
During our initial prototyping, we found that reviewing chosen pieces could be tedious and overwhelming, especially for large orders, detracting from the overall experience. To make this process more enjoyable, we reimagined the review step:
A Fresh Approach
Unlike most food apps that use basic text summaries at checkout, we turned the review into a more engaging and satisfying part of the ordering process.
Visual Engaging and Customized
We designed a review screen that is not only visually appealing but also practical, making it easy to verify each piece and quantity. To further personalize the experience, we added features like displaying the user’s profile picture and allowing them to name their combo.
INFO:
Client: JAPP
Company: Noar
Year: 2017
Strategy: Flavio Berman, Yael Dikstein, Thiago Prado, Marcela Crosman & Paula Brani
My Role: Strategy, Research, Logo Concept, Logo Design, Wireframe, Prototypes, UX & UI
Illustrations: Liana Nigri