Background
An EV charging platform owned by MTR Lab, a wholly-owned subsidiary of MTR Corporation Limited, focuses on creating strategic value through investments in technology and formulating innovative solutions that support the long-term growth of communities.
Jove's highest priority is to become the central hub for EV chargers from various providers in Hong Kong, thereby achieving extensive market coverage. In the long term, our vision is to streamline the entire parking experience by integrating EV charging with the existing smart parking projects, moving further towards smart mobility.
Target user
The Jove Charging Platform is designed to cater to various target groups, primarily segmented by venue type:
Commercial Buildings: Here, users are typically tenants or white-collar workers. These individuals might prefer AC charging options and are likely to spend more time charging their vehicles as they work.
Shopping Malls: Users at these locations may include those needing urgent EV charging or casual shoppers who can afford to wait a few hours while they shop.
Monthly Parking Space: Renters might opt for private EV chargers, providing them with convenience and dedicated charging solutions.
For each of these user groups, our product and business teams have tailored specific features and business plans to meet their distinct needs effectively.
My Role
1. Conduct market and user research, and participate in product feature planning
2. In charge for the UI development and product architecture
3. Provide overall visual suggestion/direction and visual assets such as illustrations and animations
4. Maintain design library
5. Key person for offline experience material like backdrop, decoration, user guide, etc
6. Vendor management
Research
We apply different research methods corresponding to various purposes and project stages. Here are some examples:
1. Questionnaire
We distributed a questionnaire to EV-related groups on social media before launching the product. The purpose was twofold: first, to understand the impact landscape regarding charging concerns, including where users charge, how much they are willing to pay, what applications or charging services they use, etc. Second, it served as a preliminary screening tool to identify potential candidates for further interviews.
2. Guerrilla interview and shadowering
We conduct user interviews and shadowing primarily at charging stations. This allows us to observe how users interact with the app to operate the charger and to ask them about their decision-making process in choosing a charging spot, pain points, activities during charging, and to gather product feedback. Below is a small amendment we've made after observing how users conduct the charging process, 99% of them would plug the connector first.
Before
In the first version, we suggest the user connect/ plug the connector cable to their vehicle after pairing the app and the EV charger, which violates most user behaviors.
After
We found that 99% of users connect/plug the connector immediately after parking their vehicle at the charging spot, instead of taking out their phone and launching the app. To align with actual user behavior and avoid any misunderstandings, we have made a slight change to the copywriting: instead of asking users to connect, we now suggest that they ensure the connection is built.
3. User feedback form
Customer Satisfaction (CSAT) is a key metric used to measure customer satisfaction with our charging services. We employ Typeform to collect CSAT and user feedback post-charging. Additionally, this helps us identify user concerns and feature suggestions. Most importantly, by asking users what they believe was done best or worst, we can pinpoint pain points with precision. Currently, the most significant issue is charger performance and reliability.
We embedded a CSAT form after the user completes their core task on the app, namely, EV charging.
For the EV charging experience, we received an average CSAT score of 4 out of 5. Upon analyzing the open-ended feedback, charger reliability emerged as the most critical factor among all.
Design
1. Foundation & Architecture
Jove isn't just a one-off website, it's a long-term utility application built from the ground up with scalability in mind. Significant effort was dedicated early on to establish its foundation, encompassing component modularization, structuring page hierarchy, and defining navigation. This groundwork has led to a cohesive visual language.
2. Visual Language
While working on the architecture, another foundation is the visual aspect. By creating primitive visual elements, we have created fundamental UI components that are designed for scalability,make up 99% of the existing pages.
As for the business expenses, we need to 'white label' the Jove app for our business partner. Figma's variables provide me with the convenience of switching between themes and brands, as well as i18n necessities.
3. UI Development
When a new feature idea or business requirement is generated, the design process almost immediately starts on paper with a very low-fi wireframe for quick concept visualization. Typically, we hold a casual meeting to collect feedback from the rest of the team.
Map View, Lo-Fi ver.
Map View, Hi-Fi ver.
When we begin crafting the high-fi mockup, components from the design library are reused, as we aim to minimize the need for creating new components. Normally, prototypes with various options are provided, each with their pros and cons. During sprint planning, the entire team decides on the final version, which then serves as the reference for developers when the new sprint starts. Below is an example of a different UI approach for the EV charging reservation function.
Charging Reservation - Approach 1
Similar to a scheduling app, this method allows the user to select a range of time slots. It involves complicated interactions where the user must drag the time range on a scrollable list. Secondly, users might need to scroll extensively to find a later time range. Thirdly, this UI does not support cross-day scenarios.
Charging Reservation - Approach 2 ✅
It adopts a simple and straightforward method; the user selects the starting time and specifies the duration. The UI layout enables the user to more easily reach the desired time slot, and the development cost is significantly lower than that of Approach 1, making it the final choice.
Offline Experience
One thing that is really special to me is not only supporting the digital experience but also the offline aspects. For example, I am responsible for the charging station backdrop, signage, floor coating, stickers, and user guidelines. This role gives me the opportunity to learn about printing, coordination, procurement process and vendor management.
Example of preparing a backdrop for one of the EV charging venues: I measured the size myself, designed the backdrop graphic, coordinated with the printing agency and procurement department, and monitored the agency and workers during production and installation.