Firefox OS for TV: UX Overview

https://blog.mozilla.org/ux/2015/04/firefox-os-for-tv-ux-overview/

by Fudgel • 11 years ago

124 65 11 years ago

blog.mozilla.org

I hope someone can save us from the "grid of icons" UI that pervades set-top boxes. The grid works fine for handheld/desktop applications where access is non-sequential, but when we're using just directional arrows, that's a lot of tedious button pressing.

Traditional TV service has the advantage of shortcuts by way of being able to jump to a channel directly using the number pad, but the top set-top boxes don't have that affordance because they generally lack number pads.

kaolinite2• 11 years ago

I feel that the grid of icons works great for the TV but the problem is the unimaginative remote control. Instead of a plastic remote with arrow buttons, a better solution is using a phone or tablet which shows a UI based on what is on the screen. You tap through apps on the phone and pick what you want to watch. Then, you hit play and it starts showing on the screen.

TVs aren't really great for interacting with - so a better approach is not to interact with them at all and do the interaction on a different, closer touch device.

paganel• 11 years ago

a better solution is using a phone or tablet which shows a UI based on what is on the screen. You tap through apps on the phone and pick what you want to watch. Then, you hit play and it starts showing on the screen.

This might be the former TV-addict in me speaking, but would you be able to change channels and adjust the volume without taking your eyes off the TV screen? Because remote controls in their present form are just perfect for that, and have been since at least 20-30 years. In other words, don't get rid of physical buttons unless you really, really need to.

anonymfus• 11 years ago

Smartglass for Xbox One can control television (USB TV tuner, HDMI CEC commands for set-top box on One's HDMI input or infrared commands via Kinect's IR blaster or separate IR blaster) as you describe.

untog• 11 years ago

The battery life on that would be awful, though. I can use my remote without looking at it or needing to charge it for months upon months on end.

Yhippa• 11 years ago

This sounds awfully similar to Chromecast.

zippergz• 11 years ago

I think this is something that's better on paper than in practice. I have apps for controlling almost everything that happens on my TV, and the only time I prefer it is when I need to type in some long string of text. Otherwise I'll pick up the hardware remote every time.

hansjorg• 11 years ago

Samsung has solved this with their Smart Remote [1] which is a kind of hybrid between a normal remote and a mouse.

I've only tried it in passing, but it's definitely a big step up from the standard remote.

1: http://www.cnet.com/news/samsung-smart-remote-hands-on-with-...

mikeryan3• 11 years ago

Its not the lack of number pads, its the lack of "numbers" for the content.

yellowapple4• 11 years ago

It's both, really.

I personally use a wireless mouse with a trackball on the PC running my living room TV (Slackware, XBMC); previously some generic Chinese handheld, but now I use a Logitech M570 (which is what I also use on most of my desktops). Works much better than having to mash directional buttons all the time.

dangrossman2• 11 years ago

Samsung and LG smart TVs both come with what's essentially a Wiimote as a remote control. It's a motion sensor that controls a pointer on the screen like a mouse.

http://i.imgur.com/XEn3vBk.jpg

Note the overlay over the TV image, and the salmon colored pointer near the vudu icon. No grid and no directional arrows.

danudey2• 11 years ago

A friend of mine has an LG Smart TV with one of these things, and it's completely awful. When he was staying with us for a week and realized that my remote would control his TV, he immediately went and bought one off the internet so he wouldn't have to use it.

cpeterso• 11 years ago

I read (but can't find the article now) about the internal fights about LG smart TV UI. The webOS team created the simple UI that shipped. LG's design teams hated it because they had bonus incentives such that managers would get bigger bonuses the more widgets their teams shipped. The webOS design won mostly because it was done in time for CES. I think there are some good product lessons there. :)

leppr• 11 years ago

Looking at the image and assuming a similar level of precision as the Wiimote, it looks like it would be hard to quickly land your cursor on the right 'ribbon' and I would much rather have a grid with big, easy to click on tiles.

On the other hand that stylish ribbon design looks like it would work well with directional arrows, 1 right for Netflix, 2 left for CinemaNow, quickly gets into your muscle memory.

mkesper• 11 years ago

Please do not include several images > 1MB in your posts. Ever thought of mobile users?

billyhoffman• 11 years ago

Indeed. The problem is they are saving photographic data as PNGs instead of JPEGs. I wish more CMS's had a "Are you sure about this?" dialog when giant, improperly sized, or unoptimized images get uploaded

DanBC3• 11 years ago

It's kind of surprising to see people at Mozilla make this mistake. They're targeting low end systems and so you'd think they are expert in image optimizing systems for all those people on limited 2g and 3g Internet.

