web app
/SunPower
Self-qual survey
TIME
4 weeks
ROLE
ux/ui design
Team components
Design
1 Product designer
Development
1 Front-end developer
Management
1 Product manager
SEC.
/OVERVIEW
INTROduction
SunPower.com allows customers to fill up basic form online to generate leads for advisor to review and call to verify if their roofs are qualified for solar installation. The survey aims to gather essential information from potential customers without requiring a phone call, ensuring that the quality of the leads is confirmed through targeted questions.
The Challenge
Customers are eager to move forward with our solar services but often feel uncertain about how to start the process. They end up calling us with a lot of questions and, unfortunately, have to wait a long time on hold before someone can answer them.
On the other side of the line, our solar advisors are facing their own challenges. They are tasked with making hundreds of phone calls each day, asking and answering the same set of questions over and over again.
The goal
So, there’s an opportunity for us to make things easier for everyone. The solution is a questionnaire that will:
Guide potential customers through important details about going solar by asking them relevant questions.
Reduce the workload for our solar advisors by filtering quality leads, which will ultimately increase the conversion rate.
SEC.
/research
understand the struggles
We kicked off the project with a meeting that included the marketing team and the project manager (PM). At the same time, we conducted an observation session with the solar advisors to understand what key questions they consider when determining if a customer is “qualified” for solar installation.
*We are in the observe section with solar advisor to watching them making calls to ask and answer questions
We learned that a few factors are essential for qualification:
Ownership of the property
Roof type
Roof age
The house’s surrounding environment (e.g., trees, tall structures)
From the marketing and sales perspective, these factors were also important:
Why the customer is considering solar
Payment preferences
Moving forward with the request to make an appointment with a solar advisor
SEC.
/Design
Put elements together
Learning that our users can be any homeowner from various backgrounds, with different levels of experience using technology. Therefore, my design principles for this project are:
Make options easy to approach, combining images with text for clarity if it need
Allow users to review or correct their answers at any time
Clear on instructions
With the initial list of questions, I began creating templates for the questionnaire.
*Example of 3D site model generated by our initial automation system. Yellow highlights are the walk-ways, gray rectangles are solar panels. In the image, it is obvious that the 3D roof planes are mismatched
Single Choice Screen
I designed the process bar to show users how far along they are in completing the survey, providing a sense of progress and motivation.
Each question is presented as the main text and is written in clear, concise language, ensuring that the text does not exceed three lines for better readability.
To minimize scrolling, I limited the number of answer options to five or fewer. This keeps the interface clean and easy to navigate.
To reduce unnecessary clicks, the survey automatically moves to the next question 0.3 seconds after a user selects an option. This brief delay ensures that users can clearly see their selection, reducing the chance of errors.
What if their answers don't meet our expectations?
It's easy to assume that most of our visitors will be "qualified" for solar installation on their rooftops, but what if that is not case? To address this, I designed a screen for scenarios where solar installation may not be feasible—for example, if the household members are not the property owners.
When a customer is disqualified at this stage
Clearly explain the reason for disqualification: It's important to be transparent about why the user doesn't qualify. In this case, the message would be: "You are not the owner of the property."
Provide resources or guidance: We should never leave customers at a "dead end." Instead, we should offer helpful resources or suggestions on what they can do next—such as linking to information that explains their situation or encouraging them to contact us for further assistance.
Offer an exit option: To prevent users from feeling stuck on this screen, I included a "Back" button that allows them to correct their answer if they selected the wrong option by mistake.
SEC.
/prototyping
Prototype the flow
We held a session with the marketing team to carefully think through the sequence of questions and streamline any answer sets with more than five options. After the meeting, I assembled the self-qualification survey into a prototype, giving a real-world sense of interaction with the screens. The prototype showcases:
The complete user flow, including how to access the survey
Each screen with a 0.3-second delay for clarity
Pages where users need to input specific information
Self-qualification questionnaire Prototype
Look into the future
After this stage, we will conduct several rounds of internal testing with the marketing team to evaluate the flow and questions within the prototype, ensuring everything is intuitive, accurate, and aligned with our goal .
SEC.
/Learnings
Lessons Learned
This was my first time designing a survey, and I initially thought that the questions themselves were the most important aspect. However, through collaboration with the marketing team, I learned that it's equally important to focus on what the customer gains from answering these questions. By clearly explaining the value behind each question, we can better engage users and encourage them to complete the form.
