blob: e0a8d128e8bd49e718fc0ed5c8e320d9e7a7cd97 [file] [log] [blame]
Scott Main039d4412014-03-26 19:16:27 -07001page.title=Android Wear
Scott Mainbbaf11f2014-03-27 13:01:56 -07002page.viewport_width=970
Scott Main039d4412014-03-26 19:16:27 -07003fullpage=true
4no_footer_links=true
5page.customHeadTag=<link rel="stylesheet" type="text/css" href="/wear/css/wear.css">
Scott Main50d7dc92014-03-18 05:13:12 -07006
Scott Main039d4412014-03-26 19:16:27 -07007@jd:body
Scott Main50d7dc92014-03-18 05:13:12 -07008
Scott Main039d4412014-03-26 19:16:27 -07009<style>
Scott Maina32c4372014-03-19 11:51:05 -070010.fullpage>#footer,
11#jd-content>.content-footer.wrap {
12 display:none;
13}
14</style>
15
16
17
Scott Maina32c4372014-03-19 11:51:05 -070018<div id="video-container">
Scott Main50d7dc92014-03-18 05:13:12 -070019 <div id="video-frame">
20 <div class="video-close">
21 <span id="icon-video-close">&nbsp;</span>
22 </div>
23 <script src="//ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
24 <div id="ytapiplayer">
Scott Main52f449f2014-03-24 23:23:22 -070025 <a href="http://www.youtube.com/watch?v=0xQ3y902DEQ"><img width=940
Scott Main779174e2014-03-24 13:53:24 -070026 src="https://i1.ytimg.com/vi/0xQ3y902DEQ/maxresdefault.jpg"></a><!--You need Flash player 8+ and JavaScript enabled to view this video. -->
Scott Main50d7dc92014-03-18 05:13:12 -070027 </div>
28 </div>
29</div>
30
31
Scott Maina32c4372014-03-19 11:51:05 -070032
Scott Main50d7dc92014-03-18 05:13:12 -070033<div class="wear-body-content">
34 <div class="wear-hero-container">
35 <div class="wear-section wear-hero">
36 <div class="wear-hero-scrim"></div>
37 <div class="wear-hero-wrap">
38 <div class="vertical-center-outer">
39 <div class="vertical-center-inner">
40
41 <div class="col-10">
42 <div class="wear-section-header">
43 <div class="wear-h1 hero">Android Wear</div>
44 <div class="wear-subhead hero">Information that moves with you</div>
45 </div>
46 <div class="wear-hero-description">
47 <p>Small, powerful devices, worn on the body.
48 Useful information when you need it most.
49 Intelligent answers to spoken questions.
50 Tools to help reach fitness goals.
51 Your key to a multiscreen world.</p>
52 </div>
53
54 <div class="wear-body">
55 <a href="/wear/preview/start.html" class="wear-button wear-primary" style="margin-top: 40px;">
56 Get the Developer Preview
57 </a>
Scott Maina32c4372014-03-19 11:51:05 -070058 <a id="watchVideo" href="https://youtube.googleapis.com/v/0xQ3y902DEQ">
Scott Main50d7dc92014-03-18 05:13:12 -070059 <div class="wear-video-link">Watch the video</div>
60 </a>
61<script>
62$("#watchVideo").on("click", function(e) {
63 $("#video-container").fadeIn(400, function(){$("#video-frame").show()});
64
65 var params = { allowScriptAccess: "always"};
66 var atts = { id: "ytapiplayer" };
Scott Maina32c4372014-03-19 11:51:05 -070067 swfobject.embedSWF("//www.youtube.com/v/0xQ3y902DEQ?enablejsapi=1&playerapiid=ytplayer&version=3&HD=1;rel=0;showinfo=0;modestbranding;origin=developer.android.com;autohide=1;autoplay=1",
Scott Main50d7dc92014-03-18 05:13:12 -070068 "ytapiplayer", "940", "526.4", "8", null, null, params, atts);
69
70 e.preventDefault();
71});
72$("#icon-video-close").on("click", function() {
73 ytplayer = document.getElementById("ytapiplayer");
Scott Main52f449f2014-03-24 23:23:22 -070074 try {
75 ytplayer.stopVideo();
76 $(ytplayer).hide();
77 $("#video-container").fadeOut(400);
78 } catch(e) {
79 console.log('Video not available');
80 $("#video-container").fadeOut(400);
81 }
Scott Main50d7dc92014-03-18 05:13:12 -070082});
83</script>
84 </div>
85 </div>
86
87 </div>
88 </div>
89 </div> <!-- end .wrap -->
90 <div class="wear-scroll-down-affordance">
91 <a class="wear-down-arrow" href="#extending-android-to-wearables">
92 <img src="/wear/images/carrot.png" alt="Scroll down to read more">
93 </a>
94 </div>
95 </div> <!-- end .wear-section .wear-hero -->
96 </div> <!-- end .wear-hero-container -->
97
98 <div class="wear-rest-of-page">
99 <div class="wear-section" id="extending-android-to-wearables">
100 <div class="wrap">
101 <div class="wear-section-header">
102 <div class="wear-h1">Extending Android to Wearables</div>
103 <div class="wear-subhead">
104 Android Wear extends the Android platform to a new generation of wearable devices. <br>
105 The user experience is designed specifically for wearables.
106 </div>
107 </div>
108
109 <div class="wear-body">
110 <div class="wear-breakout cols">
111 <div class="col-3-wide">
112
113 <div class="wear-inset-video-container">
114 <img class="wear-bezel-only" src="/wear/images/screens/bezel.png" alt="">
115 <img class="gif" src="/wear/images/screens/reservation_animated.gif">
116 </div>
117
118 <p class="wear-small">
119 Say Ok Google to ask questions and get stuff done.
120 </p>
121 </div>
122 <div class="col-3-wide">
Scott Maine26817d2014-04-16 16:57:21 -0700123 <img src="/wear/images/screens/circle_message2.png" itemprop="image" alt="" >
Scott Main50d7dc92014-03-18 05:13:12 -0700124 <p class="wear-small">
125 Get glanceable, actionable information at just the right time throughout the day.
126 </p>
127 </div>
128 <div class="col-3-wide">
Scott Maine26817d2014-04-16 16:57:21 -0700129 <img src="/wear/images/screens/fitness-24.png" alt="">
Scott Main50d7dc92014-03-18 05:13:12 -0700130 <p class="wear-small">
131 A wide range of sensors is available to your applications, from accelerometers to heart rate monitors.
132 </p>
133 </div>
134 </div>
135
136 <p>
137 The Android Wear Developer Preview lets you create wearable experiences for your existing Android apps and see how they will appear on square and round Android wearables.
138 </p>
139
140 <p>
141 Later this year, well be launching the Android Wear SDK, enabling even more customized experiences.
142 </p>
143 </div>
144 </div> <!-- end .wrap -->
145 </div> <!-- end .wear-section -->
146
147 <div class="wear-section wear-gray-background">
148 <div class="wrap">
149 <div class="wear-section-header">
150 <div class="wear-h1">Developer Preview</div>
151 <div class="wear-subhead">
152 Your apps notifications will already appear on Android wearables. <br>
153 With the new Android Wear APIs you can customize and extend those notifications.
154 </div>
155 </div>
156
157
158 <div class="wear-body">
159 <div class="wear-breakout cols">
160 <div class="col-3-wide">
161 <img src="images/screens/14_circle_voicereply.png" alt="">
162 <p>Receive Voice Replies</p>
163 <p class="wear-small">
164 Add actions to your notifications to allow users to reply by voice or touch. The system delivers the text to your app on the phone.
165 </p>
166 <p class="wear-small">
167 <a href="/wear/notifications/remote-input.html">Learn about input actions</a>
168 </p>
169 </div>
170 <div class="col-3-wide">
171
172
173 <div class="wear-inset-video-container">
174 <img class="wear-bezel-only" src="/wear/images/screens/bezel.png" alt="">
175 <img class="gif" src="/wear/images/screens/pages_animated.gif">
176 </div>
177
178 <p>Add Notification Pages</p>
179 <p class="wear-small">
180 Add additional pages to your notification that are visible on the wearable device to provide detailed information on the wrist.
181 </p>
182 <p class="wear-small">
183 <a href="/wear/notifications/pages.html">Learn about pages</a>
184 </p>
185 </div>
186 <div class="col-3-wide">
187 <img src="images/screens/11_stack_B.png" alt="">
188 <p>Stack Multiple Notifications</p>
189 <p class="wear-small">
190 Your app should consolidate similar notifications. On a wearable, you can stack them together so the details for each are immediately available.
191 </p>
192 <p class="wear-small">
193 <a href="/wear/notifications/stacks.html">Learn about stacks</a>
194 </p>
195 </div>
196 </div>
197
198 <p>
Scott Main039d4412014-03-26 19:16:27 -0700199 You can also trigger your notifications contextually using existing Android APIs. For example, use <a href="{@docRoot}training/location/geofencing.html">geofences</a> to provide glanceable information to your users when they are at home, or use the <a href="{@docRoot}training/location/activity-recognition.html">activity detection APIs</a> to send messages to your users’ wrists while they are bicycling.
Scott Main50d7dc92014-03-18 05:13:12 -0700200 </p>
201
Scott Main039d4412014-03-26 19:16:27 -0700202 <p>See the <a href="{@docRoot}wear/design/index.html">Android Wear Developer Preview Design Principles</a> for more suggestions on creating great wearable experiences.</p>
Scott Main50d7dc92014-03-18 05:13:12 -0700203
204 </div>
205 </div> <!-- end .wrap -->
206 </div> <!-- end .wear-section -->
207
208 <div class="wear-section" style="background-color:#f5f5f5">
209 <div class="wrap">
210 <div class="wear-section-header">
211 <div class="wear-pre-h1">Coming soon</div>
212 <div class="wear-h1">The Android Wear SDK</div>
213 <div class="wear-subhead">
214 The Developer Preview is just the beginning for Android Wear.
215 </div>
216 </div>
217
218 <div class="wear-body">
219 <p>
220 In the coming months we’ll be launching new APIs and features for Android wearables to create even more unique experiences for the wrist:
221 </p>
222
223 <div class="wear-breakout cols">
224 <div class="col-4">
225 <img src="/wear/images/features/ts1.png" alt="">
226 <p>Build Custom UI</p>
227 <p class="wear-small">
228 Create custom card layouts and run activities directly on wearables.
229 </p>
230 </div>
231 <div class="col-4">
232 <img src="/wear/images/features/ts2.png" alt="">
233 <p>Send Data</p>
234 <p class="wear-small">
Scott Maina32c4372014-03-19 11:51:05 -0700235 Send data and actions between a phone and a wearable with data replication APIs and RPCs.
Scott Main50d7dc92014-03-18 05:13:12 -0700236 </p>
237 </div>
238 <div class="col-4">
239 <img src="/wear/images/features/ts3.png" alt="">
240 <p>Control Sensors</p>
241 <p class="wear-small">
242 Gather sensor data and display it in real-time on Android wearables.
243 </p>
244 </div>
245 <div class="col-4">
246 <img src="/wear/images/features/ts4.png" alt="">
247 <p>Voice Actions</p>
248 <p class="wear-small">
Scott Maina32c4372014-03-19 11:51:05 -0700249 Register your app to handle voice actions, like "Ok Google, take a note."
Scott Main50d7dc92014-03-18 05:13:12 -0700250 </p>
251 </div>
252 </div>
253
254 </div>
255 </div> <!-- end .wrap -->
256 </div> <!-- end .wear-section -->
257
258 <div class="wear-section wear-white-background">
259 <div class="wrap">
260 <div class="wear-section-header">
261 <div class="wear-h2">Building an Ecosystem</div>
262 <div class="wear-body wear-align-center">
263 <p class="wear-small">
264 We’re working with several partners to bring you watches powered by Android Wear later this year!
265 </p>
266 </div>
267 </div>
268
269 <div class="wear-partners cols">
270 <div class="col-4">
271 <img src="/wear/images/partners/asus.png" alt="Asus">
272 </div>
273 <div class="col-4">
274 <img src="/wear/images/partners/broadcom.png" alt="Broadcom">
275 </div>
276 <div class="col-4">
277 <img src="/wear/images/partners/fossil.png" alt="Fossil">
278 </div>
279 <div class="col-4">
280 <img src="/wear/images/partners/htc.png" alt="HTC">
281 </div>
282 <div class="col-4">
283 <img src="/wear/images/partners/intel.png" alt="Intel">
284 </div>
285 <div class="col-4">
286 <img src="/wear/images/partners/lg.png" alt="LG">
287 </div>
288 <div class="col-4">
289 <img src="/wear/images/partners/mediatek.png" alt="Mediatek">
290 </div>
291 <div class="col-4">
292 <img src="/wear/images/partners/mips.png" alt="MIPS">
293 </div>
294 <div class="col-4">
295 <img src="/wear/images/partners/motorola.png" alt="Motorola">
296 </div>
297 <div class="col-4">
298 <img src="/wear/images/partners/qualcomm.png" alt="Qualcomm">
299 </div>
300 <div class="col-4">
301 <img src="/wear/images/partners/samsung.png" alt="Samsung">
302 </div>
303 </div>
304 </div> <!-- end .wrap -->
305 </div> <!-- end .wear-section -->
306
307 <div class="wear-section wear-red-background">
308 <div class="wrap">
309 <div class="wear-section-header">
310 <div class="wear-h1 wear-align-left">Start working with Android Wear</div>
311 <div class="wear-subhead wear-subhead-red">
312 <p>
313 Your app’s notifications will already appear on Android wearables. <br>
314 With the new Android Wear APIs, you can customize and extend those notifications.
315 </p>
316 <p>
317 We’re excited about wearables and the experiences developers can create with them. <br>
318 We can’t wait to see what you do next.</p>
319 </div>
320 </div>
321 <div class="wear-body">
322 <a href="/wear/preview/start.html" class="wear-button wear-secondary" style="margin-top: 20px;">
323 Get the Developer Preview
324 </a>
325 </div>
326 </div>
327 </div>
328
329 <div class="wear-section">
330 <div class="wrap">
331 <div class="cols">
332 <div class="wear-body">
333 <div class="col-3-wide">
Scott Maina32c4372014-03-19 11:51:05 -0700334 <a target="_blank" href="https://www.youtube.com/playlist?list=PLWz5rJ2EKKc-kIrPiq098QH9dOle-fLef">
Scott Main50d7dc92014-03-18 05:13:12 -0700335 <img class="wear-social-image" src="//www.google.com/images/icons/product/youtube-128.png" alt="">
336 </a>
337 <div class="wear-social-copy">
338 <p>DevBytes</p>
339 <p class="wear-small">
Scott Maina32c4372014-03-19 11:51:05 -0700340 Learn how to optimize your app notifications for wearable devices in this <a target="_blank" href="https://www.youtube.com/playlist?list=PLWz5rJ2EKKc-kIrPiq098QH9dOle-fLef">DevBytes video</a> using the Android Wear Developer Preview.
Scott Main50d7dc92014-03-18 05:13:12 -0700341 </p>
342 </div>
343 </div>
344 <div class="col-3-wide">
Scott Maina32c4372014-03-19 11:51:05 -0700345 <a target="_blank" href="http://android-developers.blogspot.com/2014/03/android-wear-developer-preview.html">
Scott Main50d7dc92014-03-18 05:13:12 -0700346 <img class="wear-social-image" src="/wear/images/blogger.png" alt="">
347 </a>
348 <div class="wear-social-copy">
349 <p>Blog Post</p>
350 <p class="wear-small">
351 Read more about the Android Wear Developer Preview announcement
Scott Maina32c4372014-03-19 11:51:05 -0700352 at the <a target="_blank" href="http://android-developers.blogspot.com/2014/03/android-wear-developer-preview.html">Android Developers Blog</a>.
Scott Main50d7dc92014-03-18 05:13:12 -0700353 </p>
354 </div>
355 </div>
356 <div class="col-3-wide">
Scott Maina32c4372014-03-19 11:51:05 -0700357 <a target="_blank" href="http://g.co/androidweardev">
Scott Main50d7dc92014-03-18 05:13:12 -0700358 <img class="wear-social-image" src="//www.google.com/images/icons/product/gplus-128.png" alt="+Android Wear Developers">
359 </a>
360 <div class="wear-social-copy">
361 <p>G+ Community</p>
362 <p class="wear-small">
363 Follow us on Google+ to stay up-to-date on Android Wear development and join the discussion!
364 </p>
365 <p class="wear-small">
Scott Maina32c4372014-03-19 11:51:05 -0700366 <a target="_blank" href="http://g.co/androidweardev">+Android Wear Developers</a>
Scott Main50d7dc92014-03-18 05:13:12 -0700367 </p>
368 </div>
369 </div>
370 </div>
371 </div>
372 </div> <!-- end .wrap -->
373 </div> <!-- end .wear-section -->
374 </div> <!-- end .wear-rest-of-page -->
Scott Maina32c4372014-03-19 11:51:05 -0700375
376
377 <div class="content-footer wrap" itemscope="" itemtype="http://schema.org/SiteNavigationElement">
378 <div class="layout-content-col col-16" style="padding-top:4px">
379 <style>#___plusone_0 {float:right !important;}</style>
380 <div class="g-plusone" data-size="medium"></div>
381 </div>
382 </div>
Scott Main779174e2014-03-24 13:53:24 -0700383 <div id="footer" class="wrap" style="width:940px;position:relative;top:-35px;z-index:-1">
Scott Maina32c4372014-03-19 11:51:05 -0700384 <div id="copyright">
385 Except as noted, this content is
386 licensed under <a href="http://creativecommons.org/licenses/by/2.5/">
387 Creative Commons Attribution 2.5</a>. For details and
388 restrictions, see the <a href="/license.html">Content
389 License</a>.
390 </div>
391 </div>
392
393
Scott Main50d7dc92014-03-18 05:13:12 -0700394 </div> <!-- end wear-body-content -->
395
396 <script>
397 $("a.wear-down-arrow").on("click", function(e) {
398 $("body").animate({
smain@google.comb43eff82014-06-13 15:05:29 -0700399 scrollTop: $(".wear-hero").height() + 128
Scott Main50d7dc92014-03-18 05:13:12 -0700400 }, 1000, "easeOutQuint");
401 e.preventDefault();
402 });
403 </script>
Scott Maina32c4372014-03-19 11:51:05 -0700404