EV Charging Boost: Enhancing EV Charging Through Streamlined Trip Planning and Booking

Rubin kumar
11 min readFeb 29, 2024

--

Introduction

In India’s rapidly expanding electric vehicle (EV) market, the shift towards sustainable transportation is undeniable. With EV sales projected to reach 30% of total vehicle sales by 2030, the need for efficient charging infrastructure is crucial to support this transition. Studies reveal that 60% of EV owners face driving challenges and 1 in 4 owners worry about station availability and charging. We aim to redefine EV charging for seamless journeys and highlight enhancements in the case study.

Problem Statement

EV riders embarking on long trips encounter challenges in finding suitable charging stations along their itinerary, resulting in charging delays that completely derail their trips.

By breaking down the main problem statement into these key sub-problems, we can gain deeper insights into the specific challenges faced by EV riders and ensure that our solution addresses each aspect effectively.

Subproblems:

  1. Manual trip planning: Users spend excessive time searching and planning EV trips manually, causing inconvenience and disruption.
  2. Charging time wastage: Users waste valuable time waiting for charging, leading to delays and frustration during their journeys.
  3. Difficulty in finding suitable stations: Users struggle to find charging stations tailored to their needs and itinerary, hindering their travel plans.
  4. Range anxiety: EV drivers experience anxiety when searching for stations with low charge levels, affecting their enjoyment during long trips.

Solution

In response to the identified problem statement, I developed a trip planning and booking slots functionality, which serves as the core offering of the application. This functionality is currently unavailable in existing EV charging applications.

It empowers users to plan their trips effectively, including all necessary charging stops. Users can select suitable charging stations based on charger capacity, price, Range of the vehicle, and availability, as well as nearby amenities, ensuring a seamless travel experience. By enabling users to book charging slots in advance according to their trip plan, they can conveniently charge their vehicles without having to wait at the charging station, allowing them to enjoy their journey without interruption.

It facilitates the identification of suitable charging stations within their itinerary, thereby enabling users to execute their trips seamlessly.

To achieve this solution, I embarked on thorough secondary research driven by curiosity to better understand the problem.

Secondary Research

For secondary research, I conducted an extensive analysis utilizing diverse online resources. Additionally, I gathered real-time insights from YouTube video reviews and user comments, providing a holistic understanding of the challenges encountered by real EV riders.

Insights From Research:

  • EV drivers often rely on assistance from passengers to locate charging stations while driving.
  • Charging challenges are more prevalent during long drives, in city drive users typically prefer home charging for convenience.
  • Users perceive waiting for charging as more time-consuming than the actual charging process, impacting their trip schedules.
  • Drivers frequently check their cluster display for charging status when they lack a predefined plan for their EV journey.
  • Trip plan revolves around the availability of charging stations, and influencing decisions on food breaks and rest stops.

Target Audience

The primary target audience for the EV charging app comprises Electric car owners who frequently embark on long drives, particularly those aged 25–45. This range is chosen because individuals within this age group are often early adopters of EV technology and are actively seeking solutions to optimize their driving experiences.

Primary Research

The findings from secondary research served as a catalyst for conducting primary research, specifically a survey, to further explore EV charging challenges faced on long trips.

Primary research insights

This multifaceted approach facilitated a comprehensive understanding of EV charging challenges, informing the development of our solution.

Competitive Analysis

To gain insights into the existing services provided in EV charging and understand the current state of EV charging applications, I initiated a competitive analysis. This involved examining the screens, user flow, user experience, available services, and features of various charging applications. Through this process, I aimed to comprehend the strengths and weaknesses of competitors’ offerings, thus identifying opportunities for improvement to design a superior app.

User Persona

This stage organizes analyzed data into an easily interpretable format using personas. A persona is a fictional character representing certain traits and qualities of real users, helping to understand and empathize with your target audience.

User persona

Task flow

I created a task flow to understand the flow of planning trips, adding stops, and booking slots at stations within the EV charging application.

Task flow

Wireframes

I sketched wireframes to understand the layout and structure of the interface, ensuring clarity and usability by guiding the placement of elements.

Hand and digital wireframes

Design System

