Max is a global streaming service within the Warner Bros. Discovery brand. It is available across multiple regions globally and has a large catalogue of content across, movies, tv, and sports. I was tasked to lead the product design on of a new feature called Key Moments across multiple platforms, TV, Web, Tablet, and Mobile. The feature aided sport fans to seamlessly catch-up on key highlights, stopping them from ever missing a moment of an event. This feature was due to launch for the Paris Olympics 2024, and further sports and other content would follow.
Client
Max, Warner Bros. Discovery
Role
Product Design Lead
Platforms
TV, Web, Tablet, & Mobile
Year
2024
1. Project Goals
Maximise sports users' experience by allowing them to catch up on key moments in a match or event.
Include a spoiler safe feature to help user’s avoid spoilers when watching sports behind the live edge.
Create a scalable design pattern that can be used for future iterations, e.g. for further sports, movies, events, and tv shows.
Follow the Max design principles and language to create a coherent experience across TV, Web, Tablet and Mobile for our existing user base.
2. Design Process
Exploration and Discovery
In order to understand the problem better, myself and a product manager conducted an extensive competitor analysis of other streaming services. This was conducted to better gauge if there were similar features across other services, and if so how this feature appeared and was utilised in the product.
We focused on feature parity across these competitors, such as -
Were key moments shown on Live only or also VOD content
What sport content utilised this feature - was it also used for entertainment
Were these short highlight clips or marker/chapter points within the timeline
Visual and UX aspects of the feature within the video player
The findings from this analysis helped us to guide the designs and requirements for the feature.
Concept Designs
Initial concepts were designed to explore how the feature could be incorporated into the current video player. This involved multiple workshops with teams across design and product within the sports and video player teams to iterate and review wireframes, concept designs, and rapid prototypes.
User Testing
Once an initial concept had been decided on it was time to user test this. I partnered with a user researcher within the UXD team to set tasks and goals for the research, The user testing was implemented by an agency, participants were both from New York and London and prototypes were tested in a TV lab.
User Testing Results
Worked Well
Desirable - the Key Moment feature ranked highly with sports users and caused positive outburst upon discovery.
Upon Request - Key Moments were successful when displayed upon request. Users did not want it displayed all the time, preference was to focus on the match/game.
Transparency & Spacing - Transparent tiles with generous spacing improved perception of visibility of the game playing behind the controls.
“ I like Key Moments.. I have kids, and missing big moments in games happens to me”
“Transparency doesn’t take away much”
Minor Issues
Learnable, Clip vs Rewind - Many who used competitor apps expected only brief clips instead of rewinding the game/match. However, most liked and learnt this after first use.
Too Many Key Moments - Don’t show every point in a match/game. Tailor choice of moments to each sport.
Icons - Initial understanding icons was mixed, but selection of any item provided more context which quickly clarified any confusion.
“Key Moments for rugby should be only the big moments not everything that happens”
Iterating on Designs
Once user testing was conducted designs were then iterated on taking into account the feedback from UX research. One point of feedback we could not action fully was clip vs rewind, as the backend of this feature was set to skip to a marker point (either rewind or fast forward to a point in the video). Seeing as we were unable to change this, and users were not overly unhappy with the feature, I decided to focus on designing affordances for this action. I utilised the scrub bar to give a visual cue to the user of the action of rewinding or skipping through the video.
As with most of my projects I like to set design tenets as guidelines to aid decision making. These are set taking into account the feedback from UX research and requirements. A few of these on this project were -
Non-intrusive
As highlighted in user research, the main focus should be the live video that the user is watching. The key moment feature should not be intrusive. This was achieved by using transparent backgrounds, spacing and reduced meta data on non hover/focus states to remove visual noise over the video. Safety gradients were utilised to also insure that contrast accessibility guidelines were met.
Informative but not overwhelming
Utilising the data available to give as much information to the user as necessary, but by also implementing progressive disclosure to only show detailed information on one moment at a time, either on focus, hover, or a tap (depending on device) to lower cognitive load on the user.
Scalable
The feature needed to be scalable to adapt across all content types. Additional use cases to come included, team sports, movies, and events. With ever changing metadata across all different content types multiple tile variants were designed.
Design Spec Delivery
The design spec was delivered to engineering teams. This would cover all aspects of the feature design, configurability, behaviours, errors, interactions, motion, accessibility including screen reader scripts, and prototype videos.
Design specs for the feature and component were delivered for all platforms - TV, web, and iOS / Android tablet and mobile apps.
3. Results
The launch of this feature was set for the Paris Olympics 2024. After the Olympics user feedback on this feature were positive. 10%-15% of (sports) user’s used the feature within the first couple of months of launch with this metric increasing over time.
Mobile Experience Prototype
A user survey was conducted post launch and feedback was overwhelmingly positive.
Game changing feature
“This could change my way of watching. I could go to a live or even completed game and look back at the key moments.”
p6, TV, UK
“I would definitely use it because I think that’s quite a cool feature. Sometimes you have a sporting event playing in the background so maybe you miss the goal or a new world record that’s been set. So, it’s cool to be able to go back. I’ll check that out.”
p15, Web, Sweden
One potential area for improvement was the discoverability of Key Moments. The feature was designed to be unintrusive, due to UX research feedback, but after launch a small number of users mentioned that they had some difficulty discovering the feature, but once found it was easy to find again. Whether this is something that needs improvement or can be attributed to a learned behaviour, metrics of the features usage will guide this over time.
Web Experience Prototype
Another area was iconography. The understandability of the icons for each sporting moment was not fully clear. This is something that came up in initial UX research and will be addressed in the future by utilising more imagery (when data is provided) and new icon sets.
Icons Not fully understood
“I'm not a basketball guy so I don't know about the icons, but you can just click it to see what it was. [Also checks football and clicks through each key moment to learn the icons.] Maybe the icons can be slightly improved, but I think this was a really fantastic feature.”
p14, Web, Sweden
As the feature was only delivered for the Olympics during the summer of 2024, other designs and variations are set for a phased release throughout 2024/25.
