Roku TV — Strategic Landing Page Redesign

Led a concept redesign of the Roku TV landing page to improve clarity and conversion, addressing UX gaps identified through audit and competitor benchmarking. The project encompassed UX strategy, interaction design, and polished visual prototypes that aligned with Roku’s evolving brand standards. The new layout emphasizes product discovery, guided exploration, and clearer call-to-action paths — creating a more engaging experience across mobile and desktop. These changes were projected to improve visitor engagement and buy-in for Roku’s expanding smart TV lineup.

Before

Notes: Before initiating the redesign, I conducted a focused UX audit to identify friction across hierarchy, conversion flow, and content density. The hero lacked a clear focal point and strong CTA prioritization, with navigation competing for attention. Product category cards showed inconsistent hierarchy and redundant action patterns, while the partner grid created unnecessary visual density without clear prioritization. Feature sections missed opportunities for progressive disclosure and interactive feedback, and the FAQ presented dense static content that increased cognitive load. These findings informed a redesign centered on clarity, scalability, engagement, and stronger conversion emphasis.

After

The redesign focused on clarifying hierarchy, reducing cognitive friction, and strengthening conversion signals while maintaining Roku’s brand language. I rebalanced the hero to create a clear focal point and stronger CTA prominence, standardized product card hierarchy to improve scannability, and condensed the partner grid to reduce visual density. A centralized promotional video was introduced to create a narrative midpoint in the page flow, while feature cards were refined with clearer copy structure and subtle micro-interactions to increase engagement. The FAQ was converted into accordion-based progressive disclosure to minimize cognitive load and maintain a clean, lightweight layout.


The redesigned desktop experience prioritizes visual hierarchy, structured content flow, and stronger conversion emphasis while maintaining brand consistency across sections.

Full interactive prototype available in Figma → Prototype link


The layout was designed mobile-first, prioritizing progressive disclosure and simplified hierarchy to reduce cognitive load on smaller screens.

Three smartphone screens displaying Roku app interface, showing options for Roku smart TVs, partner brands, and a promotional image of a Roku TV in a living room.

The Business Problem

As Roku expanded its TV lineup across Plus, Pro, and Select series within an increasingly competitive smart TV market, the landing experience needed to better differentiate product tiers, clarify value propositions, and guide users toward confident purchase decisions. The redesign focused on strengthening hierarchy, improving feature discoverability, and creating a clearer conversion pathway aligned with business growth.


My Role

Led end-to-end redesign concept including competitive analysis, UX audit, and information architecture refinement. Defined interaction patterns and high-fidelity prototypes while aligning visual execution with Roku’s brand system. Presented strategic rationale and design iterations to stakeholders for feedback and refinement.


Strategy & Research

I conducted a structured audit of the existing experience to identify hierarchy breakdowns, weak conversion signals, and inconsistencies in product differentiation. From there, I mapped primary user intents — learning features, comparing models, and moving toward purchase — and restructured the information architecture to better support decision progression. Interaction patterns were intentionally subtle, reinforcing clarity and flow without adding unnecessary cognitive load.


Execution Highlights

Info Architecture

  • Reorganized hero to clearly communicate value

  • Introduced progressive disclosure to reduce cognitive load

Interaction Enhancements

  • Added subtle motion to draw attention to key CTAs

  • States and transitions that improve comprehension

Alignment to Brand

  • Chrome, typography, and visual rhythm aligned with Roku guidelines


Interaction & Micro-Interactions

I introduced subtle hover states to reinforce affordance and improve scalability across product cards. Motion timing was kept minimal to align with Roku’s restrained brand tone and avoid distraction.


Impact

Based on prototype testing, the redesigned homepage increased CTA prominence and predicted engagement by 15–30% — based on heuristic review and benchmarking against competitor landing pages.

Learnings & Tradeoffs

I chose to simplify the navigation to focus on primary tasks — discovery and product comparison — even though deeper informational content was tempting. This choice prioritized business goals and user intent.