I have developed a comprehensive design system that incorporates all the components utilized in this project, utilizing styles and variables to ensure consistency and uniformity across all aspects of the application.

Components and Properties

I developed a comprehensive design system, creating components and adding properties individually for all elements in UI design. This system comprised global atoms and local atoms, such as icons, titles, sliders, buttons, the charging pill, and the time picker component. These components were utilized to create molecules like search bars, input fields, connectors, and dialogs. Additionally, I designed organisms, or master components, including the bottom navigation bar, tab bar, card components, and trip planners.

Utilizing component properties such as boolean, instance swap, text, and variant, I tailored each element in the UI design to be easily customizable and adaptable to different parts of the application.

Example: The card component underwent customization and was employed across various screens, such as booking confirmation, booking cancelled, saved trips, saved stations, charging history, and notifications, with distinct states defined for each.

I created icon, button, card, and bottom sheet components manually
Navigation bar components
Other components used in this design system

By employing this modular approach, I facilitated faster design iterations, ensured consistency throughout the application, and enhanced user trust and understanding of the product.

Textstyles and Colors

I established a color library and defined text styles to further enhance customization and maintain consistency across the UI design.

The selection of colors such as Red for urgency, Blue for trust and reliability, and White for clarity and simplicity in the app’s UI aligns with color psychology, effectively conveying specific emotions and messages to users. This deliberate choice enhances user experience by fostering feelings of urgency, trustworthiness, and clarity, ultimately improving engagement and satisfaction with the app.

Variables and Styles

I utilized variables to define colors, spacing, and radius values while employing styles to maintain consistency in typography throughout the application.

Text styles and primitives

In building the design system for the EV charging app, I employed Figma variables within primitives to establish a global naming convention for colors, spacing, and radius values. Subsequently, I created variables categorized by surface, content, and border attributes, each assigned clear alias names tailored to specific use cases. This systematic approach ensures consistency and clarity in the app’s design, facilitating easier updates and modifications.

surface, content and border variables

Solution

In response to the identified problem statement, I developed a trip planning and booking slots functionality, which serves as the core offering of the application. This functionality is currently unavailable in existing EV charging applications.

Problem:1

Manual Trip Planning: Users spend excessive time searching and planning EV trips manually, causing inconvenience and disruption.

Trip Planning:

It empowers users to plan their entire trip effectively, including all necessary charging stops, saving valuable time and effort. now they can plan their entire journey without the need to navigate multiple apps or spend excessive time searching.

  • User inputs start and destination: The user provides their starting point and their destination.
  • Map displays trip route: The map displays the planned trip route from the starting point to the destination.
  • Maximum range circle: A circle is displayed on the map, representing the maximum range of the user’s vehicle based on its current charge level and energy efficiency.
  • Charging stations displayed: Charging stations that fall within the maximum range circle are highlighted on the map. it ensures the vehicle can reach the station without running out of power.
  • Efficient planning: With the trip route, maximum range circle, and charging station locations visible on the map, users can efficiently plan their journey. They can identify where they need to stop to recharge their vehicle within its range limitations.

Problem:2

Difficulty in Finding Suitable Stations: Users struggle to find charging stations tailored to their needs and itinerary, hindering their travel plans.

  • Users can select suitable charging stations based on charger capacity, price, Range of the vehicle, and availability, as well as nearby amenities, ensuring a seamless travel experience.
  • Upon receiving search results, users can access detailed station information or directly add a stop on the map interface.
  • Utilizing the filter section, users can refine station options and search for alternatives, allowing them to adjust plans according to their preferences.
  • After selecting stations, users receive a comprehensive trip plan, including charging stops, along with options to plan rest stops, dining choices, and activities based on provided amenities and details.
  • It facilitates the identification of suitable charging stations within their itinerary, thereby enabling users to execute their trips seamlessly.

Problem:3

Charging Time Wastage: Users waste valuable time waiting for charging, leading to delays and frustration during their journeys

Booking Slots:

  • By enabling users to book charging slots in advance according to their trip plan, they can conveniently charge their vehicles and enjoy their journey without interruption.
  • After planning their trip and selecting suitable stations, users can conveniently book slots for each station, choosing chargers, dates, and durations for booking.
  • Booked stations are listed in the booking section with easily identifiable details on cards, allowing users to manage their charging schedules and optimize their travel conveniently.

