Evolving the old feed experience to a modern vertical player
Evolving the old feed experience to a modern vertical player
Evolving the old feed experience to a modern vertical player
Project:
Evolving the old feed experience to a modern vertical player
COMPANY:
Dailymotion
ROLE:
Product designer
SCOPE:
Product design, consumer tech, Product development
TEAM:
Product manager, Ux researcher, devs, data team,QA
Timeline:
1 year ( 2022-2023)
Problem
When we started this work, Dailymotion’s mobile experience still behaved like a “classic video platform”: users scrolled a feed, tapped a video, then got redirected to a separate watch page to truly watch with full controls (a YouTube-like pattern). That flow created friction, diluted momentum, and made it difficult to build modern, session-based engagement. At the same time, the product ambition had shifted: Dailymotion wanted to become a more social, Gen-Z-oriented platform, which required a viewing experience that felt immediate, immersive, and designed for habitual consumption on mobile. The existing HTML5 (web) player on mobile also introduced performance pain—especially on the home feed—undermining the very thing we were trying to optimize: quick, seamless video starts and continuous watching.
When we started this work, Dailymotion’s mobile experience still behaved like a “classic video platform”: users scrolled a feed, tapped a video, then got redirected to a separate watch page to truly watch with full controls (a YouTube-like pattern). That flow created friction, diluted momentum, and made it difficult to build modern, session-based engagement. At the same time, the product ambition had shifted: Dailymotion wanted to become a more social, Gen-Z-oriented platform, which required a viewing experience that felt immediate, immersive, and designed for habitual consumption on mobile. The existing HTML5 (web) player on mobile also introduced performance pain—especially on the home feed—undermining the very thing we were trying to optimize: quick, seamless video starts and continuous watching.
Challenge
This was a multi-layered challenge because it blended product strategy, content constraints, technical architecture, and interaction design. We needed to evolve a large catalog of mostly landscape videos toward a vertical-first experience without breaking the viewing experience for non-vertical formats. We also had to replace a web-based player stack with a native one to solve loading and performance issues—while managing the short-term gaps that came with it (missing features like quality/speed controls, privacy/cookie management, plus business risks such as limited tracking and a temporarily reduced monetization stack). Finally, this was a long multi-year effort involving many stakeholders, so progress depended not only on good design, but on sequencing, advocacy, and breaking the vision into shippable “lego blocks” that could deliver value incrementally.
This was a multi-layered challenge because it blended product strategy, content constraints, technical architecture, and interaction design. We needed to evolve a large catalog of mostly landscape videos toward a vertical-first experience without breaking the viewing experience for non-vertical formats. We also had to replace a web-based player stack with a native one to solve loading and performance issues—while managing the short-term gaps that came with it (missing features like quality/speed controls, privacy/cookie management, plus business risks such as limited tracking and a temporarily reduced monetization stack). Finally, this was a long multi-year effort involving many stakeholders, so progress depended not only on good design, but on sequencing, advocacy, and breaking the vision into shippable “lego blocks” that could deliver value incrementally.
Design process
I co-led this initiative as part of a trio of senior designers, partnering closely with product and engineering over a little more than two years. We approached it as a system redesign rather than a one-off UI refresh: first validating the feasibility of moving to a native player through analysis and a proof of concept, then stress-testing options across good/medium/poor network conditions to ensure the solution worked beyond ideal Wi-Fi scenarios and was considerate of users in regions with unstable connectivity. In parallel, we iterated on the feed and card architecture through benchmarking, prototyping, and user testing to understand how different aspect ratios (16:9, 4:5, 1:1, full vertical) affected comprehension, immersion, and perceived quality. We also explored and refined interaction details—scroll transitions between videos, seek bar behaviors, loading and error states, and onboarding—because the success of an immersive feed depends heavily on micro-interactions and resilience during real-world usage.
I co-led this initiative as part of a trio of senior designers, partnering closely with product and engineering over a little more than two years. We approached it as a system redesign rather than a one-off UI refresh: first validating the feasibility of moving to a native player through analysis and a proof of concept, then stress-testing options across good/medium/poor network conditions to ensure the solution worked beyond ideal Wi-Fi scenarios and was considerate of users in regions with unstable connectivity. In parallel, we iterated on the feed and card architecture through benchmarking, prototyping, and user testing to understand how different aspect ratios (16:9, 4:5, 1:1, full vertical) affected comprehension, immersion, and perceived quality. We also explored and refined interaction details—scroll transitions between videos, seek bar behaviors, loading and error states, and onboarding—because the success of an immersive feed depends heavily on micro-interactions and resilience during real-world usage.
Solution
The solution was an end-to-end evolution of the home feed viewing experience toward a vertical, full-screen paradigm, enabled by a major technical transition and a progressive UI strategy. On the technical side, we replaced the HTML5 player with a native player on both iOS and Android, improving maintainability and performance while reducing CPU and memory usage and significantly improving loading times. On the experience side, we evolved the card format in steps: modernizing the UI (padding, corner radius), moving through intermediate ratios (including a 4:5 exploration), then landing on a more balanced 1:1 approach while creating the illusion of a taller container via metadata placement (channel name, follow) and consistent background treatment across platforms. As the design matured, we handled the complexity of mixed aspect ratios by preserving original video ratios rather than aggressive cropping, refined background strategies for non-vertical content, and fine-tuned scroll animations and player controls to create a cohesive “continuous watching” experience. We also brought key engagement actions into a consistent, gesture-friendly layout and built the necessary supporting states (loading, errors, bookmarking, playlists, expand-to-fullscreen) plus onboarding to make the new model learnable and durable.
The solution was an end-to-end evolution of the home feed viewing experience toward a vertical, full-screen paradigm, enabled by a major technical transition and a progressive UI strategy. On the technical side, we replaced the HTML5 player with a native player on both iOS and Android, improving maintainability and performance while reducing CPU and memory usage and significantly improving loading times. On the experience side, we evolved the card format in steps: modernizing the UI (padding, corner radius), moving through intermediate ratios (including a 4:5 exploration), then landing on a more balanced 1:1 approach while creating the illusion of a taller container via metadata placement (channel name, follow) and consistent background treatment across platforms. As the design matured, we handled the complexity of mixed aspect ratios by preserving original video ratios rather than aggressive cropping, refined background strategies for non-vertical content, and fine-tuned scroll animations and player controls to create a cohesive “continuous watching” experience. We also brought key engagement actions into a consistent, gesture-friendly layout and built the necessary supporting states (loading, errors, bookmarking, playlists, expand-to-fullscreen) plus onboarding to make the new model learnable and durable.
Data
10
%
7-day retention increased from 3% (2022) to 10% (2023),
Learnings
This project reinforced that “player redesign” is never just UI—it’s a product system spanning content strategy, technical architecture, interaction patterns, and long-term change management. First, performance is a feature: if playback feels slow or unreliable, no amount of visual polish will sustain engagement, especially on the home feed where users decide in seconds whether to stay. Second, immersive experiences require obsessive attention to transitions and states; scrolling behavior, seek precision, loading feedback, and error handling often determine whether an experience feels premium or fragile. Third, aspect ratio decisions are product decisions: preserving content context can matter more than aesthetic uniformity, and the right compromise is often the one that scales across a messy real-world catalog. Finally, on long multi-stakeholder initiatives, progress depends on “lego block” sequencing—shipping increments that build credibility—while keeping the end vision intact through continuous advocacy and alignment.
This project reinforced that “player redesign” is never just UI—it’s a product system spanning content strategy, technical architecture, interaction patterns, and long-term change management. First, performance is a feature: if playback feels slow or unreliable, no amount of visual polish will sustain engagement, especially on the home feed where users decide in seconds whether to stay. Second, immersive experiences require obsessive attention to transitions and states; scrolling behavior, seek precision, loading feedback, and error handling often determine whether an experience feels premium or fragile. Third, aspect ratio decisions are product decisions: preserving content context can matter more than aesthetic uniformity, and the right compromise is often the one that scales across a messy real-world catalog. Finally, on long multi-stakeholder initiatives, progress depends on “lego block” sequencing—shipping increments that build credibility—while keeping the end vision intact through continuous advocacy and alignment.