Reduce the bounce rate
on the first screen

Timeline
Apr 2019 - May 2020
Role
Led project(UI/UX)
Contribution: 100%
Team
LINE E-Commerce Business
2 PMs
4 Engineers(iOS, And, Web)
Platform
Mobile
Cover-Pokeo

About Service

We need another service followed by the success of the delivery service, 'Delima' from the E-Commerce business in LINE. Since the service built stability in the field and obtained more than 1.5M users, the business was in a position where it needed to accelerate its business in food. Therefore, we were targeting a take-our service using the LINE app, which means users can simply use the service within the LINE. By launching the service, we were expecting more active use in LINE and further its E-Commerce business.
In 2019, We built and launched a brand-new take-out service from scratch expanding our restaurant partnerships with the goal of reaching over 30,000 shops to attract more users.

Problem Space

The bounce rate on the service was high, exceeding 60% after the initial launch
After multiple iterations of the concept on the service leading up to the initial launch, we were confident in the final design and proceeded with implementing it across all pages. However, after the launch, we encountered an issue with a high bounce rate, meaning that users were leaving the application quickly rather than continuing to browse the service. This was a significant concern and required immediate action to be taken to address the issue.

Discover

The information on the home screen was not sufficient to proceed to the next step
We discovered that users left the service upon landing on the first page, as they were not progressing to the next step due to a lack of information. They were unable to obtain sufficient information to understand and engage with the service.
How Might We
How might we reduce the bounce rate on the Home screen and make the users more engaged in the service?

Insights

A strong preference for text-based information on the interface to build reliability
I observed that Japanese customers have a preference for seeing as much information as possible when looking at websites or applications. In contrast, the American site I observed had a lot of white space with minimal text. This difference in preferences can be seen in the Japanese site, which is covered in data and facts, catering to the Japanese craving for detailed text information.
Insights
Users(Japanese) demonstrated a strong preference for text information rather than a page filled with store images.  The research showed that users regard the text as a friendly guide to help them navigate the service

Process

Put effort into the design test to identify possible solutions
After the initial launch, we identified some issues that needed to be improved in the user experience. To address these issues, I put in more effort into the discovery and design phases to better understand user needs and create a more effective design.

Design Strategy

Enough Text Information
Provide detailed text information accompanying images of items
Because...
Users can’t get enough information to move to the next step using the service
Strongly intuitive button
Clarify the area setting button by changing it from an icon to a text
Because...
It was hard for users to recognize the icon as a button to change or set the location
Utilize Map View on the Feed
Show the map view feature with a floating button on the home page
Because...
It was painful for users to sense how far the restaurants are from their location

Iteration

Enhancing location-based service experience with relevant information
I continued the iterations to find the best user experience, applying the design solutions along the way. For example, I prioritized providing the menu images and essential information such as the price and name of each dish. Additionally, I improved the visual cues for setting the location and integrated a map with a floating button.
1
Streamline the each menu by taking them out on the feed
2
Change the setting location button from sole icon to text
3
Utilizing the map view actively
FINAL DESIGN

Informative Design

Home Screen
This is the final output of the home screen after the discovery and design process. Having more detailed information such as price, name, and picture of menus helps users to get what they want to know while browsing the content. It is easier to navigate the service in the first place compared to the previous design as well as makes users stay in the service longer.
AS-IS
TO-BE
1. Navigation menu without label
2. Alarm for the cart list on the bottom
3. Unclear area setting button
4. Zero information on items to purchase
5. Can't find how far the store is
1. Each menu with label
2. Cart notification on the top
3. Area setting button in text
4. Streamlined steps to reach payment
5. Map view with floating button

Searching through maps

We implemented the use of map view more actively to provide users with better context and information. Users can easily navigate and search what they look for by using a map.

Result

Page views and time spent on the service increased 20-fold, dropping the bounce rate by 30%
PV(Page Views) and Average time spent on the service increased significantly. The number of users who stayed on the service increased as well.

Takeaway

Reading the user's cultural tendency about navigating the interface and provide friendly guide for user
I designed the very first page of the service with images and icons which had less text information, assuming that people prefer looking through visually eye-catching images not reading a text. However, it affected the page view rate significantly resulting in them leaving the service quickly. In order to solve this issue we did research again about users' patterns using takeout/delivery services and figured out they want to know at least enough information to understand what image/picture stands for. It was more obvious to Japanese users since they have a tendency to be exposed to as much text information as they can since they feel comfortable with text when navigating the information.