Intelligent TV user experience design sharing remote Control chapter

Today, please be responsible for the smart TV app design 1.5 @ Bu Carrot 1992 to share some practical design experience, the basic knowledge of popular science intelligent TV user experience. To continue to explore the question, this article on the remote control.

The one with the big buttons on it. In the era of internet television has no place, now no matter what brand of TV, its remote control has the necessary 8 keys: up/down/left/right/OK/return/menu/home. General manufacturers will have their own separate shortcut keys, le-Le key, the Storm TV has Biu key, Konka has called Bar key. The volume plus subtraction Key general remote control will also have, channel addition and subtraction is also more common. This article is mainly about 8 buttons of the common function, to design a good TV-side app, be sure to make full use of the remote control button, at the same time, when the button design function should also consider the operating habits based on the Android system. Because the domestic TV OS is a big Android, and a lot of users who have no experience in the use of smart TV, his knowledge of television operation is between the mobile phone and the traditional TV, so that the user's fastest way to get started is that the operation of the television to meet the habit of Android also to meet the traditional TV habit.

Take a look at the latest version of the Philharmonic and Storm TV remote:

Now let's start with the key:

　　Homepage Key (Home)

is to pull up the homepage launcher.

As for this launcher is what, that is different from each family, look at the suspension of the home page, Ali box of the suspension of the home, Konka YIUI 5.0 of the suspension of the homepage, these floating homepage in the spirit of not blocking the viewing content of the design concept, seemingly very popular. Then look at the storm TV and millet launcher, is quietly full screen interface, the main interface of the Storm TV, especially Meimei, but also led the painting. If the launcher of each family are analyzed again, that is an article, you can open a special topic. As for the suspension or full-screen, each have their own preferences, imagine who will be in the home page browsing content when still looking at the back of the playback content? It's not two to use! However, the outgoing suspension of the home page makes people feel that there is no left the interface, there is a sense of stability, visual is richer.

　　menu keys (menus)

The equivalent of the computer's right mouse button, can plug what you want to plug in the inside, reasonable use of menu keys allows you to operate more smoothly, but need to pay attention to the use of scenes and the consistency of the content, can not be confused with the logical and also have obvious visual cues, to guide the user to invoke the function of the menu key.

Here are some TV OS and TV-side mainstream app apps for menu keys:

In the main interface of the Millet TV menu, bring up the homepage editing mode, you can order the main page of the app. Here I am very curious, since the menu has only one function, then why do I have to set a level menu, directly press the menu key to edit mode is not OK? Does this not now increase the complexity of the operation? You can see the main page of millet for you to provide the application of the grouping function, which is a basic function on the phone, But is this a big demand on TV? Because this is an operation involving TV input, and it takes a lot of steps to implement grouping.

There are a lot of similar, the simple basic function of the mobile phone to transplant to the television but become complex, for such a function, in the need to focus on the time to do, I did not find on the AppleTV box on the group function, Apple only to maintain the remote control can do simple basic operation. So the problem again, the home page does not provide the group function on the app, that app too much to find how to do? How to manage applications and the main interface?...... And then the question goes, is it okay to show the app on the main screen? Is it suitable for TV? Have you found that the application of the mobile End touch screen operation of the Android system, when applied to the television, many basic operations are no longer applicable. This really needs to be considered. What kind of experience does our television have to create to meet the needs of the general public and how well the expert users are to be satisfied, when the whole concept of the product is born, and most UX designers have no chance to participate in the product concept period decision. Always feel that the real user-centric products, at all stages of the product must have a experience of the big guy to control, and not other "BOSS", otherwise the so-called care users, is just an apparent.

(A little digress, go back to the menu key!)

The above picture is the launcher of the Storm TV, press the menu key to pull out is more operation interface entrance. Because the storm TV product concept in the birth, on the spirit of "for the view of the shadow and born" to the focus of the product positioning, so the entire TV system functions and operations to keep the simplicity as far as possible. But if the function is too small to operate too simple, and will be too stupid to lose a part of the user, here my idea is: Basic skills must be simple to render, the default settings must meet most users, and advanced function/complex operation to hide deep enough, will not affect the "fool" operation.

This is when the beta screenshot of the market, the menu key hides all categories, and there are text prompts to pull out the menu function. The functionality that is included in the menu key, if it is more important, affects what the user is looking for, suggested that the page text prompts, and similar to the Millet desktop management applications such functions, not important and complex operation, it is recommended not to give a text hint, let him hide deep some, so that not expert users can not find, is a better practice.

Video playback class of the Big app is not an example to say, nothing more than a number of episodes, Ah, clarity, such as adjustment options. Of course, some of the app refused to use menu keys, such as QQ music TV version, perhaps the spirit of all the features should be seen by the user, but add a shortcut key to the music list is understandable Ah, the province to move a half-day focus to the "Play List" button on the Kungfu! Notice here, too, In an app, try to keep the consistency of the menu key functions, do not in a plate is the play list, and in another section is the set up options, since the pursuit of logic integrity beautiful, do not cause cognitive confusion to users, it is perfect, designers still have a bit of Virgo's pursuit!

