Hey everyone who is reading the article! I am Kristina Misko, product design team lead and product designer at streaming service. I’ve been working at it for the last three years, and it’s time tp share my experience and cases my team and I went through designing for TV platform.
I have decided to start from a very common, yet necessary basis which product designers will need at their practice when they just start working with TV platform. In this article I will share all the guidelines I personally studied when I just became a product designer for a streaming service.
There are a lot of dribble designs for web&mobile and a majority of courses for these platforms, yet there is the other platform which users are also very sticky to and to which we have less materials and design cases in the community. As a streaming service product designer, I personally adore TV platform for its peculiarities, technical issues and UX patterns which we build every day. The article reveals peculiarities and facts about designing for TV which we experience while creating design for the platform, but let’s start with numbers. According to the studies of Nielsen, streaming is more popular than either cable or broadcast, demanding 38.1% of total TV usage, and I’m sure the numbers will raise year by year. So, let’s observe, what’s it like to create the product for TV.
The main difference between TV and other platforms which influences all other aspects of product design for the platform is context. The context of when and why people turn on TV, whether they are alone, had a stressful day or there is a company of friends. The context creates special conditions which we must pay attention to. For example, we shouldn’t ask our user to go through a long flow of authorization on TV because a person had a long day full of work, stress, so let’s navigate them to the mobile app where the process will be faster, yet the result will be successful — a complete authorization on TV + a retention to the mobile app.
Another difference is remote control as a way to navigate through the device. It implies its own rules which I will cover later in the article. But taking theses two issues into consideration, you can already say that TV Design has its own hacks.
Your first stop should be the platform guidelines. Apple, Google and TV manufacturers all publish recommended interface patterns and technical constraints. Here are a few I keep bookmarked:
These documents will tell you what’s possible on each platform. They won’t, however, tell you how to make your app delightful across many different devices. That’s where hard‑won experience comes in.
Not all TVs are created equal. Some stuffed with the Voice Assistant, navigated by Air Mouse and powerful enough to maintain animations and gradients, and there is a plenty of devices whose capabilities are less fascinating . The last ones are not technically capable of other corner radius than 0, animations, gradients and parallax.
The decision we stick at our streaming service is design for the lowest common TV set and add enhancements only when you can detect that the hardware can handle them. How to do that? Test the devices, be in a close chain with TV developing stream and always ask for the feedback from them.
Everything on TV needs to be legible from about three metres away. I learned to bump up font sizes (20-24 px and above), increase contrast and limit dense blocks of text. Onboarding screens, tutorials and payment flows deserve extra attention because they often contain instructions or sensitive data.
A perfect example of such rule is a communicative screen, a screen where we sold a user a subscription or give offers. It usually has not many text, but it should be readable from the distance because if not, we’ll lose users’ attention.
On mobile, users tap to indicate intent. On TV, they navigate using arrows and rely on a focus state to see where they are. I experimented with several focus indicators — colour changes, borders, scaling and shadows. In the end, a combination of subtle scaling and colour change felt the most consistent across devices. Shadows look great on a flagship OLED, but many budget TVs simply drop them.
Navigation is limited to up/down/left/right and an OK button. So, the basic rule here is to simplify information architecture and develop it for the TVs with a good Voice assistant or Magic Remote. For example, I added such option in one of my recent designs for Search — you may search for the content AND for the Purchases, Continue watching list, etc. as well.
Most viewers turn on the TV after work, so cognitive load is low. My team deliberately reduced the number of steps needed to find something to watch. We prioritised personal recommendations and a prominent Continue Watching section. Complex tasks like account creation or entering payment details were handed off to mobile or web flows via QR codes.
TVs run a handful of operating systems: Apple’s tvOS, Android TV/Google TV, LG webOS, Samsung’s Tizen and even gaming consoles. Capabilities vary widely. To avoid maintaining multiple codebases, we built a design system that could degrade gracefully. Here are some tips about each platform:
Designing for TV is like designing a living‑room appliance. It requires empathy for the viewer’s context and respect for the hardware’s limits. My process looks something like this:
Welllllll, thank you for reading till the end, hope the article was useful for you. If you find it interesting, don’t hesitate and share it with your colleagues. In case you want to know more about TV platforms or designing tips for TV platform — let me know, I’ll cover the cases where I got stumbled on.
\