top of page
hero-image_v1.jpg
income energy logo.png

Income Energy

Web Redesign x UX Design
A website proposal to improve the Income Energy online experience to get more quality website leads
iPhoneX_Mockup@2x.png
Summary

Income Energy is a solar energy startup established in 2018 after winning a Clean Energy Hackathon. In order to promote its concept, it built a one-page website, which had a very low conversion rate. With the assumption that their poorly designed website increases website bounce rate and has a negative impact on sales, we started the project with the following question: How might we let more customers book Income Energy's solar services?

My role

I was part of a group of two people in a sprint of three weeks and participated in the whole project, including researching, synthesis, generating the ideas, conducting usability tests and designing hi-fi prototypes.

 

With more details, I was mainly focused on: conducting the research plan, doing the interviews, analysing the collected data, creating the brand guideline, running the usability testing, paper prototype testing, creating high-fi mobile prototypes and more.

Results

This redesigned website comes with loads of benefits, which are proved by our usability tests:

  • Easily to access commercial solar and company information;

  • Reduced customers' learning curve;

  • Provide quick information to help customers make a purchasing decision;

  • A responsive & mobile-friendly interface;

Design Process
Income energy _ design process.png

Current Website

Contextual Inquiry |  Client interview

Lacking needed information for users to book the services

First, we clarified the key issues of the current website with users' pain points. In order to understand their experience, we asked testers to do a few tasks and observed their behaviours. We had some key findings, as followed:

​

  • The website asked for user’s personal information

       without establishing trust first;

  • Not enough information presented on the website

       presented (less commercial solar information);

  • The hero image does not fit the theme;

  • Inconsistent design system (i.e. colour scheme,logo);

INCOME ENERGY Prenstentation (1).jpg

Not targetting any specific group of people

The result of the client interview was that client had difficulties in determining its' target audience and understanding end-users’ needs. In order to solve this problem, we assisted Income Energy to define the key users based on its’ business development, including making a few cold calling interviews with some potential end-users, sending out some questionnaires and more.

"I can't find anything from Income Energy's website ..."

Users Interview | Survey 

At the same time, we interviewed eight people who worked closely with commercial landlords, to understand their attitudes towards solar energy and what/who is the Influencer in the decision-making process. All the results were collected and analysed

as a reference for further website development.

poster presentation of p5-06.png

Interviewees breakdown

findings.jpg

Interview findings

quote.png

Quotes

quote – 1.png

Survey structure

Persona

Persona

The three customer types are: 

​

  • Commercial landlords (primary)

  • Tenants (secondary) 

  • Professional advisors (secondary)

​

It is also necessary to understand the relationship between those three customers and their attitudes toward commercial solar investment. Therefore, we can prioritize features and contents to provide solutions to meet and satisfy their needs. 


Based on the findings and information we collected, we generated three personas: Greg, Gloria and Sarah. Greg is a commercial landlord who cares most about the financial benefits of the commercial solar installation. Sarah rented a commercial property and would like to recommend her landlord to invest commercial solar if she can easily convince the landlord. More likely, reducing her energy bills is the most key motivation for her to have a commercial solar PV system. Gloria is a real estate agent and loves to promote commercial solar service if her clients could benefit from it.

persona_three.png
Persona_commercial landlord.png
Persona_tenants.png
Persona_professional.jpg

Personas - Greg, Sarah & Gloria

Ideation and prioritization

Competitor Analysis | Customer Journey | User Flow | Value Proposition | Feature Prioritization (MSCW)

Besides all the previous research, we analyzed some main competitive websites.  After collecting all the data, we created a draft of the content and feature lists, which are listed in order of priority. We used these lists to identify opportunities in order to create our website category, develop and validate all the client’s businesses ideas / concepts. In the end, we would like to use this website as a tool to let users understand Income Energy's solar PV system and its benefits. 

content matrix.jpg

Content Ideas - Competitor analysis

feature matrix.jpg

Feature Ideas - Competitor analysis

Content idea.png

Content Ideas - Prioritized

feature priorisation.png

Feature Ideas - Prioritized

Findings

info.png

Lack of motivation - Information required

One of the users’ pains we find during the research is that users need to know more related information, which has not been presented on the current website. They need to know the reasons why they need to invest in Income Energy's commercial solar services. 

Observation

Users need different data and knowledge of the commercial solar investment during different stage of decision-making process.

customer journey map_c la.jpg

Solution

  • Provide the information as much as users need

  • Add a Call-to-action button for requesting more info

  • Add a Search bar/buttons, which needs to be visible on the header;

  • Company contact details need to present clearly on the footer and on the "contact us" subpage

user1.png

Missing the target audience -  Know the audiences & Meet their needs  

Having different perspective views, each type of customers has their own needs.  From our research, users don't want to spend long hours reading every word on this type of website. They need a quick and clear picture about the Commercial solar investment and those services Income Energy can offer. 

Observation

If you are going to invest, what information would you like to know before you invest in solar power?

information needed_ie.jpg

Landlords

Tenant

Professional Advisor

Solution

  • Structure the website, making all users easy access to information they needed

  • Recommend different commercial solar plans based on the users' unique requirements and budgets 

  • Have a Solar Calculator on the website, indicating the upfront cost and long-term savings

Final .png
quest.png

Poorly designed website scared customers away

"75% of users admit to making judgments about a company’s credibility based on their website’s design" 

Resource: web credibility research from Stanford

Observation

During our testing, Most users felt confused that they are too many design styles and typographic on the current website. e.g. icons, images, font etc. Thus, they complained about the poor and inconsistence design, which is lower the credibility of the business.

Solution

  • Create a visual style guide for the website to see all visual styles, such as headers, buttons, colour pallets and more

Solutions

Competitor Analysis | Customer Journey | User Flow | Value Proposition | Feature Prioritization (MSCW)

Sketching

Started with the paper prototype, we ran a few usability tests, checking out website structure, user flows, design elements and more. Based on the findings, we made a few changes and created two high-fi prototypes for both desktop and mobile site.  

incomeenergy_paper prototype.png

Website Structure 

Moodboard & Style Guide

We found couples of inspiration images and used them to create a moodboard. Based on that, we generated a style guide to ensure a consistent feel look, feel and tone across the whole new website. 

Moodboard.png

Moodboard - Inspiration

Colour pallette & type_v1.jpg

Style guide - branding

Information architecture

According to the test results of two drafts, we made a website structure diagrams for the new website.

IA.png

User interface design

Thus, we collaborated and generated a hi-fi prototype for both mobile and desktop devices, tested, iterate and made the final version in the shortest time.  As a responsive site, it contains the same content and functionality for mobile and desktop. Therefore, I am using the mobile interface as an example here.

mockup_income-energy_2.png
mockup_income-energy_1.png
hifi_income energy_1.png
hifi_income energy_2.png
hifi_income energy_3.png
hifi_income energy_4.png
hifi_income energy_5.png

Copyright © 2023 by Claudia Zhang

bottom of page