HBO Max: The best-designed of the streaming apps
HBO Max: The best-designed of the streaming apps
HBO Max: The best-designed of the streaming apps
A design usability assessment of major streaming services used on an Apple TV.
A design usability assessment of major streaming services used on an Apple TV.
A design usability assessment of major streaming services used on an Apple TV.
Note: Since Spring 2022, HBO Max has become 'Max' as it merged other content from Discovery into a slightly redesigned interface, and bloated library with a non-native playback controls.
What constitutes a great TV app experience?
There’s several criteria that can be formed when considering where, why, and how TV apps such as Netflix are used:
Browsing from a distance beyond several feet (sitting on a sofa)
Either looking for something new to watch, or resuming something previously unfinished
Using a remote
Making a choice based on the choices shown, or the content that was self-discovered
In making this journey success, six criteria help define what being great could mean: UI, Search UX, Category Browsing, Curation, Rigidity, Pushiness, and Content Density.
In using an Apple TV as the test device (as it, in theory, should provide the best user experience given its premium price, ecosystem, and feature offerings), five of the top streaming services were compared against each other.
Against six criteria, HBO Max stands out as the best-designed streaming service (even despite its new update’s non-native design choices) through a combination of design choices that strays from the competition’s homogenized design - for the better, and full-of-personality curation present throughout the browsing experience.
HBO Max’s home page
Takeaways
Excellent curation and lack of highly repetitive rows differentiate HBO Max as an experience that was built for and welcomes exploration.
Here’s a playbook for a great TV app interface regardless of platform:
Let the content shine - don’t have a dense interface
Don’t have dozens of rows of carousels. Instead, when going through a lot of content, make a grid that can be vertically scrolled such as HBO Max’s implementation
Curate to your library’s strengths and utilize unique UI to differentiate it
Let the search page be a place of exploration
Fluidity matters: make navigating as friction-free as possible, from an information architecture design standpoint and from an engineering standpoint
HBO Max uses poster-shaped containers for their media, and uses large sizes that result a less-dense screen that brings more prominence to the visible content. Excellent curation and lack of highly repetitive rows differentiate HBO Max as an experience that was built for and welcomes exploration. HBO Max then leverages this design to highlight high-value franchises in its domain such as Game of Thrones and Harry Potter.
HBO Max’s poster-shaped media containers
Prime Video
Disney Plus
Netflix
Hulu
Netflix, Prime, Disney Plus, and to a lesser extent Hulu all look like each other. That’s both a good and a bad thing: on one hand, having a similar layout to Netflix makes it easier to have new Prime Video users adapt to their app. On the other hand, the nature of copying one another can standardize bad design practices like a dense UI - something a couch-based browsing experience should not have.
Table of Contents
HBO Max: The standout star, despite it’s new update
Scoring Rubric
Category Description UI Execution of the user interface to look at home on the Apple TV, and to meet the “10 foot experience” bar of visibility from a user sitting on the couch Search UX The ability of a service to have a functional search experience to lead to more intuitive browsing and exploration Category Browsing Ease of browsing different categories or genres of content for TV Shows and Movies Curation The service’s ability to curate and filter their library of content relevant to the user’s viewing preferences, holiday events, pop culture events, and to display prominent franchises in their library. Rigidity How easy navigation using the remote and the presented interface is. A lower score is better. Pushiness How aggressively a service pushes its own content or certain shows and movies over other choices. A lower score is better. Content Density How much content is visible to the user while browsing. A lower score is better.
HBO Max: The standout star despite it’s new update
HBO Max has the best browsing experience among the streaming services because of:
The intentional UI choice to have large artwork and non-repetitive carousels
Being able to scroll through large lists vertically
Excellent curation to show off their strength in having a smaller but high quality library
<aside> 💡 On April 7, 2022, HBO Max began to roll out an update to their Apple TV app. While stability and the playback UI was improved, navigation with the remote took a step back. This update has been reflected in HBO’s scores for Rigidity and UI
</aside>
“...HBO Max is in a league of its own.”
HBO Max has a giant carousel, as well as normal-sized carousels of content that are poster-shaped which is something the competition has minimized away from to maximize the density of content on the screen. HBO Max (a part of Warner Media) appears to use original artwork for all content - a big contrast from Netflix’s algorithm-powered content art.
Browsing HBO Max’s home screen
Browsing HBO Max’s home screen
Oddly, HBO Max uses square boxes for Continue Watching, For You, and My List content on the home page.
Browsing HBO Max’s TV Shows
When it comes to 1.) being able to browse categories and 2.) being able to effortless scroll through a long list, HBO Max is in a league of its own. Browsing for a TV show or a movie has curation present in the default “Featured” view. No two rows of content are alike - a big differentiator from Netflix and Prime Video especially.
HBO’s specialized curation from the search page
HBO’s specialized curation from the search page
HBO Max evolves the traditional search page to highlight unique curations, as well as putting the spotlight on incredibly popular franchises under the Warner Media domain such as Game of Thrones and Harry Potter with unique pages filled with extra features and curated content.
Note how HBO leverages the popularity of Harry Potter to curate suggestions based on what house you belong in.
HBO Max curation for the Harry Potter hub
Additionally HBO Max provides examples of popular searches as the media itself and a row of diverse categories.
Not everything about HBO is stellar. The most recent update, using a “new, universal framework” to build apps, swaps out the Apple-based parallax effect for browsing through lists for a simple purple outline around the highlighted item, similar to Disney Plus, it feels very out place for an Apple TV app, and more at home on a Roku. There’s a noticeable stiffness in scrolling now, which resulted in a higher rigidity score. The low visual signal to the purple outline and lack of parallax scrolling was factored into the UI score.
New outlined UI
Previous, Apple-based parallax effect
HBO Max is noticeably less easy to scroll through since the update, and departs from how most major streaming services implement scrolling on Apple TV.
HBO Max uses Apple’s playback interface
Hulu
Hulu has a well-rounded design with excellent organization. Its stand-out strengths are:
Diverse UI across browsing
Great organization
“Hulu does an exceptional job in the organization of a TV show’s episodes...”
Browsing through Hulu is a highly fluid experience. The Home screen begins with a series of large UI pieces to show recommendations and highlights from the service.
Browsing Hulu’s home page
Hulu does have some immediately noticeable UI bugs starting with the home screen as seen below with the buttons that would say “DETAILS,” is truncated.
A UI Bug front and center on Hulu’s home page
Hulu’s unique fast scroll
Hulu does an exceptional job in the organization of a TV show’s episodes, tying in curation to help browse through shows that may run for several seasons and potentially have over 100 episodes. Below, Hulu’s organization and curation of the show Modern Family is shown:
Hulu’s TV Show-level organization and curation
Hulu’s TV Show-level organization and curation
HBO Max has a similar curation for select shows such as Game of Thrones, but is only reachable through the Search page. Hulu intuitively has this organization present when browsing inside of a TV show. Modern Family’s page shows the high degree of personalization applied to the show itself such as highlighting famous guest and memorable moments.
Hulu scored high in Pushiness due to “over-promoting” certain new releases: making it present on multiple rows of a page:
Hulu really wants me to watch Deep Water, Spencer, and The King’s Man
With Hulu’s business model having an ad-supported paid tier, there are strange (in comparison to other services) patterns such as sponsored sections. In what are highly personal browsing experiences, it is odd to have a brand like NerdWallet be present at the curation level.
A sponsored section of Hulu’s home page
Hulu uses Apple’s playback interface
Hulu has a simple search that also surfaces trending searches
Disney+
Disney Plus is home to a deep library of Disney’s ever-growing empire, being home to classic animation movies, Marvel, Star Wars, and National Geographic content.
Disney Plus from a design standpoint primarily stands out with its curation and search page as a point of exploration.
“With the breadth of specialized content, the home screen is disappointingly generic if not approaching overwhelming with the density of content.”
The home page is highly dense in content, employing numerous rows of carousels to scroll through. With the breadth of specialized content, the home screen is disappointingly generic if not approaching overwhelming with the density of content.
Browsing Disney Plus’s home page
Browsing Disney Plus’s home page
While Disney Plus has highly specialized curation for a franchise like Star Wars, the browsing experience and layout leaves more to be desired. In a highly similar copy of Netflix’s design, the top half of the screen shows the details and image of the media selected. The bottom half shows two rows of carousels with small images of media.
Specialized curation for Star Wars
Specialized curation for Star Wars
Disney Plus’s browsing experience for a TV show or movie takes a different approach from the home screen in having a less dense experience by making the media larger while still using the rectangular template also used by Netflix, Hulu, and Prime Video.
Browsing Disney Plus for a movie
Browsing Disney Plus for a movie
With Disney’s growing library from different studios, it does have a curation problem of content suited to very different age groups being shown alongside each other.
Disney Plus uses a custom but native-functioning playback interface
Disney Plus leverages search to show curated collections
Netflix
Netflix could be regarded as the OG streaming service. Using its library strengths and algorithm chops, Netflix has become the juggernaut that it is today.
However, as shown on the radar chart, Netflix is most present on the left side, indicating a lackluster experience on Apple TV, and potentially other platforms.
“...curation for Netflix is not differentiated by unique UI, unlike HBO Max and Hulu.”
Netflix typically opens with a high resolution image and/or video of some featured content. Scrolling beyond that presents a split view that can making browsing claustrophobic since the bottom half can barely show two rows of carousels, out of what is likely dozens in total while the top half serves as a preview with some info on the selected content.
Browsing Netflix’s home page
Netflix also employs algorithms to attempt to optimize the cover image for most of their content. What you and your friend respectively see for 30 Rock or New Girl may be different cover images. I question its effectiveness alongside a dense, claustrophobic browsing experience.
Netflix thinks Jonah Hill posing will make me watch Don’t Look Up again
Despite the sophistication of Netflix’s recommendation algorithm, many of its categories result in repetitive recommendations. There’s a noticeable shift in Netflix Originals being prominently displayed.
Browsing Netflix for a TV show
Browsing Netflix for a TV show
Unlike HBO Max, Hulu, and Disney Plus, Netflix has no simple way to browse for a movie or TV show by genre.
Aside from the large header on the home screen and top of the Movies and TV shows page, curation for Netflix is not differentiated by unique UI, unlike HBO Max and Hulu. Netflix relies on the text that labels a row of media as the curation.
Anecdotally, I don’t have the “pop culture event” shows appear in my Netflix home screen as they arrive such as Squid Games and Inventing Anna. Many times, I’ve had to intentionally search for the new shows I was hearing about.
<aside> 💡 Note: Netflix is highly experimental with their UI across platforms. They could have multiple Apple TV layouts deployed to segments of their users.
</aside>
Netflix uses an Apple interface for playback
Netflix has a simple search interface with no initial exploration available
Prime Video
Amazon’s Prime Video app is the lowest-scoring of the five streaming services. From an experience standpoint, it was heavy on the left side of the radar chart - an indicator of low user experience values. Several issues stand out:
A terribly rigid browsing experience
Crammed interface with content
Mixes both a digital store and streaming service into one app with non-intuitive toggles
Despite the hundreds of designers and engineers at Amazon, Prime Video appears to mirror its design and functionality across all platforms for worse.
Prime Video’s UI is exceptionally dense, having small containers for media, and repetitive rows of carousels. Prime Video also uses a non-native scrolling method similar to HBO Max, yet more rigid, resulting in one of the more frustrating experiences to navigate around.
Browsing Prime Video’s home page
Browsing Prime Video’s home page
Unlike HBO Max, Hulu, and Disney Plus, Prime Video has no simple way to browse for a movie or TV show by genre.
Similar to Netflix, Prime Video has no differentiated UI for curated content besides the text that labels each row of media.
Prime Video, assessed on its own and in comparisons to its competitors, has a convoluted design for browsing between episodes of a TV show. If Hulu’s handling of TV episode organization was at the end of a spectrum, Prime video is at the opposite end.
Navigating Prime Video’s TV episodes organization
Navigating Prime Video’s TV episodes organization
The continued feeling of rigidity while scrolling through a TV show should be noted here: it may be unnoticeable on a Fire Stick or smart TV’s interface as they would have remotes that would need to physically click through each movement. Apple TV’s have a remote with a touchpad, allowing users to swipe in the direction the want to scroll, resulting in the fluid scrolling that highly differentiate’s the Apple TV as a premium streaming product. (Starting at $179, the price is still absurd)
Recently, Prime Video pushed an update that made the playback interface a non-native one on Apple TV - a likely continuation of their “universal” interface optimized for all other platforms but Apple’s. Apple TV users can no longer smoothly swipe left or right when paused to scrub quickly through their media being watched. Now, like the users of smart TVs, Rokus, and Fire Sticks, multiple individual clicks on the remote are needed just to go back a minute.
Prime Video, like Netflix has a simple search interface with no initial exploration available
Prime Video uses a custom playback interface
Scrubbing is non-natural in its implementation
Thoughts on Apple TV
Apple has continued to lose market share with their expensive Apple TV hardware starting at $179. In addition to many TV’s coming preloaded with streaming apps, there are numerous streaming devices from Amazon, Google, and Roku - many being under $50, and most under $100.
https://twitter.com/CNBC/status/1405936749637943299?s=20&t=Jh9wnl276USeK2meHgSSmQ
While Apple has a more polished product with more technical oomf (Dolby Vision performance, framerate handling, etc), and a stated stance on privacy, many consumers aren’t willing to spend that premium as proven by the market share trends.
Apple adding Airplay capability and the Apple TV Plus streaming app to recent smart TVs seems like a bandaid to a problem that will persist.
If Apple TV’s marketshare continues to decline, streaming services will have little incentive to optimize if not cater to the tvOS platform Apple TV runs on. We’re seeing this now with examples like Prime Video’s playback interface and HBO dropping parallax scrolling. Apple’s saving grace may be the coherence in developing between iPhone, iPad, Mac, and likely TV apps through further advancement in their development tools.
Chart Comparisons
Note: Since Spring 2022, HBO Max has become 'Max' as it merged other content from Discovery into a slightly redesigned interface, and bloated library with a non-native playback controls.
What constitutes a great TV app experience?
There’s several criteria that can be formed when considering where, why, and how TV apps such as Netflix are used:
Browsing from a distance beyond several feet (sitting on a sofa)
Either looking for something new to watch, or resuming something previously unfinished
Using a remote
Making a choice based on the choices shown, or the content that was self-discovered
In making this journey success, six criteria help define what being great could mean: UI, Search UX, Category Browsing, Curation, Rigidity, Pushiness, and Content Density.
In using an Apple TV as the test device (as it, in theory, should provide the best user experience given its premium price, ecosystem, and feature offerings), five of the top streaming services were compared against each other.
Against six criteria, HBO Max stands out as the best-designed streaming service (even despite its new update’s non-native design choices) through a combination of design choices that strays from the competition’s homogenized design - for the better, and full-of-personality curation present throughout the browsing experience.
HBO Max’s home page
Takeaways
Excellent curation and lack of highly repetitive rows differentiate HBO Max as an experience that was built for and welcomes exploration.
Here’s a playbook for a great TV app interface regardless of platform:
Let the content shine - don’t have a dense interface
Don’t have dozens of rows of carousels. Instead, when going through a lot of content, make a grid that can be vertically scrolled such as HBO Max’s implementation
Curate to your library’s strengths and utilize unique UI to differentiate it
Let the search page be a place of exploration
Fluidity matters: make navigating as friction-free as possible, from an information architecture design standpoint and from an engineering standpoint
HBO Max uses poster-shaped containers for their media, and uses large sizes that result a less-dense screen that brings more prominence to the visible content. Excellent curation and lack of highly repetitive rows differentiate HBO Max as an experience that was built for and welcomes exploration. HBO Max then leverages this design to highlight high-value franchises in its domain such as Game of Thrones and Harry Potter.
HBO Max’s poster-shaped media containers
Prime Video
Disney Plus
Netflix
Hulu
Netflix, Prime, Disney Plus, and to a lesser extent Hulu all look like each other. That’s both a good and a bad thing: on one hand, having a similar layout to Netflix makes it easier to have new Prime Video users adapt to their app. On the other hand, the nature of copying one another can standardize bad design practices like a dense UI - something a couch-based browsing experience should not have.
Table of Contents
HBO Max: The standout star, despite it’s new update
Scoring Rubric
Category Description UI Execution of the user interface to look at home on the Apple TV, and to meet the “10 foot experience” bar of visibility from a user sitting on the couch Search UX The ability of a service to have a functional search experience to lead to more intuitive browsing and exploration Category Browsing Ease of browsing different categories or genres of content for TV Shows and Movies Curation The service’s ability to curate and filter their library of content relevant to the user’s viewing preferences, holiday events, pop culture events, and to display prominent franchises in their library. Rigidity How easy navigation using the remote and the presented interface is. A lower score is better. Pushiness How aggressively a service pushes its own content or certain shows and movies over other choices. A lower score is better. Content Density How much content is visible to the user while browsing. A lower score is better.
HBO Max: The standout star despite it’s new update
HBO Max has the best browsing experience among the streaming services because of:
The intentional UI choice to have large artwork and non-repetitive carousels
Being able to scroll through large lists vertically
Excellent curation to show off their strength in having a smaller but high quality library
<aside> 💡 On April 7, 2022, HBO Max began to roll out an update to their Apple TV app. While stability and the playback UI was improved, navigation with the remote took a step back. This update has been reflected in HBO’s scores for Rigidity and UI
</aside>
“...HBO Max is in a league of its own.”
HBO Max has a giant carousel, as well as normal-sized carousels of content that are poster-shaped which is something the competition has minimized away from to maximize the density of content on the screen. HBO Max (a part of Warner Media) appears to use original artwork for all content - a big contrast from Netflix’s algorithm-powered content art.
Browsing HBO Max’s home screen
Browsing HBO Max’s home screen
Oddly, HBO Max uses square boxes for Continue Watching, For You, and My List content on the home page.
Browsing HBO Max’s TV Shows
When it comes to 1.) being able to browse categories and 2.) being able to effortless scroll through a long list, HBO Max is in a league of its own. Browsing for a TV show or a movie has curation present in the default “Featured” view. No two rows of content are alike - a big differentiator from Netflix and Prime Video especially.
HBO’s specialized curation from the search page
HBO’s specialized curation from the search page
HBO Max evolves the traditional search page to highlight unique curations, as well as putting the spotlight on incredibly popular franchises under the Warner Media domain such as Game of Thrones and Harry Potter with unique pages filled with extra features and curated content.
Note how HBO leverages the popularity of Harry Potter to curate suggestions based on what house you belong in.
HBO Max curation for the Harry Potter hub
Additionally HBO Max provides examples of popular searches as the media itself and a row of diverse categories.
Not everything about HBO is stellar. The most recent update, using a “new, universal framework” to build apps, swaps out the Apple-based parallax effect for browsing through lists for a simple purple outline around the highlighted item, similar to Disney Plus, it feels very out place for an Apple TV app, and more at home on a Roku. There’s a noticeable stiffness in scrolling now, which resulted in a higher rigidity score. The low visual signal to the purple outline and lack of parallax scrolling was factored into the UI score.
New outlined UI
Previous, Apple-based parallax effect
HBO Max is noticeably less easy to scroll through since the update, and departs from how most major streaming services implement scrolling on Apple TV.
HBO Max uses Apple’s playback interface
Hulu
Hulu has a well-rounded design with excellent organization. Its stand-out strengths are:
Diverse UI across browsing
Great organization
“Hulu does an exceptional job in the organization of a TV show’s episodes...”
Browsing through Hulu is a highly fluid experience. The Home screen begins with a series of large UI pieces to show recommendations and highlights from the service.
Browsing Hulu’s home page
Hulu does have some immediately noticeable UI bugs starting with the home screen as seen below with the buttons that would say “DETAILS,” is truncated.
A UI Bug front and center on Hulu’s home page
Hulu’s unique fast scroll
Hulu does an exceptional job in the organization of a TV show’s episodes, tying in curation to help browse through shows that may run for several seasons and potentially have over 100 episodes. Below, Hulu’s organization and curation of the show Modern Family is shown:
Hulu’s TV Show-level organization and curation
Hulu’s TV Show-level organization and curation
HBO Max has a similar curation for select shows such as Game of Thrones, but is only reachable through the Search page. Hulu intuitively has this organization present when browsing inside of a TV show. Modern Family’s page shows the high degree of personalization applied to the show itself such as highlighting famous guest and memorable moments.
Hulu scored high in Pushiness due to “over-promoting” certain new releases: making it present on multiple rows of a page:
Hulu really wants me to watch Deep Water, Spencer, and The King’s Man
With Hulu’s business model having an ad-supported paid tier, there are strange (in comparison to other services) patterns such as sponsored sections. In what are highly personal browsing experiences, it is odd to have a brand like NerdWallet be present at the curation level.
A sponsored section of Hulu’s home page
Hulu uses Apple’s playback interface
Hulu has a simple search that also surfaces trending searches
Disney+
Disney Plus is home to a deep library of Disney’s ever-growing empire, being home to classic animation movies, Marvel, Star Wars, and National Geographic content.
Disney Plus from a design standpoint primarily stands out with its curation and search page as a point of exploration.
“With the breadth of specialized content, the home screen is disappointingly generic if not approaching overwhelming with the density of content.”
The home page is highly dense in content, employing numerous rows of carousels to scroll through. With the breadth of specialized content, the home screen is disappointingly generic if not approaching overwhelming with the density of content.
Browsing Disney Plus’s home page
Browsing Disney Plus’s home page
While Disney Plus has highly specialized curation for a franchise like Star Wars, the browsing experience and layout leaves more to be desired. In a highly similar copy of Netflix’s design, the top half of the screen shows the details and image of the media selected. The bottom half shows two rows of carousels with small images of media.
Specialized curation for Star Wars
Specialized curation for Star Wars
Disney Plus’s browsing experience for a TV show or movie takes a different approach from the home screen in having a less dense experience by making the media larger while still using the rectangular template also used by Netflix, Hulu, and Prime Video.
Browsing Disney Plus for a movie
Browsing Disney Plus for a movie
With Disney’s growing library from different studios, it does have a curation problem of content suited to very different age groups being shown alongside each other.
Disney Plus uses a custom but native-functioning playback interface
Disney Plus leverages search to show curated collections
Netflix
Netflix could be regarded as the OG streaming service. Using its library strengths and algorithm chops, Netflix has become the juggernaut that it is today.
However, as shown on the radar chart, Netflix is most present on the left side, indicating a lackluster experience on Apple TV, and potentially other platforms.
“...curation for Netflix is not differentiated by unique UI, unlike HBO Max and Hulu.”
Netflix typically opens with a high resolution image and/or video of some featured content. Scrolling beyond that presents a split view that can making browsing claustrophobic since the bottom half can barely show two rows of carousels, out of what is likely dozens in total while the top half serves as a preview with some info on the selected content.
Browsing Netflix’s home page
Netflix also employs algorithms to attempt to optimize the cover image for most of their content. What you and your friend respectively see for 30 Rock or New Girl may be different cover images. I question its effectiveness alongside a dense, claustrophobic browsing experience.
Netflix thinks Jonah Hill posing will make me watch Don’t Look Up again
Despite the sophistication of Netflix’s recommendation algorithm, many of its categories result in repetitive recommendations. There’s a noticeable shift in Netflix Originals being prominently displayed.
Browsing Netflix for a TV show
Browsing Netflix for a TV show
Unlike HBO Max, Hulu, and Disney Plus, Netflix has no simple way to browse for a movie or TV show by genre.
Aside from the large header on the home screen and top of the Movies and TV shows page, curation for Netflix is not differentiated by unique UI, unlike HBO Max and Hulu. Netflix relies on the text that labels a row of media as the curation.
Anecdotally, I don’t have the “pop culture event” shows appear in my Netflix home screen as they arrive such as Squid Games and Inventing Anna. Many times, I’ve had to intentionally search for the new shows I was hearing about.
<aside> 💡 Note: Netflix is highly experimental with their UI across platforms. They could have multiple Apple TV layouts deployed to segments of their users.
</aside>
Netflix uses an Apple interface for playback
Netflix has a simple search interface with no initial exploration available
Prime Video
Amazon’s Prime Video app is the lowest-scoring of the five streaming services. From an experience standpoint, it was heavy on the left side of the radar chart - an indicator of low user experience values. Several issues stand out:
A terribly rigid browsing experience
Crammed interface with content
Mixes both a digital store and streaming service into one app with non-intuitive toggles
Despite the hundreds of designers and engineers at Amazon, Prime Video appears to mirror its design and functionality across all platforms for worse.
Prime Video’s UI is exceptionally dense, having small containers for media, and repetitive rows of carousels. Prime Video also uses a non-native scrolling method similar to HBO Max, yet more rigid, resulting in one of the more frustrating experiences to navigate around.
Browsing Prime Video’s home page
Browsing Prime Video’s home page
Unlike HBO Max, Hulu, and Disney Plus, Prime Video has no simple way to browse for a movie or TV show by genre.
Similar to Netflix, Prime Video has no differentiated UI for curated content besides the text that labels each row of media.
Prime Video, assessed on its own and in comparisons to its competitors, has a convoluted design for browsing between episodes of a TV show. If Hulu’s handling of TV episode organization was at the end of a spectrum, Prime video is at the opposite end.
Navigating Prime Video’s TV episodes organization
Navigating Prime Video’s TV episodes organization
The continued feeling of rigidity while scrolling through a TV show should be noted here: it may be unnoticeable on a Fire Stick or smart TV’s interface as they would have remotes that would need to physically click through each movement. Apple TV’s have a remote with a touchpad, allowing users to swipe in the direction the want to scroll, resulting in the fluid scrolling that highly differentiate’s the Apple TV as a premium streaming product. (Starting at $179, the price is still absurd)
Recently, Prime Video pushed an update that made the playback interface a non-native one on Apple TV - a likely continuation of their “universal” interface optimized for all other platforms but Apple’s. Apple TV users can no longer smoothly swipe left or right when paused to scrub quickly through their media being watched. Now, like the users of smart TVs, Rokus, and Fire Sticks, multiple individual clicks on the remote are needed just to go back a minute.
Prime Video, like Netflix has a simple search interface with no initial exploration available
Prime Video uses a custom playback interface
Scrubbing is non-natural in its implementation
Thoughts on Apple TV
Apple has continued to lose market share with their expensive Apple TV hardware starting at $179. In addition to many TV’s coming preloaded with streaming apps, there are numerous streaming devices from Amazon, Google, and Roku - many being under $50, and most under $100.
https://twitter.com/CNBC/status/1405936749637943299?s=20&t=Jh9wnl276USeK2meHgSSmQ
While Apple has a more polished product with more technical oomf (Dolby Vision performance, framerate handling, etc), and a stated stance on privacy, many consumers aren’t willing to spend that premium as proven by the market share trends.
Apple adding Airplay capability and the Apple TV Plus streaming app to recent smart TVs seems like a bandaid to a problem that will persist.
If Apple TV’s marketshare continues to decline, streaming services will have little incentive to optimize if not cater to the tvOS platform Apple TV runs on. We’re seeing this now with examples like Prime Video’s playback interface and HBO dropping parallax scrolling. Apple’s saving grace may be the coherence in developing between iPhone, iPad, Mac, and likely TV apps through further advancement in their development tools.
Chart Comparisons
Note: Since Spring 2022, HBO Max has become 'Max' as it merged other content from Discovery into a slightly redesigned interface, and bloated library with a non-native playback controls.
What constitutes a great TV app experience?
There’s several criteria that can be formed when considering where, why, and how TV apps such as Netflix are used:
Browsing from a distance beyond several feet (sitting on a sofa)
Either looking for something new to watch, or resuming something previously unfinished
Using a remote
Making a choice based on the choices shown, or the content that was self-discovered
In making this journey success, six criteria help define what being great could mean: UI, Search UX, Category Browsing, Curation, Rigidity, Pushiness, and Content Density.
In using an Apple TV as the test device (as it, in theory, should provide the best user experience given its premium price, ecosystem, and feature offerings), five of the top streaming services were compared against each other.
Against six criteria, HBO Max stands out as the best-designed streaming service (even despite its new update’s non-native design choices) through a combination of design choices that strays from the competition’s homogenized design - for the better, and full-of-personality curation present throughout the browsing experience.
HBO Max’s home page
Takeaways
Excellent curation and lack of highly repetitive rows differentiate HBO Max as an experience that was built for and welcomes exploration.
Here’s a playbook for a great TV app interface regardless of platform:
Let the content shine - don’t have a dense interface
Don’t have dozens of rows of carousels. Instead, when going through a lot of content, make a grid that can be vertically scrolled such as HBO Max’s implementation
Curate to your library’s strengths and utilize unique UI to differentiate it
Let the search page be a place of exploration
Fluidity matters: make navigating as friction-free as possible, from an information architecture design standpoint and from an engineering standpoint
HBO Max uses poster-shaped containers for their media, and uses large sizes that result a less-dense screen that brings more prominence to the visible content. Excellent curation and lack of highly repetitive rows differentiate HBO Max as an experience that was built for and welcomes exploration. HBO Max then leverages this design to highlight high-value franchises in its domain such as Game of Thrones and Harry Potter.
HBO Max’s poster-shaped media containers
Prime Video
Disney Plus
Netflix
Hulu
Netflix, Prime, Disney Plus, and to a lesser extent Hulu all look like each other. That’s both a good and a bad thing: on one hand, having a similar layout to Netflix makes it easier to have new Prime Video users adapt to their app. On the other hand, the nature of copying one another can standardize bad design practices like a dense UI - something a couch-based browsing experience should not have.
Table of Contents
HBO Max: The standout star, despite it’s new update
Scoring Rubric
Category Description UI Execution of the user interface to look at home on the Apple TV, and to meet the “10 foot experience” bar of visibility from a user sitting on the couch Search UX The ability of a service to have a functional search experience to lead to more intuitive browsing and exploration Category Browsing Ease of browsing different categories or genres of content for TV Shows and Movies Curation The service’s ability to curate and filter their library of content relevant to the user’s viewing preferences, holiday events, pop culture events, and to display prominent franchises in their library. Rigidity How easy navigation using the remote and the presented interface is. A lower score is better. Pushiness How aggressively a service pushes its own content or certain shows and movies over other choices. A lower score is better. Content Density How much content is visible to the user while browsing. A lower score is better.
HBO Max: The standout star despite it’s new update
HBO Max has the best browsing experience among the streaming services because of:
The intentional UI choice to have large artwork and non-repetitive carousels
Being able to scroll through large lists vertically
Excellent curation to show off their strength in having a smaller but high quality library
<aside> 💡 On April 7, 2022, HBO Max began to roll out an update to their Apple TV app. While stability and the playback UI was improved, navigation with the remote took a step back. This update has been reflected in HBO’s scores for Rigidity and UI
</aside>
“...HBO Max is in a league of its own.”
HBO Max has a giant carousel, as well as normal-sized carousels of content that are poster-shaped which is something the competition has minimized away from to maximize the density of content on the screen. HBO Max (a part of Warner Media) appears to use original artwork for all content - a big contrast from Netflix’s algorithm-powered content art.
Browsing HBO Max’s home screen
Browsing HBO Max’s home screen
Oddly, HBO Max uses square boxes for Continue Watching, For You, and My List content on the home page.
Browsing HBO Max’s TV Shows
When it comes to 1.) being able to browse categories and 2.) being able to effortless scroll through a long list, HBO Max is in a league of its own. Browsing for a TV show or a movie has curation present in the default “Featured” view. No two rows of content are alike - a big differentiator from Netflix and Prime Video especially.
HBO’s specialized curation from the search page
HBO’s specialized curation from the search page
HBO Max evolves the traditional search page to highlight unique curations, as well as putting the spotlight on incredibly popular franchises under the Warner Media domain such as Game of Thrones and Harry Potter with unique pages filled with extra features and curated content.
Note how HBO leverages the popularity of Harry Potter to curate suggestions based on what house you belong in.
HBO Max curation for the Harry Potter hub
Additionally HBO Max provides examples of popular searches as the media itself and a row of diverse categories.
Not everything about HBO is stellar. The most recent update, using a “new, universal framework” to build apps, swaps out the Apple-based parallax effect for browsing through lists for a simple purple outline around the highlighted item, similar to Disney Plus, it feels very out place for an Apple TV app, and more at home on a Roku. There’s a noticeable stiffness in scrolling now, which resulted in a higher rigidity score. The low visual signal to the purple outline and lack of parallax scrolling was factored into the UI score.
New outlined UI
Previous, Apple-based parallax effect
HBO Max is noticeably less easy to scroll through since the update, and departs from how most major streaming services implement scrolling on Apple TV.
HBO Max uses Apple’s playback interface
Hulu
Hulu has a well-rounded design with excellent organization. Its stand-out strengths are:
Diverse UI across browsing
Great organization
“Hulu does an exceptional job in the organization of a TV show’s episodes...”
Browsing through Hulu is a highly fluid experience. The Home screen begins with a series of large UI pieces to show recommendations and highlights from the service.
Browsing Hulu’s home page
Hulu does have some immediately noticeable UI bugs starting with the home screen as seen below with the buttons that would say “DETAILS,” is truncated.
A UI Bug front and center on Hulu’s home page
Hulu’s unique fast scroll
Hulu does an exceptional job in the organization of a TV show’s episodes, tying in curation to help browse through shows that may run for several seasons and potentially have over 100 episodes. Below, Hulu’s organization and curation of the show Modern Family is shown:
Hulu’s TV Show-level organization and curation
Hulu’s TV Show-level organization and curation
HBO Max has a similar curation for select shows such as Game of Thrones, but is only reachable through the Search page. Hulu intuitively has this organization present when browsing inside of a TV show. Modern Family’s page shows the high degree of personalization applied to the show itself such as highlighting famous guest and memorable moments.
Hulu scored high in Pushiness due to “over-promoting” certain new releases: making it present on multiple rows of a page:
Hulu really wants me to watch Deep Water, Spencer, and The King’s Man
With Hulu’s business model having an ad-supported paid tier, there are strange (in comparison to other services) patterns such as sponsored sections. In what are highly personal browsing experiences, it is odd to have a brand like NerdWallet be present at the curation level.
A sponsored section of Hulu’s home page
Hulu uses Apple’s playback interface
Hulu has a simple search that also surfaces trending searches
Disney+
Disney Plus is home to a deep library of Disney’s ever-growing empire, being home to classic animation movies, Marvel, Star Wars, and National Geographic content.
Disney Plus from a design standpoint primarily stands out with its curation and search page as a point of exploration.
“With the breadth of specialized content, the home screen is disappointingly generic if not approaching overwhelming with the density of content.”
The home page is highly dense in content, employing numerous rows of carousels to scroll through. With the breadth of specialized content, the home screen is disappointingly generic if not approaching overwhelming with the density of content.
Browsing Disney Plus’s home page
Browsing Disney Plus’s home page
While Disney Plus has highly specialized curation for a franchise like Star Wars, the browsing experience and layout leaves more to be desired. In a highly similar copy of Netflix’s design, the top half of the screen shows the details and image of the media selected. The bottom half shows two rows of carousels with small images of media.
Specialized curation for Star Wars
Specialized curation for Star Wars
Disney Plus’s browsing experience for a TV show or movie takes a different approach from the home screen in having a less dense experience by making the media larger while still using the rectangular template also used by Netflix, Hulu, and Prime Video.
Browsing Disney Plus for a movie
Browsing Disney Plus for a movie
With Disney’s growing library from different studios, it does have a curation problem of content suited to very different age groups being shown alongside each other.
Disney Plus uses a custom but native-functioning playback interface
Disney Plus leverages search to show curated collections
Netflix
Netflix could be regarded as the OG streaming service. Using its library strengths and algorithm chops, Netflix has become the juggernaut that it is today.
However, as shown on the radar chart, Netflix is most present on the left side, indicating a lackluster experience on Apple TV, and potentially other platforms.
“...curation for Netflix is not differentiated by unique UI, unlike HBO Max and Hulu.”
Netflix typically opens with a high resolution image and/or video of some featured content. Scrolling beyond that presents a split view that can making browsing claustrophobic since the bottom half can barely show two rows of carousels, out of what is likely dozens in total while the top half serves as a preview with some info on the selected content.
Browsing Netflix’s home page
Netflix also employs algorithms to attempt to optimize the cover image for most of their content. What you and your friend respectively see for 30 Rock or New Girl may be different cover images. I question its effectiveness alongside a dense, claustrophobic browsing experience.
Netflix thinks Jonah Hill posing will make me watch Don’t Look Up again
Despite the sophistication of Netflix’s recommendation algorithm, many of its categories result in repetitive recommendations. There’s a noticeable shift in Netflix Originals being prominently displayed.
Browsing Netflix for a TV show
Browsing Netflix for a TV show
Unlike HBO Max, Hulu, and Disney Plus, Netflix has no simple way to browse for a movie or TV show by genre.
Aside from the large header on the home screen and top of the Movies and TV shows page, curation for Netflix is not differentiated by unique UI, unlike HBO Max and Hulu. Netflix relies on the text that labels a row of media as the curation.
Anecdotally, I don’t have the “pop culture event” shows appear in my Netflix home screen as they arrive such as Squid Games and Inventing Anna. Many times, I’ve had to intentionally search for the new shows I was hearing about.
<aside> 💡 Note: Netflix is highly experimental with their UI across platforms. They could have multiple Apple TV layouts deployed to segments of their users.
</aside>
Netflix uses an Apple interface for playback
Netflix has a simple search interface with no initial exploration available
Prime Video
Amazon’s Prime Video app is the lowest-scoring of the five streaming services. From an experience standpoint, it was heavy on the left side of the radar chart - an indicator of low user experience values. Several issues stand out:
A terribly rigid browsing experience
Crammed interface with content
Mixes both a digital store and streaming service into one app with non-intuitive toggles
Despite the hundreds of designers and engineers at Amazon, Prime Video appears to mirror its design and functionality across all platforms for worse.
Prime Video’s UI is exceptionally dense, having small containers for media, and repetitive rows of carousels. Prime Video also uses a non-native scrolling method similar to HBO Max, yet more rigid, resulting in one of the more frustrating experiences to navigate around.
Browsing Prime Video’s home page
Browsing Prime Video’s home page
Unlike HBO Max, Hulu, and Disney Plus, Prime Video has no simple way to browse for a movie or TV show by genre.
Similar to Netflix, Prime Video has no differentiated UI for curated content besides the text that labels each row of media.
Prime Video, assessed on its own and in comparisons to its competitors, has a convoluted design for browsing between episodes of a TV show. If Hulu’s handling of TV episode organization was at the end of a spectrum, Prime video is at the opposite end.
Navigating Prime Video’s TV episodes organization
Navigating Prime Video’s TV episodes organization
The continued feeling of rigidity while scrolling through a TV show should be noted here: it may be unnoticeable on a Fire Stick or smart TV’s interface as they would have remotes that would need to physically click through each movement. Apple TV’s have a remote with a touchpad, allowing users to swipe in the direction the want to scroll, resulting in the fluid scrolling that highly differentiate’s the Apple TV as a premium streaming product. (Starting at $179, the price is still absurd)
Recently, Prime Video pushed an update that made the playback interface a non-native one on Apple TV - a likely continuation of their “universal” interface optimized for all other platforms but Apple’s. Apple TV users can no longer smoothly swipe left or right when paused to scrub quickly through their media being watched. Now, like the users of smart TVs, Rokus, and Fire Sticks, multiple individual clicks on the remote are needed just to go back a minute.
Prime Video, like Netflix has a simple search interface with no initial exploration available
Prime Video uses a custom playback interface
Scrubbing is non-natural in its implementation
Thoughts on Apple TV
Apple has continued to lose market share with their expensive Apple TV hardware starting at $179. In addition to many TV’s coming preloaded with streaming apps, there are numerous streaming devices from Amazon, Google, and Roku - many being under $50, and most under $100.
https://twitter.com/CNBC/status/1405936749637943299?s=20&t=Jh9wnl276USeK2meHgSSmQ
While Apple has a more polished product with more technical oomf (Dolby Vision performance, framerate handling, etc), and a stated stance on privacy, many consumers aren’t willing to spend that premium as proven by the market share trends.
Apple adding Airplay capability and the Apple TV Plus streaming app to recent smart TVs seems like a bandaid to a problem that will persist.
If Apple TV’s marketshare continues to decline, streaming services will have little incentive to optimize if not cater to the tvOS platform Apple TV runs on. We’re seeing this now with examples like Prime Video’s playback interface and HBO dropping parallax scrolling. Apple’s saving grace may be the coherence in developing between iPhone, iPad, Mac, and likely TV apps through further advancement in their development tools.
Chart Comparisons
© Ravi Gangele 2023
© Ravi Gangele 2023