Problem:4

Range Anxiety: EV drivers experience anxiety when searching for stations with low charge levels, affecting their enjoyment during long trips.

Range Circle

  • To address the prevalent issue of range anxiety among EV drivers, I introduced a “Range Circle” feature.
  • Users are prompted to input their vehicle’s range when adding it to the app. The Range Circle then displays charging stations within the vehicle’s maximum range on the map, allowing users to filter and book stations more efficiently.
  • it ensures the vehicle can reach the station without running out of power.

When considering various scenarios, one particular situation came to mind: what if a user had booked a slot but another person was also waiting to use it?

This prompted me to devise a solution to inform the waiting user about the booked slot. To address this, I added booked slot details in the station details screen when searching and created a screen option for users attempting to charge at a station. This screen displays when the slot is booked, and users can see the waiting time until they can access the charging slot.

Additionally, the user who booked the slot has an arrival end time displayed, indicating when they must arrive to secure the slot. If they exceed this time, the slot becomes available for others waiting to use the charger.

Accessibility

Accessibility check using stark contrast checker

Potential Impacts

User satisfaction boost: Our integrated trip planning and booking feature enhances user satisfaction by providing a seamless and gratifying experience. Users can efficiently plan their trips, avoid lengthy waits at charging stations, and ultimately reduce the average time spent per trip for charging. This heightened satisfaction fosters a strong sense of trust and loyalty towards our application, potentially increasing the overall satisfaction of the app.

Time reduction: With the introduction of our integrated feature, users can significantly reduce the time spent planning their trips and booking charging slots. By eliminating the need for manual searching and providing a convenient way to incorporate charging stations into their routes, users can plan their trips more efficiently and effectively, resulting in a notable reduction in time on task.

Conversion improvement: Our streamlined trip planning and booking process potentially drives up user adoption and engagement with our application. By offering advanced trip planning capabilities and seamless booking functionality, users find it easier to fulfil all their EV charging needs through our service, potentially leading to increased revenue generation.

Retention enhancement: Our integrated feature enhances the long-term appeal of our application, as users consistently rely on it for trip planning and booking. By providing ongoing value and convenience throughout the user journey, the feature promotes continued usage and fosters user loyalty to our app, encouraging users to use it repeatedly.

Error reduction: The integrated trip planning and booking feature potentially minimizes errors by providing precise information on charging stations and their capabilities. Users can select suitable stations effectively, ensuring a seamless experience without errors in trip planning and booking. This reduction in errors contributes to a smoother overall user experience, potentially increasing user satisfaction and retention.

UI Screens

I designed over 60+ essential UI screens for this project, including the Splash Screen, Login Screen, Home Screen, Bookings Screen, Saved Trips and Stations Screen, Profile Section Screens, Filter Screen, Trip Planning Screens, Booking Slots Screens, Trip Plan Execution & Charging Screens, Direct Charging Flow Screens, Waiting Screen, and Lost Connection Screen.

Key Learnings

1. Learning design systems: I gained a better understanding of design elements like styles and variables. This helped me keep the design consistent and organized.

2. Using research wisely: I learned how important it is to listen to users. By studying their needs, I could make the app better suited to them.

3. Making wireframes: Drawing out rough sketches of the app layout helped me see how things should be organized. It was like making a map before starting a trip.

4. Dealing with limits: Sometimes, I had to work with limited time or space. This taught me to be creative and find smart solutions.

5. Always improving: I realized that making something great takes time. By always looking for ways to make things better, I kept moving forward.

6. Trusting my choices: As I worked, I became more confident in my design decisions. By continuously refining and improving based on research, I learned to trust my instincts and make informed choices.

Figma file for this project: Link

I hope you enjoyed reading about this EV journey! if you find it helpful, leave a clap👏

Feel free to share your feedback and thoughts in the comments or reach out to me directly on Instagram- Rubin.ux, LinkedIn- Rubinkumar, or via email at itsrubinkumar@gmail.com

Thank you 🙏

--

--

Rubin kumar

Product designer transitioned from fashion, solving user problems through iterative processes. Ready to work in UX industry with a solution-oriented approach.