From ea7a71b25d9d89dccc823df530dceb389a145cda Mon Sep 17 00:00:00 2001
From: Scott Rowe
To learn more about searching within your app, see Searching within TV Apps. -
The recommendations row on Android TV is a central feature of the Home Screen that allows
users quick access to dynamic and relevant content for their media-consumption activities. The
diff --git a/docs/html/design/tv/patterns.jd b/docs/html/design/tv/patterns.jd
index be7ae319ac91d..e786ee5bc1909 100644
--- a/docs/html/design/tv/patterns.jd
+++ b/docs/html/design/tv/patterns.jd
@@ -15,24 +15,16 @@ page.title=UI Patterns for TV
-
A key aspect of making your application work well with a D-Pad controller is to make sure +
A key aspect of making your application work well with a D-pad controller is to make sure that there is always an object that is obviously in focus. Your app must clearly indicate what object is focused, so users can easily see what action they can take. Use scale, shadow brightness, opacity, animation or a combination of these attributes to help users see a focused object.
+Apps on TV devices require some additional icon images for presentation in the system - user interface, including home screen launcher images (banners) and recommendation icons. - The visual specifications for these icons are shown below.
- - -App Banners represent your app on the home screen of TV devices and serve and as a way for - users to launch your app. Here are specific requirements for a banner image: +
App Banners represent your app or game on the home screens of TV devices and serve and as a way for + users to launch your app. Here are the specific requirements for a banner image:
See Provide a home screen banner in Get Started with TV Apps for more information.
-Recommendation cards include a small icon that is imposed over a colored background. - An example and specifications for this icon are shown below:
+The first row of the Android TV home screen displays cards for content recommended by applications. +Your application provides these recommendations, as described in +. For a visual overview of recommendations, see +Design for Android TV.
-Here are the requirements for recommendation icons:
+The design elements of the recommendation card are as follows:
+The design specifications for these elements are described below.
+ +You can also set a background image (not shown) and the color of the card's text area in the + recommendation notification. See + Recommendations for more information.
+ +
+
+ The background image also appears behind the recommendations +row and fills the Android TV home screen when the user selects the recommendation card. This image +should be different than the one provided for the large icon, and meet the following specifications:
- Note: Your app icon image may be desaturated and blended for some card - displays. + Note: If the background image does not meet the size requirements, the system + scales it to fit.
- -Background images are displayed in the background of your app to provide additional visual
- interest, information, or branding. The user interface widgets provided in the v17 leanback support
+ The user interface widgets provided in the
+ v17 leanback support
library provide specific support for background images and for updating them as items gain
- and lose focus. The specific requirements for background images on TV devices is that they
- should be full color and a size of 1920 x 1080 pixels.
+ and lose focus.
- Important: Background images must not be transparent. Your must not allow any
- portion of another app to be seen through your app.
- Typically, the large icon is an image of the content for the recommendation. It appears
+above a colored area that contains the recommendation content title and text. This image should be
+different from that which you provide for the background image, and conform to the following
+specifications:
- Note: If you background image does not meet the size requirements, it is scaled
- to fit.
+ Note: If the large icon does not meet the size requirements, the system
+ scales it to fit.
Recommendation cards include a small icon that is imposed over a colored background. The icon and
+background color display at 100% opacity when the card is selected, and at 50% opacity when not
+selected. Here are the requirements for recommendation small icons: Sounds on Android TV bring a cinematic quality to the interaction experience. You should
diff --git a/docs/html/images/tv/recommend-card.png b/docs/html/images/tv/recommend-card.png
new file mode 100644
index 0000000000000000000000000000000000000000..1cc43114925f584a011470a5045e6efdceb1b0b8
GIT binary patch
literal 105512
zcmZ^}19T=)(=PhPw*AHv+cqYdaFRE+ZQHhOYvN>L+qSJqCdQfX|Nnc=xp%GGYjv;c
z>gTE2RlQg5>RLNO@rM)=JU%=C06>zF7FPxUz@YxgN3hWUu9_wLWdH!Yh=rJ#qKudr
zP|?xO)WX^X0FXw?Np(|IS;G#S>Eh~|MJEGNKHz)80q6Oou^^QqWc(GuLxZVY#i1lI
z(P-3+ReQmt!pMvyFcE?R4Oig)pehdcDTzxQZADwb-PCa0Z)bjtXzZ+=w63g~-T16@
z02JQ?A^V*{VE*g{Ak6EFK5cZ2iNPmuTvRY*5LoY?sVSt?vpD$TdzU~)M!EEGIcons
+
+Large icon
+
+
+
Small icon
+
+
+
+
+
+
Audio Feedback
Mp
zLWS^I{XAs}DZc1JiN}0flYA5Jy2&~-krY?)+d|UW&;!Y7*8`jhrHR(jw