default thumbnail

My TV Channel Guide UI

This post is unfinished. I published it anyway because I believe it still has some value. On the bright side, it'll probably be short! 😇
(comment or contact me to request an update about its subject matter)

Consumers are already doing their very best to go around the terrible UI we get from cable and satellite providers. We buy things like Roku, Chromecast, Apple TV, or video game systems to avoid using those clunky channel guide uis. If any of those television service providers actually cared about the experience their customers are having, they could easily avert this.

Today’s User Interfaces

All of these screenshots are as high-res as I could find them. These are the channel guides for their “HD” services. In general, I tried to find the best-looking shots I could for them.

This is what Comcast’s channel guide UI looks like:

Comcast (Xfinity)'s Channel Guide UI

Time Warner Cable’s guide is almost exactly the same.

Time Warner Cable's Channel Guide UI

DirecTV:

DirecTV Channel Guide UI

Dish Network:

Dish Network Hopper Channel Guide UI

Channel IDs

I like the examples where the channel logos are displayed. When all they use are 4 capital letters/numbers to show you what channel #XXXX is, I have to guess what the channel is based on what shows they’re playing.

Viewing Window

I understand why the video is still shown on the corner while browsing the channels, but I wonder if it’s worth the ‘real estate’ on the screen. I’ll leave this feature in my version of the channel guide UI, but its usefulness is still something I’m debating.

Responsiveness

I haven’t used a Time Warner cable box, but I have used the others. All of them have a delay between when a button is pressed and when the channel guide UI actually responds. Some of them are only a half second or so, but a few (usually satellite providers’) can delay for 2-3 seconds per button press. For me, this is incredibly frustrating when you have to scroll through 800+ channels.

Paralysis of Choice

When I have cable, the first thing I do after installing my cable box is try to filter out all the garbage channels from my guide. Anyone with digital cable these days has at least 500 channels, and I only watch maybe 25 of them. Many of them don’t even work without changing my cable subscription, but they show them anyway to try to upsell us into pay-per-view, premium channels, music channels, sports channels, etc. My goal is to try to use the extremely cruddy UI to hide all those channels, plus channels I will never like (E!, TruTV, Lifetime, Fox News, etc.) and thus greatly reduce my browsing time for the life of the cable box. This sometimes takes me over an hour depending on how bad the responsiveness of the remote is.

The Guide Button

What do you want when you press the ‘Guide’ button on your remote? In my own usage, I estimate this:

Why I Press the Guide Button on my TV Remote

Why do you press the Guide button? Leave a comment below if your usage is different, because I’d love to update my ideas about this. I realize that I’m not a traditional couch potato. Because I’m designing this UI for the way I watch, I’m going to proceed using the above chart as reference.

That doesn’t mean I won’t account for other people of course. For example, I will still include a way for users to see a schedule-style channel guide despite the fact that I rarely (and decreasingly) watch shows when they’re live. I will still take measures to account for channel surfers that take more of a browsing approach. I will include parental controls even though I’m not a parent.

My Channel Guide UI

[HOME SCREEN – New User]

Influences: YouTube, Twitch.tv, Google Play

You can Subscribe to a Channel for a monthly rate that the channel owner sets as they desire. Like YouTube, anyone can setup a channel of their own but must own the rights to all content they post on it. Channel owners can pay my company to be featured prominently on the “Home” screen above, but every channel is searchable.

[CHANNEL DETAIL SCREEN] –
Resolution [480p, 1080i, 2560, etc.]
Live [Always, Sometimes, Never]
Commercials [yes/no]
Do you have this channel? If not, price and subscribe now button.
Average Channel Content Rating
0-5 Star reviews

Influences: YouTube, Twitch.tv, Amazon Instant Video

Resolution is displayed based on standardized widths in pixels. All channels are required to meet a minimum resolution standard. This will start out as 480p most likely and increase over time depending on market share for hi-res devices. Channel owners are able to customize how they tier their services and pricing.

