1 page.title=Android TV 2 page.viewport_width=970 3 fullpage=true 4 no_footer_links=true 5 page.type=about 6 7 @jd:body 8 9 <style> 10 .fullpage>#footer, 11 #jd-content>.content-footer.wrap { 12 display:none; 13 } 14 </style> 15 16 17 <div class="landing-body-content"> 18 19 <div class="landing-hero-container"> 20 21 <div class="landing-section tv-hero"> 22 <div class="landing-hero-scrim"></div> 23 <div class="landing-hero-wrap"> 24 <div class="vertical-center-outer"> 25 <div class="vertical-center-inner"> 26 27 <div class="col-10"> 28 <div class="landing-section-header"> 29 <div class="landing-h1 hero">Android TV</div> 30 <div class="landing-subhead hero">Big screen apps, games, and content</div> 31 <div class="landing-hero-description"> 32 <p>Recommend great content to users right on the home screen. 33 Enable users to find movies through voice search. 34 Engage users with fluid, immersive games.</p> 35 </div> 36 </div> 37 38 <div class="landing-body"> 39 <a href="{@docRoot}training/tv/index.html" class="landing-button 40 landing-primary" style="margin-top: 40px;"> 41 Get Started 42 </a> 43 </div> 44 </div> 45 </div> 46 </div> 47 </div> <!-- end .wrap --> 48 <div class="landing-scroll-down-affordance"> 49 <a class="landing-down-arrow" href="#reimagine-your-app"> 50 <img src="{@docRoot}wear/images/carrot.png" alt="Scroll down to read more"> 51 </a> 52 </div> 53 </div> <!-- end .landing-section .landing-hero --> 54 55 <div class="landing-rest-of-page"> 56 57 <div class="landing-section" style="background-color:#f5f5f5" id="reimagine-your-app"> 58 <div class="wrap"> 59 60 <div class="landing-section-header"> 61 <div class="landing-h1">Reimagine Your App</div> 62 <div class="landing-subhead"> 63 Design your app to shine on the biggest screen in the house. 64 </div> 65 </div> 66 67 <div class="landing-body landing-align-center"> 68 <img src="{@docRoot}tv/images/atv-framed.png" alt="Android TV" > 69 <p>Simple. Cinematic. Beautiful.</p> 70 <p class="landing-small"> 71 Smooth, fast interactions are key to a successful TV app. Keep navigation simple 72 and light. <br>Bring your content forward to let users enjoy it with a minimum of 73 effort. 74 </p> 75 <p class="landing-small"> 76 <a href="{@docRoot}design/tv/index.html">Learn about design for TV</a> 77 </p> 78 </div> 79 80 </div> <!-- end .wrap --> 81 </div> <!-- end .landing-section --> 82 83 <div class="landing-section landing-gray-background"> 84 <div class="wrap"> 85 <div class="landing-section-header"> 86 <div class="landing-h1">Build to Entertain</div> 87 <div class="landing-subhead"> 88 Android TV lets you engage your users in a new, shared environment.<br> 89 Find out how to get your app ready for its big-screen debut. 90 </div> 91 </div> 92 93 94 <div class="landing-body"> 95 <div class="landing-breakout cols"> 96 97 <div class="col-3-wide"> 98 <img src="{@docRoot}tv/images/components.png" alt="TV layout components" 99 style="margin-left: 23px;"> 100 101 <p>Made for TV</p> 102 <p class="landing-small"> 103 Take advantage of pre-built fragments for browsing and interacting with media 104 catalogs. 105 </p> 106 <p class="landing-small"> 107 <a href="{@docRoot}training/tv/playback/index.html">Learn pre-built fragments</a> 108 </p> 109 </div> 110 111 <div class="col-3-wide"> 112 <img src="{@docRoot}tv/images/search.png" alt="Search" 113 style="margin-left: 23px;"> 114 115 <p>Get Found</p> 116 <p class="landing-small"> 117 Help users find your content quickly with in-app searching. 118 </p> 119 <p class="landing-small"> 120 <a href="{@docRoot}training/tv/discovery/in-app-search.html">Learn about app search</a> 121 </p> 122 </div> 123 124 <div class="col-3-wide"> 125 <img src="{@docRoot}tv/images/recommendations.png" alt="Recommendations" 126 style="margin-left: 23px;"> 127 128 <p>Recommend</p> 129 <p class="landing-small"> 130 Suggest content from your app to keep your users coming back. 131 </p> 132 <p class="landing-small"> 133 <a href="{@docRoot}training/tv/discovery/recommendations.html">Learn about 134 recommendations</a> 135 </p> 136 </div> 137 138 </div> 139 140 </div> 141 </div> <!-- end .wrap --> 142 </div> <!-- end .landing-section --> 143 144 145 <div class="landing-section landing-red-background"> 146 <div class="wrap"> 147 <div class="landing-section-header"> 148 <div class="landing-h1 landing-align-left">Get Started with Android TV</div> 149 150 <div class="landing-subhead landing-subhead-red"> 151 <p> 152 Set up your development environment to build apps for TV. 153 Start creating your big-screen experience! 154 </p> 155 </div> 156 </div> 157 <div class="landing-body"> 158 <a href="{@docRoot}training/tv/start/index.html" class="landing-button landing-primary" 159 style="margin-top: 20px;"> 160 Get Started 161 </a> 162 </div> 163 </div> <!-- end .wrap --> 164 </div> <!-- end .landing-section --> 165 166 <div class="landing-section"> 167 <div class="wrap"> 168 <div class="cols"> 169 <div class="landing-body"> 170 171 <div class="col-3-wide"> 172 <a target="_blank" href="http://android-developers.blogspot.com/2014/06/android-tv-and-google-cast.html"> 173 <img class="landing-social-image" src="{@docRoot}wear/images/blogger.png" alt=""> 174 </a> 175 <div class="landing-social-copy"> 176 <p>Blog Post</p> 177 <p class="landing-small"> 178 Read more about Android TV development 179 on our blog. Just search for "Android TV". 180 </p> 181 <p class="landing-small"> 182 <a target="_blank" href="http://android-developers.blogspot.com">Android 183 Developers Blog</a> 184 </p> 185 <p></p> 186 </div> 187 </div> 188 189 <div class="col-3-wide"> 190 <a target="_blank" href="http://g.co/androidtvdev"> 191 <img class="landing-social-image" src="//www.google.com/images/icons/product/gplus-128.png" alt="+Android Wear Developers"> 192 </a> 193 <div class="landing-social-copy"> 194 <p>G+ Community</p> 195 <p class="landing-small"> 196 Follow us on Google+ to stay up-to-date with Android TV development and to 197 join the discussion! 198 </p> 199 <p class="landing-small"> 200 <a target="_blank" href="http://g.co/androidtvdev">+Android TV Developers</a> 201 </p> 202 </div> 203 </div> 204 205 <div class="col-3-wide"> 206 <a target="_blank" href="{@docRoot}tv/adt-1/index.html"> 207 <img class="landing-social-image" src="{@docRoot}wear/images/blogger.png" alt=""> 208 </a> 209 <div class="landing-social-copy"> 210 <p>ADT-1 Kit</p> 211 <p class="landing-small"> 212 Get information about the streaming media player 213 for developing and testing apps for TV. 214 </p> 215 <p class="landing-small"> 216 <a target="_blank" href="{@docRoot}tv/adt-1/index.html">ADT-1 Development 217 Kit</a> 218 </p> 219 </div> 220 </div> 221 222 </div> 223 </div> 224 </div> <!-- end .wrap --> 225 </div> <!-- end .landing-section --> 226 227 </div> <!-- end .landing-rest-of-page --> 228 229 <div class="content-footer wrap" itemscope="" itemtype="http://schema.org/SiteNavigationElement"> 230 <div class="layout-content-col col-16" style="padding-top:4px"> 231 <style>#___plusone_0 {float:right !important;}</style> 232 <div class="g-plusone" data-size="medium"></div> 233 </div> 234 </div> 235 <div id="footer" class="wrap" style="width:940px;position:relative;top:-35px;z-index:-1"> 236 <div id="copyright"> 237 Except as noted, this content is 238 licensed under <a href="http://creativecommons.org/licenses/by/2.5/"> 239 Creative Commons Attribution 2.5</a>. For details and 240 restrictions, see the <a href="/license.html">Content 241 License</a>. 242 </div> 243 </div> 244 245 </div> <!-- end .landing-hero-container --> 246 247 <script> 248 $("a.landing-down-arrow").on("click", function(e) { 249 $("body").animate({ 250 scrollTop: $(".tv-hero").height() + 120 251 }, 1000, "easeOutQuint"); 252 e.preventDefault(); 253 }); 254 </script> 255 256 </div> <!-- end landing-body-content --> 257 258