Users loved the functionality, but wouldn’t mind entering it manually.
Client / Project: Sun Impact. Ironhack Miami | Capstone Project.
My role: I was responsible for the idea concept, validation via user research, execution of the design, and usability testings.
Problem: Solar energy popularity is rapidly growing in the US. However, it's still the least used among the renewable resources. The main goal of this project was to understand people's concerns regarding solar energy to make it more accessible and desirable.
​
Solution: A responsive website with a pleasant and easy process to learn about solar energy and choose a vendor.
-
All users naturally chose the ‘Upload picture > Take a picture’ flow in the first scenario
-
The technology has to work well not to cause any frustration
-
The feature would increase retention, and make them use it more often
-
The time spent during the manual was only slightly higher than the automatic picture flow
The Problem
During college, I took some classes on solar energy and renewable sources in general. I’ve always been a huge fan of green energy since it allows us to use the earth's resources in a more technological, smart, and responsible way. So for my capstone project, I wanted to do something related to this field.
​
Living in Florida, the sunshine state, I thought I would see more users of solar energy. However, it’s not so common to find houses that use this energy source, and when talking to people I noticed they had little information about the topic.
​
Solar energy is, indeed, the most growing source of energy in the US and the technology and research around this field have increased exponentially in the last decades, especially regarding solar panels: it has become cheaper, more efficient and durable. However, only 2.3% of all energy used in the country comes from solar resources, according to the US Energy information Admnistration's data.
​
My goal with this project is to make solar energy more popular and educate potential users about renewable sources.
The Research
Before I started thinking about solutions, I had to understand the users' needs and pain points.
I first did a survey and, with the results I got I noticed that most people care about the environment and had thought about solar panels at some point, but they needed more references and information.
88%
“Renewable energy is very important.”
80%
"I would like to know more about the topic."
SURVEYS
52 Answers
82%
" I want professional and personal references before buying."
INTERVIEWS
5 Potential Users
1 Expert
With interviews, I was able to get better insights and get to the bottom of the problem. From the 5 potential users I interviewed, all of them at some point told me they weren’t sure if they’d buy solar panels. The reason for that is that they didn't know if they could trust the seller, or they didn't feel safe and comfortable with the idea in general.
I also talked to an expert in the matter who works for a roof construction company in South Florida.
"To make it more popular you have to spread the word"
- Solar Panels Expert
"I have a friend that wanted to buy it but the sellers were acting weird"
- Potential user
"I have plans to buy panels for my house but I think it's too expensive and I haven't made any research"
- Potential buyer
From the demographics and the particularities of all the people I interviewed, I created the user persona Good Gavin, a responsible married man with kids, that loves technology and cares about the planet, and from now on, I'll be designing the website for him.
The user journey displays what a common day in Gavin’s life would be. As a busy adult that works on the computer all day, when he first sees the website he is not able to spend a lot of time in it to complete the estimation process. From this situation, I came up with the solution of adding the “create account” option. This would not only create convenience for the user but also increase the website’s conversion.
The Solution
First, I wanted to study the current websites in the market with the same purpose of educating about Solar Energy, so I did a Competitive analysis.
The most interesting ones I found are "Project Sunroof" from Google, and "Solar-Estimate".
This is a complete website, filled with good information and an easy way to estimate costs. Also shows incentives and explains about financing.
This website stands out for its functionality that uses Google Earth technology and shows the amount of sun or shadow each roof gets. However, it's poor in information if compared to others.
Both websites have a user-friendly way of estimating the cost and showing the benefits of solar energy. However, I noticed that none of those had the option to create an account in order to save the estimative the user did. Also, they don’t really “spread the word”, as there is no link to social media accounts.
All the User Research, User Persona, and competitive Analysis were crucial to me when coming to the final solutions for the website.
TO DEVELOP MORE TRUST AND COMFORT
-
Create Account
-
Seller Reviews
-
Community
​
TO EDUCATE THE USER
-
News and Information About Solar Energy
TO SPREAD THE WORD
-
Share On Social Media
Defining the Visuals
After the features were defined, I started doing Hand Sketches (low fidelity prototypes) since they are faster and easier to modify. After some usability testing with my colleagues, I proceeded to the wireframes using the software Sketch and adding them to InVision for prototyping.
In the quick video below I made a comparison of my sketches and wireframes so that you can see the progress between these two steps.
Before proceeding to high-fidelity wireframes I had to define the visuals of my website. I wanted the branding to feel inspiring and technological at the same time, with a clean and modern look. The moodboard contains beautiful images of sunset showing all the power and magnificence of the sun. Some images also show community and a balance between nature and technology. From that, I picked my color palette and fonts.
(Click to expand)
MOODBOARD
(Click to expand)
STYLE TILES
With the high-fidelity prototype done, I proceeded to more usability tests. The user flow was very simple and consisted of creating an account, making an estimative and asking for a seller’s quote. The final result you can see below.
DESIGNED TO ENTERTAIN AND CAPTURE THE USER’S ATTENTION, THE EARTH ANIMATION SHOWS THE SOLAR RADIATION AROUND THE WORLD. BELOW IT THE USERS WILL FIND MORE SOLAR FACTS REGARDING THE AREA THEY LIVE IN.
THE HOME PAGE WILL THEN GIVE INFORMATION ABOUT THE WEBSITE AND ITS GOALS. THE CALL TO JOIN THE COMMUNITY GIVES TRUST AND MAKES THE USER MORE CURIOUS. TO EDUCATE THE USERS, THERE’S A SESSION ON THE BOTTOM WHERE THE USER CAN HAVE ACCESS TO THE LATEST NEWS.
AFTER DOING THE ESTIMATIVE, THE USER WILL SEE NOT ONLY THE FINANCIAL BENEFITS BUT ALSO THE ENVIRONMENTAL ONES PROVENIENT OF INSTALING SOLAR PANELS.
TO SPREAD THE WORD THE USER CAN SHARE THOSE RESULTS ON HIS SOCIAL MEDIA, OR TO A SPECIFIC FRIEND VIA EMAIL.​
​
THE USER WILL EASILY FIND SELLERS IN HIS AREA, WITH ACCESS TO THEIR WEBSITE, PHONE NUMBER, AND GOOGLE REVIEWS. ALSO, TO CONTACT AND ASK FOR A QUOTE IS EASY AND JUST ONE CLICK AWAY.
Learnings and Next Steps
After I finished the last user testings I was so happy with all the positive feedback I got from this project since the users really felt inspired and more curious to learn about solar energy.
​
However, there are still many areas to improve. I want to continue working on the Sun Impact website, especially on the “Community” page, which for me is the key to making this website stand out from the others and improve the popularity of renewable sources by involving people in it. With a place where users can talk to real people and read their experiences, my goal is to give the user more comfort and trust during the process of buying solar panels.
Thanks!