Brakenshire• 11 years ago

My flat screen TV seems to pick up about a second of latency every three months, it now takes about 12 seconds to load up the programme guide. I'd really like if it had proper OS that could be updated, reinstalled, and extended, rather than something cobbled together and frozen in time. Smart TVs are basically computers so they might as well have decent operating systems.

kaolinite2• 11 years ago

I bought my TV just before smart TVs became popular and am dreading having to replace it, with - from what I can tell - all of the good, high end TVs now being "smart".

I really wish the trend was TVs becoming less smart, more like a monitor than a computer, especially now that TV "pucks" like Apple TV, Roku, etc are gaining popularity.

josefresco• 11 years ago

Bought a smart TV (not exactly on purpose, just wanted a new TV) - ended up being quite happy with built in support for Netflix as it means one less "box" in my living room.

the_mitsuhiko• 11 years ago

I really wish the trend was TVs becoming less smart

How so? Ever since I switched to a Smart TV I pretty much removed all other boxes that were standing around. My Samsung solves all the problems I had separate boxes for before. The only thing that is still connected is a PS4.

semi-extrinsic• 11 years ago

My 2012 Smart TV (Panasonic 50ST50) is just like it was when I bought it. Most apps like youtube etc. have been updated, and some apps are a bit slower in the newer versions due to more flashy animations, but overall it's been rock stable and I see no reason to upgrade.

matthewmcg• 11 years ago

Not to mention that Panasonic stopped making plasmas and you'd probably find the black level performance of all but the most expensive LCD sets disappointing.

jonathansizz2• 11 years ago

While it wasn't difficult to understand what the author was trying to say, I found this post jarring to read.

Surely Mozilla have native English speakers who can at least edit their blog posts? Anything that goes out to the public affects Mozilla's reputation, and should therefore be taken seriously.

roxmon• 11 years ago

Agree 100%. The first line:

Firefox OS for TV is a new direction that base on the vision of Connected Home from Mozilla.

I mean, c'mon. It's hard to take the post seriously when they didn't even bother to proof-read.

CWuestefeld3• 11 years ago

Actually, there are parts of the essay that I am finding difficult to understand.

callahad2• 11 years ago

Surely Mozilla have native English speakers who can at least edit their blog posts?

Certainly, but we also try to let teams and individuals operate fairly autonomously, and I believe our open, honest humanity is one of our greatest strengths as both a global community and as a company.

Let's put this in context, though: This isn't a press release, nor is https://blog.mozilla.org/ux/ a press channel. Rather, it's someone openly sharing the UX team's ongoing work on their team blog, much the same as you'll find at https://blog.mozilla.org/creative/ or https://blog.mozilla.org/services/. Could Shiqi's posts have used a pass by a native English speaker? Certainly. But I'm happy to be part of an organization that shares openly at the occasional cost of mistranslations.

Plus, I'm sure the UX team will learn from this and adjust their review process accordingly. :)

jonathansizz2• 11 years ago

It's great that you encourage your team to communicate with the outside world, but that communication would be more effective in this case if it had been edited (and I mean edited - thanks for keeping the marketing department out of it). It looks like all your blogs combined have only a few posts per month, so this shouldn't be a particularly onerous task.

Keep up the good work.

hackuser• 11 years ago

I think you make some excellent points, but I'd like to share some perspective from the outside (and from someone who strongly supports Mozilla and its mission):

Let's put this in context, though: This isn't a press release, nor is https://blog.mozilla.org/ux/ a press channel.

That distinction may be well known internally, but nobody else knows or cares to learn about it; we're going to base our judgement on impressions: The page says "Mozilla UX" in big letters at top and it's on the mozilla.org domain; to me and I suspect to almost everyone else outside Mozilla, it's official Mozilla communication.

striking• 11 years ago

The UI is (almost) just like any other on a Smart TV. Okay. Strikes me as somewhat unimaginative.

Also, the Dashboard is a separate app. Like, um, in a car, right? Just like the radio and temperature controls are away from the user, so they have to look away from the road (their focus) to access it, right? Right.

What this UX actually needs, instead of being an app menu that can access TV or whatever, is TV-centric design. It needs a focus. Provide a viewport that apps can draw to, and allow switching of apps without having to "look away" from the content.

