Expanding NAVER Order to franchise brands
Embracing and supporting large brands onto NAVER Order
Role
— Lead designer, NAVER
My responsibilities
— User experience, Visual design, User research, Usability testing
— Cross-functional communication across teams
Collaboration
— 4 Product managers
— 2 Product designers
— 3 Front-end developers
— 6 Back-end developers
— 3 Marketers
— Starbucks Korea
— Starbucks HQ
Duration
— 02.2020 ~ 04.2021
— Public release on 07.2020
Problem Context
There are many cities in South Korea, where franchise brands are concentrated around the same areas.
Since brands like Starbucks have a lot of branches in a close range, people usually open a map to find the nearest location.
If you want to order online with these brands, you need to switch to their service or their app.
The user experience is bound to be fragmented from a what the user was browsing in the map.
In addition, you need to keep up with the various services for each brand.
It is cumbersome to sign up, adapt the different UX, and manage coupons & rewards for each individual brand.
Project Background
Design Goal
Design an experience that seamlessly blends into the user’s search experience
Recognizing that users can have more diverse purposes beyond just online orders, it was crucial to weave in the right level of order information depending on the context. One of the goals was to integrate the ordering experience seamlessly within the broader user journey, ensuring that it aligns with users’ needs and enhances their overall search experience.
Design a system that can connect to the existing structures of each brand’s service
To accommodate the unique structures and processes of each franchise brand, a unified system needed to be designed. This goal involved understanding the systems of these brands and integrating their workflows into the NAVER Order platform, so that we can create a cohesive and efficient experience for the end-user.
Design a platform that can express the identities of different brands while keeping NAVER Order's look & feel
This goal focused on maintaining a balance between the individual brand identities and the overall NAVER branding. It aimed to create a harmonious design system that allows each brand to express its unique identity while ensuring consistency and familiarity for users across the platform.
Design a single space that allows users to see all the rewards collected from multiple brands
We aimed to offer a single page where users can see membership benefits, rewards, and promotions from different brands. It was to enhance user convenience by enabling them to easily access and manage their loyalty benefits across multiple brands.
Analysis of the pre-existing system (e.g. Starbucks’ case)
Design Exploration
Integrate the ordering experience into the user’s search journey
Being mindful that users browsing the map can have diverse purposes beyond just online ordering, I focused on presenting the appropriate level of order information within the overall search experience.

- Instead of directly promoting the order service, I prioritized showcasing valuable menu data, including dish images and pricing details sourced from NAVER Order, at the top level. This not only enhances the browsing experience but also indirectly promotes the order service by providing comprehensive and reliable menu information.

- For the ease of use, we implemented a design strategy that leverages context. For instance, we ensured that the ordering services are prominently visible only in relevant contexts like the menu tab or when users search for specific queries like "Coffee Takeout." This contextual placement enhances the discoverability of the ordering services, making it effortless for users to find and engage with them.
Improve data hygiene and real-time sync for a more seamless user experience
One of the significant challenges we faced came from the ordering data structure across various brands.

- Thousands of possible order combinations were found to be disorganized and lacked a reusable pattern or structure. At some cases, someone had to manually enter these combinations into a spreadsheet each time, leading to significant friction points. -> To overcome this challenge and improve the user experience, we collaborated closely with the engineering teams of each brand to revamp the order data structure and streamline the process.

- It was crucial to establish seamless backend integration between NAVER Order and each brands. While users place their orders through NAVER, it is the brand who prepared the food. Therefore, real time synchronization was key. For example, the # of sandwiches displayed in NAVER Order needed to be accurately updated with the actual stock in the brand's stores. -> By defining these connections and incorporating them into the design, we ensured precise and timely information exchange, resulting in a seamless and reliable user experience.
Blend the different brand identities while maintaining NAVER’s look & feel
To create a platform that celebrates the unique identities of different brands while maintaining the cohesive look and feel of NAVER Order, I carefully created a design system. I collaborated closely with each brand's design team (including Starbucks' headquarters in Seattle) to understand their brand guidelines and incorporate them seamlessly into our platform. This helped us scale to different brands without having to redesign every time.
Provide a consolidated space for users to view rewards from multiple brands
Users can conveniently access rewards, promotions, and membership benefits from different brands on a single page. Loyalty benefits (e.g. a free cup of coffee) are seamlessly integrated into your search experience, enhancing the overall ordering journey. Users also receive notifications for earned rewards and promotional benefits, ensuring they stay informed about available offers. Without managing various services individually, I hoped for users to access their loyalty benefits effortlessly through NAVER Order.
.
.
Final Design
Feature 1: Home
We designed a store page that makes it easy to browse and decide what to purchase. It is composed of the following.
Recent orders
Reorder your favorite food quickly. It is even remembers your customization options.
My rewards summary
Summarize the rewards you can receive.
Menu sorted by popularity
Recommendation sorted by frequency of orders to help users make more informed choices.
Pageless scroll
Bring together all the options into a single scrollable page, with a top bar navigation to jump between the sections.
Feature 2: Item page
While users can add items to cart directly from a store home page, they can view more information for each item. We included the following information in each item page to inform purchases.
In-depth details
See the full description before purchase.
User reviews
See reviews that were left on each item.
Related items
Discover other items users frequently orderedtogether.
Nutrition info
Details on the ingredients and where they are sourced from.
Feature 3: More intuitive customization
In order to make customization easier to identify and change, we turned what used to be a list of text options into interactive controls.
Feature 4: Brand Guide
After building an understanding of the needs from different partners, we developed a brand guide and a UI framework to enable it in the product so that NAVER Order can scale with our partners.
Feature 5: Rewards stamps, Coupons
We brought together the rewards users have collected and and available benefits into a single view.
In Action