Smart Doorbell: art-directing ecobee's highest-profile launch
I was the lead product designer for the ecommerce experience on ecobee.com. I was involved from low-fidelity sketches, to ideating on the creative direction, to creating new reusable CMS components to modernize our web experience.
The Smart Doorbell Camera was ecobee's highest-profile hardware launch. Its product page had to introduce a brand-new category, earn trust fast, and feel unmistakably ecobee.
The page carried the whole story: expansive field of view, all-weather durability, smarter alerts, Smart Security, easy install, on-device privacy. My focus was the UI and art direction: how it looked, what the imagery said, and how it held together as something the team could keep building on.
The goals that shaped the work:
- Establish a visual language for a product category ecobee had never sold before.
- Direct a real photoshoot from low-fi storyboards, so the final photography matched the story the page needed to tell.
- Drive upsells, not just doorbell sales. Selling the doorbell was great, but the real goal was to push users toward bundles and a Smart Security subscription.
- Ship reusable CMS components (a new hero and a carousel gallery) the team could build and maintain with, not one-off sections.
This was a craft and art-direction problem as much as a layout one. The work moved from rough paper, to the look and feel, to a component system, looping back whenever the imagery or brand pushed back.
Low-fidelity sketches
I started on paper, sketching the page skeleton: the nav, the hero, and the order of the reasons-to-believe (field of view, reliability, smart alerts, install, privacy, sustainability). Fast, disposable wireframes to argue about flow and story before touching pixels.
Art direction & photoshoot
My ideation helped inform our creative design team. Working with them, we built out black-and-white storyboard mockups of each key moment (a package at the door, answering from anywhere, night vision) that doubled as the brief for the photoshoot and as artifacts we could put straight into usability testing.
Usability testing
Collaborating with our research team, we ran usability testing to inform the direction of the hero component, the bundle upsell placements, and overall confidence in the Smart Security copy.
CMS component design
I designed the high-fidelity page as reusable CMS components, including a new hero component and a new carousel gallery, so marketing could build and maintain this page (and future ones) without engineering every section by hand.
Low-fidelity work: mapping the page skeleton and the order of the reasons-to-believe on paper, before any pixels.
The launch shipped as a fully CMS-built product page on ecobee.com. The new hero, the carousel gallery, and the directed photography all assembled from the components.
I also designed ecobee's bundle pages. Upselling techniques (savings framing, clear "what's included" breakdowns, cross-sell of complementary devices) drove a 140% lift in purchases.
See them live: Total Security & Savings Bundle ↗ · Home Security Bundle ↗