Responsive site on SaaS platform




As electric vehicles are popular, utilities have a limited window to position themselves as expert advisors, influence home charger selection, and encourage enrollment in demand response and TOU rate plans to encourage responsible charging behaviors and manage grid impact. 

The goal

To design a configurable platform with the information and tools to support a utility’s integrated EV program. It must offer a flexible suite of tools, including educational content, vehicle comparison, cost-of-ownership calculators, a level-two (240v) charger marketplace, public charger and EV dealer mapping, program and incentive eligibility and enrollment, and more.

Challenge and approach

The challenge at hand was to understand the specific requirements of the business. To accomplish this, I proactively gathered input from the product manager, marketing team, and VP of digital business. By collaborating closely with these stakeholders, I aimed to comprehensively understand their needs and objectives.

My plan involved designing the site across different platforms to create a responsive design that seamlessly adapts to various devices, such as desktops, tablets, and mobiles. Implementing a grid system would ensure consistency and optimal user experience across these platforms.

One notable challenge was effectively displaying the fuel-saving calculator with the correct information. I intended to work closely with stakeholders to address this, incorporating their expertise and insights. Additionally, I planned to conduct thorough user testing to gather valuable feedback. By incorporating the proper feedback into the design process, I aimed to create a user-friendly and intuitive experience for visitors to the EV responsive site.

My role

Customer Insights & Ideation

Partnered with a product manager and sales director to uncover insights and translate an idea into a concept.

Planning & Scope Definition

Defined the product with the product manager and sales director. Evangelized customer goals and balanced business goals. 

Oversight & Coordination

Collaborated with product managers, engineers, and sales team to translate product features to the wireframe. 

Design Execution & Validation

Designed the site from scratch with a newly developed internal style guide including a color system, typography, components, and more, along with executing design specs and wireframes. 

business requirements

For EV owners

Provides an experience to help them reduce costs of ownership by presenting information about Level 2 home chargers, along with charger rebate links to purchasing and other utility rate and demand response programs.

For EV Shoppers

Created an online experience for the user to easily navigate to see EV Benefits, Facts, Vehicle Comparison/Cost Calculator, and Find A Dealer, Find A Charging Station. Biggest benefit is to get them interested in EV and to then help them quickly choose an EV.

Who are the users?

Emily – An EV owner


Age: 32
Occupation: Marketing Manager
Education: Bachelor’s degree


  • Proud owner of an EV and drives it to work every day.
  • Has a charger installed in her garage and charges her EV overnight.
  • Interested in learning about new programs that can help her save money on electric bills.
  • Enjoys spending time researching and learning about EV technology and sustainability.
  • Values environmentally friendly solutions and is willing to make changes to reduce her carbon footprint.
  • Is tech-savvy and comfortable using online resources to find information and solutions.


  • Find new programs or incentives to save on electric bills.
  • Learn more about EV technology and sustainability.
  • Reduce her carbon footprint by using an electric vehicle.
  • Connect with other EV owners and enthusiasts to learn from their experiences.

Emma – An EV shopper

Close up portrait of curly female adult has charming smile, curly dark hair, wears big glasses, satisfied as finished domestic work earlier, being successful designer or architect, has talent

Age: 28
Occupation: Product manager
Education: Bachelor’s degree


  • Emma is interested in buying an EV
  • She wants to learn more about EVs and the cost of owning one
  • Emma is research-oriented and seeks out information before making a purchase
  • She is likely comparing different types and models of EVs before making a decision
  • Understand the costs associated with owning and operating an EV
  • Find out about government incentives and rebates for purchasing an EV
  • Determine if an EV would be a good fit for her lifestyle and driving needs


  • Emma’s goal is to own an EV.

User journey





EV calculator

The key selling point of the project was to motivate the client’s customers to contemplate the purchase of an electric vehicle (EV) by offering them a calculator. This calculator enables users to assess the expenses associated with owning an EV for a duration of 1 to 5 years.

Brainstorming ideas

Screenshot 2023-05-02 at 12.25.09 PM

User testing


Testing method

Audiences: 3 males, two females / A mix of EV owners and shoppers. 

Method: Online survey with heat map using UserZoom Task: Compare value and usage.

Some of the feedbacks

“What was missing from the summary page was the math. Show me for different numbers of years of ownership what the total net cost would be!” – an EV Owner

“I felt like there needed to be a clear separation between the two vehicles to show the differences between each from a specs standpoint such as miles per gallon and other specifications of each car. I felt organization of the page was missing” – an EV Shopper


Display calculator result with different years of ownership of cost to own EV. Compare up to 3 cars.

1.3.0 Compare vehicles
1.3.1 Compare vehicles calculator

EV owner main page

  • Introducing to incentives and programs.
  • Promotional space for buying a home charger.

EV shopper main page

  • EV Benefits & EV facts.
  • Compare vehicles – the cost of owning an EV.

Screenshot 2023-04-30 at 6.58.44 PM
Screenshot 2023-04-30 at 6.56.48 PM

All wireframe design

Screenshot 2023-04-30 at 7.13.45 PM

Mobile – Tablet – Desktop

Group 69

Design system

As our platform is built on a SaaS model, a centralized style guide facilitates quick and efficient customization and integration with clients’ specific style guidelines.

Screenshot 2023-04-30 at 10.36.37 PM

Visual Design




1.3.0 Compare vehicles
1.3.1 1 Year Cost of Ownership
Group 70