Folder tabs? Search? (Please don't add a) favorites menu? They're all acceptable ways to provide apps to users, but this is none of them.

You must be forgetting that most people use TVs for the video content. I'm not saying "oh, get rid of YouTube and Netflix," I'm saying "constrain yourself to video output because no one really cares about the web on a TV box." Yeah, cool, you can go to webpages that have totally broken design and are totally illegible on TV (hi, HN!). I mean, an RSS reader makes sense, because then the TV (and thus, the user) has control of how the content's displayed. But "FF on TV" sounds like a really bad idea to me, because the Web sucks on anything that isn't a computer.

The usage of applications on smart TV is getting huge, and it needs an re-framing of the UI structure to make the application as important as TV channels, and as input sources.

No, it isn't. No, it doesn't. Unless you mean you're going to make my Netflix another channel just like Fox News, which would be pretty nice. But that differs in the fact that Netflix is a video focused application that acts a lot like a channel or something. But that means you had better add a unified UI for video playback. Netflix and YouTube and everything should share the same UI widgets.

A dashboard that can be activated on command is cute and can possibly be a good idea. Like, maybe show it for a moment during that period where the TV is adjusting to a new signal or something to allow the user to peek at it by default so they can see alerts ("hey, Hillary Clinton's running for Pres! I need to pull up the CNN Channel!"), and then allow them to later press a button to show a dashboard that doesn't force them out of their content. But if you push them out of the content, the illusion is broken. It's no longer a TV, it's a computer. A big, complicated computer, with lots of little nodes in its huge and complex menu. And only us nerds want that, because us nerds like intricate and complex things. (there's nothing wrong with catering to nerds, but I don't think that this is supposed to be directed towards them, because they could just as easily grab a Raspberry Pi and load up XBMC on it without having to invent their own new flavor of Linux)

PS: adding a focus means your UI will be necessarily shallow. It will force you to get creative when you want to get complex in writing a good UI. Snapchat, for example, has a focus on the camera. Swipe from the left, you get your incoming Snaps. Swipe from the right, you get your Stories. Swipe from the top to see stuff about you and your settings. And that's the extent to which anyone uses Snapchat.

CWuestefeld3• 11 years ago

I agree that this is disappointingly unimaginative.

Unless you mean you're going to make my Netflix another channel just like Fox News, which would be pretty nice. But that differs in the fact that Netflix is a video focused application that acts a lot like a channel or something. But that means you had better add a unified UI for video playback. Netflix and YouTube and everything should share the same UI widgets.

I think that's a big part of it. The distinct between "channels" and "apps" is artificial. On my Roku, most of the "channels" can be interacted with in at least some way, making it difficult to draw a line.

Most channels on Roku are offering on-demand features, and you interact with the channel to locate a feature. The Weather Underground channel has controls allowing search for locations, and viewing maps and radar. Some really big things, like Tablo, include features for programming recording; and Plex is pretty much everything but the kitchen sink.

I think if they saw that the apps/channels distinction is artificial, the rest of the design would collapse into a bunch of irrelevancies, and they'd be forced to confront the question for real.

justaman• 11 years ago

First person to use a Duck Hunt zapper to control the UI wins a cookie.

Its an annoyance to repeatedly use arrow keys on remotes.

anonbanker• 11 years ago

NES controller input has been part of the Linux kernel since at least 2000 (thanks to Vojtech Pavlik of SuSE), so most of the heavy lifting is already completed. Input was originally added (according to the mailing list) to support the NES Power Glove as a mouse input.

digi_owl• 11 years ago

Would be hard, as the old zapper was designed around how CRT was updated/refreshed. As such they basically don't work on a flat panel.

jbk2• 11 years ago

First, I fail to see the difference with the UX of the other smart TVs.

But mostly, as it is still Firefox OS, I don't see how people will be able to do cool multimedia applications, without access to native code and threads. Implementing DLNA, SMB, AFP shares, listening to network devices, hardware decoding, perfect audio/video synchronization requires threads and probably native code.

Limiting to HTML5 videos is going to be a very light. Or they will re-implement all the media center and multimedia code themselves, supporting all codecs and formats (and subtitles)?

I could somehow understand the limitation on the phone, but on a TV, multimedia playback is the massive use case.

mikeryan3• 11 years ago

Limiting to HTML5 videos is going to be a very light. Or they will re-implement all the media center and multimedia code themselves, supporting all codecs and formats (and subtitles)?

Generally on Smart TV's the video decoding isn't handled by the browser/render, instead handled by the underlying media player and hardware decoder. Pretty much all the TVs (Samsung, LG etc) use HTML5 video with much wider support for codecs then you see in browsers. HLS/H.264 is commonly supported.

Similarly they tend to use mechanisms such as custom plugins and JavaScript interfaces for DLNA/SMB etc. Not sure why you need threads in particular, there's already a lot of JavaScript mechanisms (events, async calls) to support these types of features.

jbk2• 11 years ago

All the TVs are moving to native SDKs, in order to have good games and good multimedia apps. This is true of Samsung, Sony and LG. Games on Firefox OS are a joke.

If you want extra codecs, media players or media center, you need to write them in native.

listic• 11 years ago

I wonder if Mozilla is in communication with Matchstick.tv developers? http://www.matchstick.tv/ https://www.kickstarter.com/projects/matchstick/matchstick-t...

Matchstick developers have gathered quite a lot of support for their croudfunding campaign, by promising an open software and hardware TV streaming stick due this February, and for a low price ($16+). Then, come February, they pissed off the vast majority of their supporters by suddenly announcing the 6-month delay in favor of things like hardware upgrade and DRM support, which none of their backers actually asked for. If it turns out that they were not in communication with Mozilla and their vision for Firefox OS TV's is incoherent with Mozilla's, then this project will truly end up a poor application of users' money and trust, bordering on a scam. Actually, a lot of supporters have lost faith in crowdfunding, and, presumably, Firefox OS, as it is; demanding their money back - not that Kickstarter supports it, after the project's been funded.

jdboyd• 11 years ago

Their backers may not have asked for DRM support, but they did ask for supporting services that require DRM, such as Netflix.

I participated in the kickstarter. What I am interested in is less a physical product and more an open platform, but I suspect we won't actually be getting that.

Caspy7• 11 years ago

The DRM is being implemented via EME which is a sandboxed* plugin that's invoked by the app. If you don't use it you don't get it. There is no monitoring or reaching into other parts of the app or OS. Firefox (the desktop browser) allows you to disable the EME (which also deletes the plugin). This would be expected behavior on Firefox OS as well.

You seemed to indicate that the DRM addition would make it not an open platform so though I'd share that as it still seems like a potentially positive situation.

*at least in Firefox

lighthawk2• 11 years ago

It looks good, and don't want to shoot down the UI, but here are some suggestions:

In regard to pictures 4 and 5, Roku tried the fully horizontal menu for a while, but wasn't great. It's too limiting. Think about using a vertical left and a grid right like they do. It fits more and given the right control, works pretty well to navigate, even if it isn't the prettiest.

And, if you only do one thing, remember the rule of simplification and reduce the number of visual elements required to convey the same information. Examples...

In picture 6, you shouldn't need icons strawn about the window left, right, and bottom. All kinds of space wasted for no apparent reason.

In picture 7, just say no to the advertisement looking things in the top bar and the useless title and description at top. If you must get their attention, make them go through a screen to have full attention on your singular announcement. Don't make noise.

In picture 8, having the blue under each black and white icon is a little distracting, and the text and icons have features too small to read or recognize easily.

mikeryan3• 11 years ago

Think about using a vertical left and a grid right like they do. It fits more and given the right control, works pretty well to navigate, even if it isn't the prettiest.

While grids are nice they have a problem. They're great at navigating two dimensions but they aren't easy to get out of. Where do you put the settings and search buttons? Do I have to scroll through all the categories (like netflix does) to get to search?

Similarly how do you do subcategories?

This system actually solves both of those problems. What it lacks is information density. Something like this linking _into_ a grid could work.

Note I say this while our company that does this developed an app with this exact navigation scheme for Comcast cable boxes.

http://adifferentengine.com/cases/sochi/

But we had a very strict set of content so we knew it would work for our use case.

lighthawk2• 11 years ago

Where do you put the settings and search buttons?

My opinion:

1. They go on the remote controller itself as magnifying glass and gear buttons, if you have that luxury. If there is no UI pointer, there is no need to provide anything else.

2. If you have a UI pointer, icons (gear, magnifying glass) or word links (settings, search), upper-right is most intuitive but lower-right may work also.

linuxlefty• 11 years ago

The link is now returning a "Not Found" error. Google cache link for those interested: https://webcache.googleusercontent.com/search?q=cache:https%...

yohui• 11 years ago

I archived the page: https://web.archive.org/web/20150504173515/https://blog.mozi...

callahad2• 11 years ago

Looks like it's back up, but with new and improved English copy-editing. :)

yellowapple4• 11 years ago

What's the feasibility of getting this variety of Firefox OS / B2G running directly on real hardware either now or in the near future? Ubuntu for TVs ended up being miscarried because Canonical didn't provide anything prospective hardware developers could easily download, build, and deploy to prototype hardware (and end users / software developers couldn't do the same with COTS hardware), and it would be a shame if the same happened to this for the same exact reasons. It looks like there's already the ability to run it in an emulator (with some custom make flags for Gaia), which is a start, but the ability to, say, pack this into an ISO or USB image and boot it on an ordinary HTPC would make for a really compelling home media platform and probably drive implementation rather significantly (rather unlike what happened to the TV variant of Ubuntu).

Firefox OS for TV: UX Overview

Related Stories