Designing a TV App for Kids

I was looking back at some of the experiences built with You.i Engine One and I couldn’t help but notice all the kid-centric ones that were created.

Common design practices don’t apply the same way for kids as they do for adults, which requires a shift in thinking. These apps require a firm understanding of the pint-sized user group and their viewing behavior.

In this post, I will take you through the top considerations when designing a TV app for kids. I will touch on four major pieces:

  • Layout & imagery
  • Visual cues
  • Education and offline behavior
  • Delightful experiences

Let’s get started.

Layout & Imagery

Whether the app you’re designing will sit on mobile, tablet, or TV — or a combination of all three, the key thing to remember is that children are highly visual learners. As is the case with children’s toys and clothing, bright and friendly colors are essential. Your main goal should be to exude a friendly, welcoming energy the moment a child launches the app. Don’t be afraid to experiment with unconventional color palettes, shapes, and shadows.

When creating the skeleton, it’s important to leave room for large thumbnails. Text is not as important to this demographic. The need for large titles, metadata, and episode descriptions are not as popular. You have to go in assuming reading comprehension varies based on the age and skill level of the user. Hence, a picture is truly worth a thousand words in this case. Large images also serve as a failsafe for excited fingers. When designing for mobile or tablet, larger images equal larger press areas. It’s a small detail that will curb the need for the user to tap on a thumbnail multiple times, reducing frustration and jumping to content faster.

Layouts in kids video apps should be clean and simple. Contrary to what one might believe, having too many items on the screen in a kids TV app is detrimental to the UX. As much as children love multiple experiences, screen clutter can serve to be a distraction rather than a positive design decision. Kids have an overactive brain and tend to get easily excited. By creating a simple UI, you’re directing their attention to what matters most: the content. One way to tackle clutter is to stick to TV characters rather than poster art. The first thing a child will do when launching a TV app is navigate to what’s familiar. Clearly seeing characters they recognize brings comfort and expedites the on-boarding process. The faster a user connects with a character, the faster they are engaging with the app and all the wonderful elements you’ve conceived.

 

Designing a TV App for Kids _ Kaboom

 

 

Designing a TV App for Kids _ Kaboom GIF

 

Visual Cues

Continuing my thought on kids being visual learners, implementing a healthy amount of visual cues helps in developing faster cognitive connections. Visual cues are a universal way to communicate. Rather than instructing a user to swipe to the left with text, a simple bouncing arrow can articulate the same message without the complications that come with written language.

Visual cues also work in the absence of text. Overpulling at the end of a row of thumbnails can show that there are no more titles to be displayed past this point. It’s a simple technique that makes a big difference in how the user interacts with the app. It’s important that you use visual cues strategically to better the UX.

Just as the layout should divert attention to pieces of content, so should the visual cues. It’s imperative that a kids TV app signals what is and isn’t clickable. kids have less hesitation about diving in and pressing items. It’s your responsibility to guide them in the right direction. Adding drop shadows to buttons, blurred backgrounds, hover states are all ways to establish hierarchy.

 

Designing a TV App for Kids _ NGK

 

National Geographic Kids uses the iconic National Geographic logo as a border around a selected item. Paired with greyed out thumbnails and a lock icon clearly adds distinction between which pieces of content are available and which aren’t. Note the parallax of the background to represent movement and depth, serving as a guidepost of how far the user has scrolled.

One thing to remember is that kids apps have two different types of users. Children and their parents. Every kids TV app needs to have a parental section — “baby gate” — for obvious reasons. Visual cues can help separate the two sections. By subduing the access point to baby gate, a child will be less inclined to venture there. They want to stay with the exciting, colorful action. Using a less-appealing icon or color to highlight this tab ensures no settings parents have set are accidentally turned off.

Designing a TV App for Kids _ NGK _ tablet

If you’re stuck on how to utilize visual cues for a kids TV app, imagine you are teaching a child how to use the app without written instructions. Think from their point of view and it will inform your decision-making.

Education and Offline Behavior

Parents. You got to love them. They just want what’s best for their kids and that includes an app that won’t rot your brain! They can bring a stigma of being mindless entertainment. That doesn’t have to be the case. You can design an app that is both fun, educational, and extends positively into the offline world.

Skeuomorphic design — designs that mimic their real-life counterparts — bridges the online and offline worlds through realism. Flat icons or minimalistic design, in general, can confuse a child. As adults, we understand that a rectangle with a circle in the middle constitutes a camera because we’ve seen enough cameras in our lives to make the connection. It’s the not the same for children which is why skeuomorphic design is widely applied.

 

Designing a TV App for Kids _ camera icons

Source: No Pork Pies

 

Being able to bridge that gap between online and offline will make the app stand out, especially among parents. If your app experience can make communication easier between a parent and their child, it will be all the more impactful.

Designing a TV App for Kids _ TreehouseGo

Designing a TV App for Kids _ TreehouseGO _ GIF

 

In this TreehousGO example, rather than simply tap a button to save a video for offline viewing, the app used skeuomorphic design and interactivity to allow the user to physically drag their TV show into a backpack. This was put in place because packing a backpack with toys, books, and snacks is common for traveling families. This feature helps reinforce the notion of being prepared when going in the car, to the park, etc.

Delightful Experiences

Kids love surprises — so surprise them. Add moments in your user experience that will make the user smile. Don’t phone it in and put static thumbnails on a black background, where all the user can do is ‘press to play’. This is where your creativity can truly flourish because you can work in the tiniest of details. If a child presses a thumbnail, have fireworks fly out behind it. Add a little flare when scrolling through titles with patterns and 3D animations. Heck, even coming across an error can be fun. Bring error pages to life to lighten up the bad news that ‘something isn’t working’.

Cartoon Network is a great example of an app full of delightful experiences.

 

Designing a TV App for Kids _ error

 

Designing a TV App for Kids _ onboarding

 

Designing a TV App for Kids _ scroll

 

The More You Know

Designing a TV app for kids is a rewarding and equally as challenging experience. It requires a complete shift in thinking as many things that work for adults will not work for children. While every app will be different, the four main takeaways that can be applied to every kids TV app are:

  1. Children are (excited) visual learners:
    • Incorporate bold, colorful images to inject energy into the app.
    • Don’t be afraid to experiment with color palettes and shapes.
    • Make sure your images are large enough to catch the misfires of excited, little fingers.
    • Keep the UX clean and simple as to not distract from what’s important.
  2. Let your design do the talking:
    • Reading comprehension varies at such a young age–stick to visual cues to inform the user.
    • Make it known what can and can’t be pressed
    • Visually subdue the baby gate to protect settings
  3. Entertain and educate
    • Stick to skeuomorphic design to establish connections between online and offline objects
    • Design objects to mimic real-life counterparts so children know their purpose, ultimately easing the communication gap between parent and child
  4. Be the gift that keeps on giving
    • Don’t make the app boring! Hide Easter eggs and micro-moments for a child to discover. Just for fun.

In a nutshell, don’t let the content be the only form of entertainment. Make the entire interface something to marvel at. Experience is the name of the game and it’s a lesson that should be applied to every user group, regardless of age. A good user experience is universal. It demands a firm understanding of a target group and the ability to personalize moments to cater to them.

Thanks for reading!

Did you like that post? Here’s something similar we think you’ll enjoy.