[SERIES DETAIL SCREEN] –
Resolution [480p, 1080i, 2560, etc.]
Commercials [yes/no]
Do you have on demand access to this show? If not, price and buy now button.
Content Rating
0-5 Star reviews
Original Air Date
Seasons, Episodes

All on demand content is streamed if possible. If that’s not possible, a shared cloud-based storage method would be used (similar to iTunes). The final fallback is an on-board [1TB] DVR.

[EPISODE/MOVIE DETAIL SCREEN] –
Resolution [480p, 1080i, 2560, etc.]
Commercials [yes/no]
Do you have on demand access to this episode/movie? If not, price and buy now button.
Content Rating
0-5 Star reviews
Original Air Date

[PARENTAL CONTROLS SCREEN]
Up to [4] Passwords with Unique Permissions
Max Content Rating Allowed w/ Which Password?
Allowed to Spend $0-* per week w/ each Password?
(use Breaking Bad family members names: Walt, Flynn, Skyler, Holly)

Influences: Netflix

Users can setup permissions and passwords for up to [4] of their household members. Users can assign names to the permission levels for easy reference but the system will only ask for a password, not a username. Attempting to assign a password that matches an existing one will prompt an error message and ask for them to retry with a new password. Only a primary account holder can manage these permission levels, and they can do so online if they are away from their television or prefer that method.

When a user has parental controls turned on, the system will assume the minimum permissions level of all users on the device. When the user attempts to watch a show or make a purchase above their permission level, they get a password prompt. After logging in, the system will not re-prompt for a password again until the user logs out or turns off the device.

[LIVE CHANNELS SCREEN]
Schedule-based listing.
Offline channels are not displayed.

In-Guide Purchases

The channel guide UI uses ‘apps’ to allow users to sync their Amazon/iTunes/Google Play/Steam/Netflix/etc. accounts with their device. These apps are able to modify the appearance and behavior of the guide, so these apps are more like browser plug-ins than individual apps you might run on your tablet or Xbox One.

Suggestions Widget

Instead of an obvious advertisement banner, we have a widget we can display to suggest new shows, channels, premium content, etc. to users based on their behavior (favorites, reviews, subscriptions, popularity). This widget can prioritize paid content (like HBO for example) if desired.

The Remote

I want a simple but versatile remote.

[REMOTE]
Power
Directional Buttons
Enter/Continue/Yes
Cancel/Back/No
Login/Logout
“Tab” – Cycle between windows/frames
Settings
Apps Store
Branded “Wiggly” Button
Tactile Design (user shouldn’t have to look down at their remote for everyday use)

The ‘Wiggly’ Button is a catch-all button for special actions. It is “set aside” for any wild card actions we may want to allow the user to take. An example might be “Press Wiggly to vote for this American Idol contestant” or “Press Wiggly to skip this commercial” (like YouTube).

I tried to make the remote easy to use without looking down at the buttons. Each button should be fairly easy to recognize using only touch.

I considered using a system similar to a Wii Remote — where you could point it at the screen and use it like a mouse — but I’ve found that usage to be annoying and tiresome.

The Xbox Kinect uses very cool voice and gesture controls that I’ve really been enjoying. As much as I like it, it would likely push the price of the device substantially higher, be redundant in the market, and require more setup. Plus, anyone that owns a Wii and a Kinect already has two sensor devices on their entertainment center.

Instead, I think I’d create supplemental apps for Kinect and Wii based systems for people that prefer that method but still want to use our services. I would also duplicate this UI nearly exactly on my provider website and on an app for tablets and mobile devices. I don’t care how people use my system as long as they buy stuff with it.

In Closing…

I’m really excited about how B2C media distribution is changing. I hope that all the healthy competition we see today between Hulu, Netflix, Amazon, Google, Apple, and other companies continues. It is a much healthier ecosystem than the one occupied by Comcast and… well… pretty soon that will be it.

I hope you guys enjoyed reading about my ideas. Let me know what you think in the comments!