Jacob Di Domenico
Rethinking myEnergy Rewards
In the midst of Ontario's energy saving push, Hydro One's myEnergy Rewards program wasn't connecting with users. The goal was simple: get more Ontarians enrolled. I led the landing page redesign using UX research, content strategy, and focused interaction design to improve clarity and drive more sign-ups.
UX strategy, UI design, web development, prototyping
UX designer, UX developer
Figma, Wrike, Visual Studio Code, Microsoft Sharepoint, HTML, CSS, Javascript
2 months July 2024- August 2024
Intro
Hydro One's myEnergy Rewards program encourages Ontarians to reduce their energy use, but the original landing page was falling short. Cluttered content, unclear messaging, and an outdated layout were preventing users from enrolling.
Our team was tasked with bringing the redesign in-house and applying user-centered design principles to improve performance. The goal was to create a clean and intuitive landing page that clearly communicates the program's benefits and motivates users to take action.
This case study walks through the entire process, from early research and competitor analysis to design exploration and final launch, showing how thoughtful UX can drive real results.
Goal
Our main objective was to design a landing page that not only looks good but converts. The new page needed to follow proven marketing principles while solving usability issues and making the enrollment process feel easy and intuitive. By balancing a professional tone with a more human-centered design, we aimed to build trust and increase sign-ups for Hydro One's myEnergy Rewards program.
Research
Before initiating the design process, we conducted extensive research to understand user behavior. Insights from heatmaps showed areas where users frequently dropped off, while user interviews revealed confusion about program benefits and enrollment processes. These findings informed key design decisions.
Energy Auctions
Strengths
Weaknesses
Opportunities
GridPoint
Strengths
Weaknesses
Opportunities
Every effective hero section should include three key elements: concise and scannable verbiage that clearly explains what is happening, a clear call to action such as “Click me,” “Schedule now,” or “Make it happen,” and relevant imagery or video that visually communicates the product or service being offered.
No need to have this section anymore as we are bringing the page inhouse and our navigation will be used.
The “Stay Cool and Win” section could be clearer and more engaging. Emphasize that the contest is exclusive to existing myEnergy Rewards members, highlighting that members can win up to $3,000 just for participating. Right now, it's unclear who qualifies or what the contest involves. Add a stronger callout and include a secondary CTA like “Enroll in myEnergy Rewards” to encourage new sign-ups by showcasing the added value of ongoing membership.
Add social proof on the page (A guide section). We can take the quotes from participants already enrolled into the program. It will really help add legitimacy to the landing page and trust for users.
Add a “negative stakes” section below the hero to show what users risk by not enrolling. Highlight the pain points and position the program as the easy solution.
To ensure the new page followed proven conversion strategies, we created an internal "Optimal Landing Page" reference based on UX best practices. It covered the ideal content sections for a landing page. This guide became a foundation for wireframing and helped align stakeholders on what “good” looked like.
Before diving into high fidelity visuals, typeframing offers a focused way to design with intention. It's a low fidelity layout that uses real content, accurate spacing, and proper structure, just without the final polish of colors, imagery, and branding. By stripping the design down to its essentials, stakeholders are encouraged to evaluate what really matters: the hierarchy of information, the clarity of messaging, and the overall user flow. This approach leads to faster alignment, fewer revisions, and a stronger foundation when moving into high fidelity design.
Design considerations
Guided by our research and the optimal landing page framework, we focused on removing friction, guiding users, and reinforcing trust. Every design decision was intentional, rooted in user behavior, best practices, and Hydro One's brand values.
Black 400
#242424
Black 500
#424242
White 100
#ffffff
White 200
#e2e2e2
Teal 400
#005866
Teal 500
#1A6976
Teal 550
#257F8B
Vibrant Teal 400
#77E9C6
Mint 100
#DDF0EA
Mint 150
#CEE1DB
The choice of typography on websites plays a crucial role in establishing a modern, readable aesthetic that enhances user experience. With versatile styles and web-optimized designs, well-chosen typography ensures clarity, accessibility, and a cohesive brand identity, fostering trust and engagement with users.
Hydro One's use of the Roobert font on their contact page embodies a modern, clean aesthetic that enhances readability and user experience. With its versatile styles and web-optimized design, Roobert ensures a cohesive and accessible interface, reflecting Hydro One's commitment to clarity and professionalism in digital communication.
Heading one - Roobert bold
Heading two - Roobert semi-bold
Heading three - Roobert semi-bold
Heading four - Roobert semi-bold
Heading five - Roobert semi-bold
Heading six - Roobert semi-bold
Body copy - Lorem ipsum dolor sit amet consectetur adipisicing elit. Quae, harum.
The launch
With the design finalized, I shifted into development, bringing the landing page to life using HTML, CSS, and JavaScript. This end-to-end process allowed for a seamless transition from vision to execution, ensuring every detail from layout to interactions was implemented with precision.
Building the page myself meant I could rapidly test, iterate, and refine on the fly, optimizing for performance, accessibility, and responsiveness across devices. I also ensured SEO best practices were in place before launch to support discoverability.
Once live, I monitored the page's behavior to make minor refinements and ensure everything performed as expected. The result was a polished, high-converting experience that aligned closely with both user needs and Hydro One's goals.
Impact
Following the launch, the redesigned landing page delivered meaningful improvements in both user engagement and program enrollment. Two of the project's key success metrics.
+25%
Enrollment rose from 24,000 to over 30,000 users in the months following the redesign, signaling that the new layout and messaging more effectively communicated the program's value.
3x
Average time on page jumped from under one minute to over three, indicating that visitors were spending more time engaging with the content and scrolling through the full story.
Jacob possesses a unique blend of creativity and pragmatism. This harmonious fusion of his design and development prowess consistently culminates in the timely delivery of exceptional outcomes.
Jason Somai
Digital Manager - Hydro One
Final thoughts
Redesigning the myEnergy Rewards landing page wasn't just about aesthetics. It was about understanding users, removing friction, and encouraging meaningful action. By combining UX best practices with thoughtful content flow and clean development, we built a landing page that resonates with users and delivers measurable results.