Sunscanner

A tool to help potential customers estimate how much money installing Optivolt's shade-tolerant solar panels would cost and save them

OVERVIEW

Role

Co-lead designer; Market Research, Interaction Flow, Wireframing, Component Design, General UX/UI Design

Duration

August 2023

Team

Myself, my creative director, and an assistant designer

THE CHALLENGE

I was tasked with designing a user-friendly tool that would help customers navigate the information, decisions, and finances involved in installing a shade-tolerant solar panel system on their homes. This included educating customers on the issue of shade on traditional solar panels' power output, how this affects their electric bill savings when choosing what type of solar panels to install, choosing the number of panels to install, whether or not to include a battery in their solar panel system, and the cost breakdown of solar installation.

Our Answer

My team and I decided to design a residential page that educates potential customers on the shading problem faced by traditional solar panels, and this page would lead to a five-step tool that breaks down the different factors that go into installing a solar panel system onto a home. The main goal of this tool was to capture potential customers prior to officially  launching residential solar panel installations.
Here's our process.

OUTLINING THE USER FLOW

I conducted market research and analysis on similar tools and interfaces from other industry competitors. Then, I outlined the base user flow and detailed the functions of each step in the estimator tool.

THE DESIGN PROCESS

Then, I designed the Residential Page and the estimator tool (named Sunscanner) to fulfill the required functionality.

Residenal Page

Landing screen shows a Call-To-Action to the estimator tool

Images showing examples of shading conditions
‍
Visualizations to demonstrate the advantages Optivolt's shade tolerant solar panel have over traditional solar panels

A timeline to indicate the expected timeframe for residential solar installations

Educational information about financial incentives offered by tax programs

Sunscanner

5 distinct steps to simplify the process, with process shown by the colored circle around each step number

Home Details: Enter street address and electric bill of residence

Shade Rating: Use the overhead view of residence and provided context to determine and input level of shading with the slider

Solar System: This is the size of the system (number of solar panels) recommended based on the electric bill and shade rating. The user may choose to change the system size if they anticipate changes in household electricity usage in the future

Battery System: The user should indicate the number of backup batteries they would like to include in their system, based on the number of hours of electricity they want to keep a reservation of

Cost Estimate: a breakdown of the estimated costs associated with installing the solar panel system they've selected, with cash and loan options to compare. The user can email these results to themselves for future reference

The main Call-To-Action is placing a reservation for an Optivolt Home installation, which will direct them to the checkout page of the Purchase Flow

THE RE-DESIGN PROCESS

During the complete website overhaul design process, I also needed to redesign the overall look of Sunscanner to match the new design language. I also redesigned the user interface of the tool to be contained in a modal to make the tool feel less overwhelming for older users.

Residenal Page

An overall friendly and welcoming design language to appeal to homeowners

Landing screen shows a Call-To-Action to the estimator tool

A summary of Optivolt solar panel value props
‍
Educational information about financial incentives offered by tax programs
‍
Carousel of Youtubers' demos of Optivolt panels' she tolerance
‍
A timeline to indicate the expected timeframe for residential solar installations

Another Call-To-Action to the estimator tool to show at the bottom of the page

Estimator Tool

Sunscanner was redesigned to be a pop-up modal from the residential page

Each stepwise separated to make the tool feel simpler to use for older customers

The custom size input for solar system became more obvious as some customers said it was easy to miss
NEXT PROJECT
BACK TO PROJECTS LIST
back to top