Skip to content

Viar Battery Station System

A solution designed to address 2-wheels drivers' e-motor mileage anxiety.

Duration

2022.4-2022.5

Role

Product Designer

Discipline

End to end UI/UX design

Company

Grab
Viar Battery Station System

Why Battery System?

Grab is the largest provider of ride-hailing, food delivery, financial services, and more in Southeast Asia, backed by millions of driver-partners. GrabElectric is Grab’s electric two-wheeler service that has been serving driver-partners for GrabFood, GrabBike, GrabExpress, and other services since 2021. GrabElectric is Grab’s electric two-wheeler service that has been serving driver-partners for GrabFood, GrabBike, GrabExpress, and other services since 2021.

The vehicles are powered by electricity, making them environmentally friendly and cost-effective.

However, e-vehicles face the challenge of limited battery range. Each vehicle can carry only one working battery and one spare, and charging takes up to 5 hours. The lack of charging ways or battery swap options exacerbates this issue.

Research Summary

Driver Satisfaction Survey 2020

Our Goal

Before I joined, the team had already started building a battery station system.

The goal is to help drivers easily get fully charged batteries to reduce their battery anxiety and improve their satisfaction (NPS).

In August 2021, we launched the MVP version of Kymco’s battery station, receiving positive feedback.

When I joined, the team’s focus was on the Viar battery station system, covering 80% of the user base (As 80% of the vehicles were Viar, making Viar drivers our largest user group).

How did we get there?

This is a project that involves a complex interplay of software and hardware technologies. As a product designer, I needed to address a series of questions: How does the Viar battery station work? What distinguishes Viar from Kymco? How does the software provide the Viar battery station experience? How can we ensure a smooth user experience across software and hardware? What can we learn from Kymco’s approach? And is the design flexible and easily adaptable to accommodate potential new vehicles and battery cabinets in the future?

Understanding hardware is the first step

First, we conducted a workshop to learn hardware characteristics and limitations and collected different idea.

What is a Battery Cabinet?

Viar battery cabinets can store and charge batteries.

Kymco Battery Cabinet vs Viar Battery Cabinet

The most significant difference between Viar and Kymco is the screen and charging methods. This is a design challenge.

What is a Battery Station?

We deploy battery stations in areas where drivers frequently pass through, such as restaurants, shopping malls, and parking lots, to reduce the driver time to get batteries.

How to get the battery?

The Viar battery cabinet offers 3 interaction methods, our strategy is choosing the swap method: returning the old battery, then get the new one. It’s based on a comprehensive assessment of the team’s vehicle and battery maintenance systems, software and hardware technologies, and business stages.

What we learn from Kymco?

We did user research on Kymco’s battery swap service as well:

  • It’s not easy to get battery cabinet information for drivers, especially the address and price. This made them more likely to give up.
  • Kymco drivers like user guide. Battery service is new to drivers, the guide is helpful for them to complete self-service battery swaps.

Kymco MVP Problem

The entry point does not follow driver mental model or expectations. The entry point is a static map image without any useful information, and it couldn’t be interacted with like a real map.

The bottom panel for the map page is not intuitive.

The map page shares the same bottom panel with the “My Vehicles” page. However, in the context of battery swaps, 80% of the options are redundant and couldn’t provide an intuitive user experience.

It is not a good structure to display battery station information.

Drivers have to go through 3 pages to view battery station information, particularly location and pricing. This is a barrier to drivers.

Core Design Principles

After a series of deep dives, we set three core design principles to help us focus on what mattered most.

Simplicity: Design user-friendly products within the framework of software and hardware technologies.

Consistency: Ensure consistency with the Grab Driver App’s design system and provide a relatively consistent experience across different devices.

Discoverability: Provide the right information, recommendations, and features at the right time, making battery service easy to explore and use.

Define Our Hypothesis

We set up various types of assumptions to help us figure out what we wanted and which approach is most suitable.

Viar’s two types of battery cabinets: the 8-slot cabinet with a screen and the 4-slot cabinet without a screen. The team had differing opinions on the interaction of software and hardware. As a designer, I quickly created several concepts to help the team confirm the direction.

Based on considerations of success rate, duration, scalability, and technical cost, we decided on the MVP approach: the Driver App features include tracking battery, finding battery stations, and scanning cabinet QR code, while the actual battery swap process would take place entirely at the cabinet.

Building on this direction, we conducted explorations on different levels.

Iterative Prototyping & Ongoing User Research

At the same time, we received feedback and optimized the design.

Internal feedback came from Electric’s hardware and software teams, cross-team stakeholders, designers, and the Grab Design Camp Review.

User feedback came from Viar driver-users. We recruited 5 Viar driver-users in Jakarta for 1-on-1 interviews and usability testing. Our testing user segment: Viar drivers who had used Kymco’s battery cabinets and those who had not. Our goal was to test whether users could use the new concept and design to complete battery swaps.

After multiple rounds of feedback, testing, and adjustments, we completed the Viar MVP version. Subsequently, we conducted two months of software and hardware integration testing to ensure a smooth user experience.

We proceeded with a small-scale launch in Jakarta. Then we iterate based on feedback from drivers after the launch.

Core Experience

Smart Recommendations for Easier View Battery Station Information

Enhancements to the discoverability of battery stations mean that drivers no longer need to navigate through three steps to intuitively see available battery stations. Rich information includes the number of available batteries, distance, pricing, operating hours, navigation, assisting drivers in their decision-making. Of course, drivers can go to map page to explore more.

Enhance the driver’s sense of control of the battery range by providing the mileage information.

We designed the unified card components for display and dynamic recommendations of battery stations.

Simplified and Focused Map Experience

On the map page, drivers can flexibly compare multiple battery stations.

This is the simplified bottom action panel that removes redundancy and offers only the options drivers need, providing a more intuitive user experience.

This is a driver-friendly detail design for avoding vehicle theft. As 10% of the stations are located indoors or semi-indoors and some distance (approximately 30 meters) from the driver and their vehicle, the system auto-checks if the vehicle is locked. If the vehicle is locked, the system takes them directly to the scanning page. If the vehicle is unlocked, it offers a secondary confirmation for the driver:

Battery Swap Guide Experience

On their first use of the battery swap service, the guide helps drivers understand the process. They can also view it in the help centre.

The battery cabinet was a physical and intuitive touchpoint. Therefore, we created stickers that match the battery cabinet:

Transparent Battery Info & Price

In the case of the 8-slot cabinet, when driver scans the cabinet’s QR code with Driver App, they see transparent information about pricing, payment methods.

Getting Batteries Step by Step

After scanning, at the battery cabinet itself, the driver view step-by-step visual guide clearly.

Voice Experience

Viar 4-slot cabinets do not have screens, so we designed a step-by-step voice guide, concise and clear, delivered in a warm female voice. Below is the content of voice design:

Impact

Significant reduction in battery replacement time for Viar drivers: 5 hours → 3 minutes

Driver satisfaction with the battery cabinets: NPS 60+