1 page.title=Context Awareness on Android Wear 2 @jd:body 3 4 <style> 5 .slide-wrapper { 6 width:780px; 7 overflow:visible; 8 } 9 .slide { 10 width:370px; 11 float:left; 12 margin:0 20px 0 0; 13 } 14 .slide p { 15 height:40px; 16 } 17 .slide img { 18 height: 208px; 19 } 20 </style> 21 22 23 <p>Some of the most powerful user experiences with Android Wear are based on context-aware 24 notifications and actions. By using device sensors and other contextual cues, your app can reveal 25 information and functionality precisely when the user needs it, at a glance.</p> 26 27 <p>For example, if youre building a social app for restaurants, you can recommend popular menu 28 items when your app recognizes that the user is at a restaurant. More examples below provide basic 29 ideas about what you can do with a notification and action confirmation in your Android Wear 30 app.</p> 31 32 33 <div class="slide-wrapper"> 34 35 <div class="slide"> 36 <h2>Pinterest</h2> 37 <p>Displays a notification when one of your geo-tagged pins is within walking distance.</p> 38 <img src="{@docRoot}design/media/wear/ContextualExample.005.png" alt="" 39 srcset="{@docRoot}design/media/wear/ContextualExample.005.png 1x, 40 {@docRoot}design/media/wear/ContextualExample.005_2x.png 2x" /> 41 </div> 42 43 <div class="slide"> 44 <h2>Trulia</h2> 45 <p>Displays property details and contact options when you are near a new home.</p> 46 <img src="{@docRoot}design/media/wear/ContextualExample.006.png" alt="" 47 srcset="{@docRoot}design/media/wear/ContextualExample.006.png 1x, 48 {@docRoot}design/media/wear/ContextualExample.006_2x.png 2x" /> 49 </div> 50 51 52 53 <div class="slide"> 54 <h2>Ski Conditions</h2> 55 <p>Displays lift status and slope conditions when you arrive at a ski resort.</p> 56 <img src="{@docRoot}design/media/wear/ContextualExample.008.png" alt="" 57 srcset="{@docRoot}design/media/wear/ContextualExample.008.png 1x, 58 {@docRoot}design/media/wear/ContextualExample.008_2x.png 2x" /> 59 </div> 60 61 <div class="slide"> 62 <h2>Thermostat</h2> 63 <p>Controls automatically appear when you are at home. 64 </p> 65 <img src="{@docRoot}design/media/wear/ContextualExample.007.png" alt="" 66 srcset="{@docRoot}design/media/wear/ContextualExample.007.png 1x, 67 {@docRoot}design/media/wear/ContextualExample.007_2x.png 2x" /> 68 </div> 69 70 71 72 <div class="slide"> 73 <h2>Airport</h2> 74 <p>Displays air miles while you are waiting at the gate. 75 </p> 76 <img src="{@docRoot}design/media/wear/ContextualExample.009.png" alt="" 77 srcset="{@docRoot}design/media/wear/ContextualExample.009.png 1x, 78 {@docRoot}design/media/wear/ContextualExample.009_2x.png 2x" /> 79 </div> 80 81 <div class="slide"> 82 <h2>Hotel</h2> 83 <p>Displays late check out option on the morning of your departure. 84 </p> 85 <img src="{@docRoot}design/media/wear/ContextualExample.010.png" alt="" 86 srcset="{@docRoot}design/media/wear/ContextualExample.010.png 1x, 87 {@docRoot}design/media/wear/ContextualExample.010_2x.png 2x" /> 88 </div> 89 90 91 92 <div class="slide"> 93 <h2>Conference</h2> 94 <p>Shows which of your friends are also attending the conference. 95 </p> 96 <img src="{@docRoot}design/media/wear/ContextualExample.011.png" alt="" 97 srcset="{@docRoot}design/media/wear/ContextualExample.011.png 1x, 98 {@docRoot}design/media/wear/ContextualExample.011_2x.png 2x" /> 99 </div> 100 101 <div class="slide"> 102 <h2>Restaurant</h2> 103 <p>Provides suggestions for the healthiest items on the menu when in a restaurant. 104 </p> 105 <img src="{@docRoot}design/media/wear/ContextualExample.012.png" alt="" 106 srcset="{@docRoot}design/media/wear/ContextualExample.012.png 1x, 107 {@docRoot}design/media/wear/ContextualExample.012_2x.png 2x" /> 108 </div> 109 110 111 112 <div class="slide"> 113 <h2>Oil Change</h2> 114 <p>Offers to set a reminder to change the oil again in six months while waiting at the garage. 115 </p> 116 <img src="{@docRoot}design/media/wear/ContextualExample.013.png" alt="" 117 srcset="{@docRoot}design/media/wear/ContextualExample.013.png 1x, 118 {@docRoot}design/media/wear/ContextualExample.013_2x.png 2x" /> 119 </div> 120 121 <div class="slide"> 122 <h2>Car Sharing</h2> 123 <p>Unlocks the car as you approach it. 124 </p> 125 <img src="{@docRoot}design/media/wear/ContextualExample.016.png" alt="" 126 srcset="{@docRoot}design/media/wear/ContextualExample.016.png 1x, 127 {@docRoot}design/media/wear/ContextualExample.016_2x.png 2x" /> 128 </div> 129 130 131 132 <div class="slide"> 133 <h2>Zoo</h2> 134 <p>Notifies visitors when the penguins are going to be fed. 135 </p> 136 <img src="{@docRoot}design/media/wear/ContextualExample.014.png" alt="" 137 srcset="{@docRoot}design/media/wear/ContextualExample.014.png 1x, 138 {@docRoot}design/media/wear/ContextualExample.014_2x.png 2x" /> 139 </div> 140 141 <div class="slide"> 142 <h2>Location-based Query</h2> 143 <p>Ask questions like, "Are there any picnic tables free at the park?" and get answers in real-time 144 from people in the area.</p> 145 <img src="{@docRoot}design/media/wear/ContextualExample.015.png" alt="" 146 srcset="{@docRoot}design/media/wear/ContextualExample.015.png 1x, 147 {@docRoot}design/media/wear/ContextualExample.015_2x.png 2x" /> 148 </div> 149 150 151 152 </div> 153 154 <p style="clear:both;height:0"> </p>