In short, the use of menu keys has become a trend, reasonable use of menu keys, will make your app more flexible and useful.

(Note: In the mobile phone industry, Android's menu key has faded away.) Because there is no way to tell the user whether a application can use the function of the menu key, and many manufacturers have no menu physical button on the phone. But on TV and remote control there is no such problem, because since ancient times, the remote control has been the menu button and has not been removed trend. )

　　Ok (OK)/return (back)

On the common features of these two buttons, not much to say about the Android system back key of the traditional controversy, also does not belong to the scope of this article, on the TV's key and return key to the special application scenario, I would like to use the following case to express.

When we watch the video with the player on the computer, the right mouse button can find various mediation options, which are also the necessary mediation options for professional playback equipment. Although the complex mediation menu can be three level four so deep, the operation is not convenient, but still must have! Then let's optimize its operating experience.

The picture above is the Millet television video playback interface, presses the menu key to pull up the level menu Figure 1 to adjust, focus on the Play Settings button point [OK] or [right] key, bring up the level two menu Figure 2, at this time, the [back] and [left] key, two-level menu will be back to Figure 1, continue to press [OK] or [left] key, Then bring up the level three menu as shown in Figure 3, at which point the focus is in the semi selected state (described in the previous article) focus on "motion mode" by pressing [OK], changes are made, changes are made again and there is no response, press [Return] or [left], and the level three menu is returned to Figure 2. In Figure 2 The interface can continue to enter the other level three menu, or continue to press [return] or [left] key to go back to the first level menu.

Let's straighten out the functions of each key in this process:

OK key: Pull down menu + Execute change + no response

Return key: This level menu is closed

Left: This level of the menu is closed

Right-click: Expand Downlevel Menu

A lot of people to determine the key "no response" this function, in the first contact when confused, some users of the direct response is "I adjusted the finished, I press OK, you put all the menu to me hide Ah!" Still delaying me to watch TV so many times I guess the disappearing menu! " If we meet the needs of this part of the user in the design, then there will be another group of users jumped out to say, "I finally brought up a menu, I adjust the" image mode "and to adjust the" Dolby sound effect ", how do you put the menu all to me to collect it! You have this [OK key] to expand the subordinate menu, It's all over the menu again. In this case, we need to return to the menu to pull out the basic goal of the operation. The goal of the menu is to adjust settings, this time the shadow has become a secondary goal, since the adjustment is the main purpose of the menu, the gradual disappearance of the menus is also extremely reasonable, and the first user needs is more vexatious. The person who makes the product, needs to have enough sensitivity to the demand, cannot what kind of demand all go to satisfy.

So we give [OK] and [return] set specific scene jump, should carefully consider, ensure the operation is reasonable without losing fluency. I have focused on the focus (get focus and execute) and the "semi-checked (get focus is not expanded)" and "OK" and "return" of the remote control so thin, this is because it really affects the fluency of the user's operation and is also the cognitive error area of the interaction personnel and the program developers. Every press button on the remote, must have the corresponding program feedback, and interactive designers in the interactive manuscript, but often forget to note the key should be corresponding to the operation, when the product flow to the test link, if the tester's consciousness and the programmer's consciousness is consistent, then there will be no problem is proposed, If not on the back to ask questions, to the interactive confirmation, at this time there will be the awareness of the interaction, the consciousness of the program personnel, the consciousness of the tester three not put into the exact language of the "debate on the consciousness", ohh~my God, you are saying what can explain the white point? Think of this discussion scene to feel the collapse ...

Finish the menu key, only "up/down/left/right". Their general function is to move the focus up or down. Non-conventional features one to say.

On: From the top of the interface menu-corresponding scene: Some video player's progress bar is on the top of the screen, when the key can trigger; similar to the Drop-down function of the top menu of the phone, press the key to call up more settings

Expand Menu ————— Corresponding scene: When the child menu is displayed from the top of the parent menu, this quick operation makes the person's fingers and eyes correspond to the operation more smoothly.

The menu ————— corresponding scene: When the child menu is below the parent menu, it needs to be closed.

Perform content changes (get focus to execute focus state)

Under: From the bottom of the interface menu-corresponding scene: Some of the interface of the toolbar is in the bottom of the interface, when the key can be triggered; similar to the Apple Phone bottom menu pull up function, press the key to pull more settings

Expand the menu, close the menu, and perform the change with the [top] key analogy echoes.

Left/right: function with up/down key analogy echoes.

This article is only about the remote control basic key to the interaction, as for touch pad and other new operations, each manufacturer equipment, the use of methods and scenes are not the same, there is no way to unify the explanation, but can correspond to the eight basic button function above. There is also a need to consider using the mouse to operate the TV without the remote control, at that time [mouse left]=[OK key],[mouse right]=[return key],menu key interface on the support of the click, no hint, at present do not know the corresponding specific methods, may be used [in the mouse] to correspond, But after all, using the mouse to operate the TV is rarely very exotic, later confirmed that I will update the relevant content.