
SUNGEVITY SOLAR
REFERRAL CENTER
The Challenge
-
Provide customers with an easy way to share their excitement of being a solar homeowner and earn referral rewards.
-
Unlock a new channel for marketing to generate leads, drive customer engagement, loyalty and satisfaction.
I ran the UX/UI Design of this project for the referral center component of a seamless online solar experience.
The problem we were solving at this stage in the customer journey was that after a customer purchased a Sungevitiy solar system online they were extremely excited and proudful at having "gone solar" but they had no easy way to share their excitement with friends or family. We knew peer-to-peer referrals were a powerful, effective and genuine way to grow the business and Sungevity saw an opportunity to provide a simple and easy way to empower customers to "Share the Sunshine" by sharing a satellite image of their home with their chosen solar system design clearly visible on their roof, and sharing their referral code. In doing so, the referrer would earn a $ reward, and the referee would receive a $ discount towards the purchase of their own solar home system. Simple right?
​
Pain points:​
-
Outdated User Interface: Our customers were treated to a very dated v1.0 "Sunshine Online" experience that was fraught with complexity and an atrocious dated color scheme. The first version of this design had been designed had been undertaken by a contractor that took orders from visionaries who, with good intention, wanted everything to be easy and accessible and in 1 place, but which, in reality turned into a mess of elements fighting for attention, with content shoe-horned into every nook and cranny of the page. The result was complex and confusing. Rife with opportunity for simplification with a heavy focus on information hierarchy.
-
Referral Codes: Customers already had referral codes. but they were sent to them via email and often ended up lost and forgotten. When I started digging into this issue I uncovered the opportunity for another improvement project regarding the way we generated referral codes. (Previously they were generated using customers names and a series of alphanumerics. This would not scale so we devised a new referral code generation system which allowed us to painlessly scale.)
-
No easy way to share: Customers had no easy way to share their excitement throughout their experience of going solar.

Version 1.0 Referral Center was crammed into a module in the bottom left of the page.
This was the existing design that I was tasked with reimagining and redesigning.
Solution:
I executed the standard design thinking process, empathizing with our customer's pain points, and mapping those to our business process. I identified improvement opportunities for our internal processed and presented these ideas to the Project Manager and respective business units, in an effort to reduce customer pain.
I met with our Marketing team to understand the fine details about what customer referral activity they wanted to measure and what referral numbers they wanted to hit by quarter and drew out a customer flow and business flow and marketing goals on a big whiteboard that became our primary project space. Having everything in 1 place on 1 big whiteboard (and spillover notes, printouts, inspiration, and research documents pinned to the wall around it) gave me the ability to have scheduled and ad-hoc conversations and working sessions with those directly involved in the project, as well as random coworkers who stopped by to take a look and give their feedback (which yielded important insights that would have otherwise not been collected.)
​
Once I had enough research data I began to synthesize my findings into low-fidelity mockups to work through information hierarchy and explore component compositions on the page. I quickly moved from low to high-fidelity as I found there were too many leaps of the imagination with test subjects, and I had an inkling that designing mockups and looked and felt as close to the real thing as possible, even at the earlier stages in the design process, would yield better testing results. They did! :) After a few rounds of high fidelity prototype refinements, we were able to finalize the design phase and get our final designs over to development which had a slot for us in their development cycle. NOTE: this was early in Sungevity's business and development was not yet running on a formal sprint cycle and was not yet efficiently collaborating with design or the product manager.

In this dark age before Zeplin and InVision Inspect (which allows developers to inspect elements of a design, grab code snippets, and assets automatically) designs were hand-annotated.
​
Here I am defining css values for the develoment team.
​
Basic manual annotation of page elements and composition for our development team


Social Sharing: An exploration of how we might give customers a simple way to share interesting and prideful facts about their solar home.
Results:
I designed and saw through development and quality assurance our version 1.0 online referral center. Marketing had a new channel to generate referral business and customers now had easy access to their referral center with their referral code front and center, a pre-canned referral email template, and the ability to track all of their activity and earnings. Another proud day working at the sunniest company on earth :)
​
Referral Center Dashboard Final Designs

Invite friends to go solar
