From 98ee16c52a304487c95e092877e56656f5bab557 Mon Sep 17 00:00:00 2001
From: "smain@google.com" <smain@google.com>
Date: Tue, 25 Nov 2014 12:44:19 -0800
Subject: add wear design guide for contextual apps

Change-Id: I2c5709f02352def34c5c6a0c7dcf7193ebd58e4f
---
 docs/html/auto/index.jd                            |   3 +
 docs/html/design/design_toc.cs                     |   1 +
 .../design/media/wear/ContextualExample.005.png    | Bin 0 -> 171222 bytes
 .../design/media/wear/ContextualExample.005_2x.png | Bin 0 -> 577835 bytes
 .../design/media/wear/ContextualExample.006.png    | Bin 0 -> 185830 bytes
 .../design/media/wear/ContextualExample.006_2x.png | Bin 0 -> 657190 bytes
 .../design/media/wear/ContextualExample.007.png    | Bin 0 -> 124860 bytes
 .../design/media/wear/ContextualExample.007_2x.png | Bin 0 -> 444579 bytes
 .../design/media/wear/ContextualExample.008.png    | Bin 0 -> 138734 bytes
 .../design/media/wear/ContextualExample.008_2x.png | Bin 0 -> 464682 bytes
 .../design/media/wear/ContextualExample.009.png    | Bin 0 -> 137891 bytes
 .../design/media/wear/ContextualExample.009_2x.png | Bin 0 -> 484120 bytes
 .../design/media/wear/ContextualExample.010.png    | Bin 0 -> 138852 bytes
 .../design/media/wear/ContextualExample.010_2x.png | Bin 0 -> 482862 bytes
 .../design/media/wear/ContextualExample.011.png    | Bin 0 -> 157347 bytes
 .../design/media/wear/ContextualExample.011_2x.png | Bin 0 -> 563016 bytes
 .../design/media/wear/ContextualExample.012.png    | Bin 0 -> 136521 bytes
 .../design/media/wear/ContextualExample.012_2x.png | Bin 0 -> 479503 bytes
 .../design/media/wear/ContextualExample.013.png    | Bin 0 -> 117580 bytes
 .../design/media/wear/ContextualExample.013_2x.png | Bin 0 -> 393766 bytes
 .../design/media/wear/ContextualExample.014.png    | Bin 0 -> 159336 bytes
 .../design/media/wear/ContextualExample.014_2x.png | Bin 0 -> 552206 bytes
 .../design/media/wear/ContextualExample.015.png    | Bin 0 -> 156166 bytes
 .../design/media/wear/ContextualExample.015_2x.png | Bin 0 -> 540607 bytes
 .../design/media/wear/ContextualExample.016.png    | Bin 0 -> 141640 bytes
 .../design/media/wear/ContextualExample.016_2x.png | Bin 0 -> 480461 bytes
 docs/html/design/wear/context.jd                   | 149 +++++++++++++++++++++
 27 files changed, 153 insertions(+)
 create mode 100644 docs/html/design/media/wear/ContextualExample.005.png
 create mode 100644 docs/html/design/media/wear/ContextualExample.005_2x.png
 create mode 100644 docs/html/design/media/wear/ContextualExample.006.png
 create mode 100644 docs/html/design/media/wear/ContextualExample.006_2x.png
 create mode 100644 docs/html/design/media/wear/ContextualExample.007.png
 create mode 100644 docs/html/design/media/wear/ContextualExample.007_2x.png
 create mode 100644 docs/html/design/media/wear/ContextualExample.008.png
 create mode 100644 docs/html/design/media/wear/ContextualExample.008_2x.png
 create mode 100644 docs/html/design/media/wear/ContextualExample.009.png
 create mode 100644 docs/html/design/media/wear/ContextualExample.009_2x.png
 create mode 100644 docs/html/design/media/wear/ContextualExample.010.png
 create mode 100644 docs/html/design/media/wear/ContextualExample.010_2x.png
 create mode 100644 docs/html/design/media/wear/ContextualExample.011.png
 create mode 100644 docs/html/design/media/wear/ContextualExample.011_2x.png
 create mode 100644 docs/html/design/media/wear/ContextualExample.012.png
 create mode 100644 docs/html/design/media/wear/ContextualExample.012_2x.png
 create mode 100644 docs/html/design/media/wear/ContextualExample.013.png
 create mode 100644 docs/html/design/media/wear/ContextualExample.013_2x.png
 create mode 100644 docs/html/design/media/wear/ContextualExample.014.png
 create mode 100644 docs/html/design/media/wear/ContextualExample.014_2x.png
 create mode 100644 docs/html/design/media/wear/ContextualExample.015.png
 create mode 100644 docs/html/design/media/wear/ContextualExample.015_2x.png
 create mode 100644 docs/html/design/media/wear/ContextualExample.016.png
 create mode 100644 docs/html/design/media/wear/ContextualExample.016_2x.png
 create mode 100644 docs/html/design/wear/context.jd

diff --git a/docs/html/auto/index.jd b/docs/html/auto/index.jd
index 7d9400f33d30..d113a7df1e56 100644
--- a/docs/html/auto/index.jd
+++ b/docs/html/auto/index.jd
@@ -65,6 +65,9 @@ page.type=about
 </style>
 
 
+
+
+
 <div class="landing-body-content">
   <div class="landing-hero-container">
 
diff --git a/docs/html/design/design_toc.cs b/docs/html/design/design_toc.cs
index 416a93d16a2b..2cbdacd2ee40 100644
--- a/docs/html/design/design_toc.cs
+++ b/docs/html/design/design_toc.cs
@@ -23,6 +23,7 @@
           <li><a href="<?cs var:toroot ?>design/wear/creative-vision.html">Creative Vision</a></li>
           <li><a href="<?cs var:toroot ?>design/wear/principles.html">Design Principles</a></li>
           <li><a href="<?cs var:toroot ?>design/wear/structure.html">App Structure</a></li>
+          <li><a href="<?cs var:toroot ?>design/wear/context.html">Context Awareness</a></li>
           <li><a href="<?cs var:toroot ?>design/wear/patterns.html">UI Patterns</a></li>
           <li><a href="<?cs var:toroot ?>design/wear/style.html">Style</a></li>
         </ul>
diff --git a/docs/html/design/media/wear/ContextualExample.005.png b/docs/html/design/media/wear/ContextualExample.005.png
new file mode 100644
index 000000000000..a01d941e43dc
Binary files /dev/null and b/docs/html/design/media/wear/ContextualExample.005.png differ
diff --git a/docs/html/design/media/wear/ContextualExample.005_2x.png b/docs/html/design/media/wear/ContextualExample.005_2x.png
new file mode 100644
index 000000000000..caea8f3a8c8b
Binary files /dev/null and b/docs/html/design/media/wear/ContextualExample.005_2x.png differ
diff --git a/docs/html/design/media/wear/ContextualExample.006.png b/docs/html/design/media/wear/ContextualExample.006.png
new file mode 100644
index 000000000000..7c3da57a51ad
Binary files /dev/null and b/docs/html/design/media/wear/ContextualExample.006.png differ
diff --git a/docs/html/design/media/wear/ContextualExample.006_2x.png b/docs/html/design/media/wear/ContextualExample.006_2x.png
new file mode 100644
index 000000000000..319530d7a3b7
Binary files /dev/null and b/docs/html/design/media/wear/ContextualExample.006_2x.png differ
diff --git a/docs/html/design/media/wear/ContextualExample.007.png b/docs/html/design/media/wear/ContextualExample.007.png
new file mode 100644
index 000000000000..9d79e418f665
Binary files /dev/null and b/docs/html/design/media/wear/ContextualExample.007.png differ
diff --git a/docs/html/design/media/wear/ContextualExample.007_2x.png b/docs/html/design/media/wear/ContextualExample.007_2x.png
new file mode 100644
index 000000000000..06e425b38e85
Binary files /dev/null and b/docs/html/design/media/wear/ContextualExample.007_2x.png differ
diff --git a/docs/html/design/media/wear/ContextualExample.008.png b/docs/html/design/media/wear/ContextualExample.008.png
new file mode 100644
index 000000000000..331d77e294f7
Binary files /dev/null and b/docs/html/design/media/wear/ContextualExample.008.png differ
diff --git a/docs/html/design/media/wear/ContextualExample.008_2x.png b/docs/html/design/media/wear/ContextualExample.008_2x.png
new file mode 100644
index 000000000000..a6854e8e131b
Binary files /dev/null and b/docs/html/design/media/wear/ContextualExample.008_2x.png differ
diff --git a/docs/html/design/media/wear/ContextualExample.009.png b/docs/html/design/media/wear/ContextualExample.009.png
new file mode 100644
index 000000000000..67c80add01b0
Binary files /dev/null and b/docs/html/design/media/wear/ContextualExample.009.png differ
diff --git a/docs/html/design/media/wear/ContextualExample.009_2x.png b/docs/html/design/media/wear/ContextualExample.009_2x.png
new file mode 100644
index 000000000000..ca5248d2e445
Binary files /dev/null and b/docs/html/design/media/wear/ContextualExample.009_2x.png differ
diff --git a/docs/html/design/media/wear/ContextualExample.010.png b/docs/html/design/media/wear/ContextualExample.010.png
new file mode 100644
index 000000000000..e9c6ed812bbc
Binary files /dev/null and b/docs/html/design/media/wear/ContextualExample.010.png differ
diff --git a/docs/html/design/media/wear/ContextualExample.010_2x.png b/docs/html/design/media/wear/ContextualExample.010_2x.png
new file mode 100644
index 000000000000..ddae792ab0d4
Binary files /dev/null and b/docs/html/design/media/wear/ContextualExample.010_2x.png differ
diff --git a/docs/html/design/media/wear/ContextualExample.011.png b/docs/html/design/media/wear/ContextualExample.011.png
new file mode 100644
index 000000000000..ddafd655134b
Binary files /dev/null and b/docs/html/design/media/wear/ContextualExample.011.png differ
diff --git a/docs/html/design/media/wear/ContextualExample.011_2x.png b/docs/html/design/media/wear/ContextualExample.011_2x.png
new file mode 100644
index 000000000000..46934e4eee64
Binary files /dev/null and b/docs/html/design/media/wear/ContextualExample.011_2x.png differ
diff --git a/docs/html/design/media/wear/ContextualExample.012.png b/docs/html/design/media/wear/ContextualExample.012.png
new file mode 100644
index 000000000000..05c72d3a7597
Binary files /dev/null and b/docs/html/design/media/wear/ContextualExample.012.png differ
diff --git a/docs/html/design/media/wear/ContextualExample.012_2x.png b/docs/html/design/media/wear/ContextualExample.012_2x.png
new file mode 100644
index 000000000000..c86bda5f5413
Binary files /dev/null and b/docs/html/design/media/wear/ContextualExample.012_2x.png differ
diff --git a/docs/html/design/media/wear/ContextualExample.013.png b/docs/html/design/media/wear/ContextualExample.013.png
new file mode 100644
index 000000000000..0c8d3da80db4
Binary files /dev/null and b/docs/html/design/media/wear/ContextualExample.013.png differ
diff --git a/docs/html/design/media/wear/ContextualExample.013_2x.png b/docs/html/design/media/wear/ContextualExample.013_2x.png
new file mode 100644
index 000000000000..efbbf870432e
Binary files /dev/null and b/docs/html/design/media/wear/ContextualExample.013_2x.png differ
diff --git a/docs/html/design/media/wear/ContextualExample.014.png b/docs/html/design/media/wear/ContextualExample.014.png
new file mode 100644
index 000000000000..b8d87e867a45
Binary files /dev/null and b/docs/html/design/media/wear/ContextualExample.014.png differ
diff --git a/docs/html/design/media/wear/ContextualExample.014_2x.png b/docs/html/design/media/wear/ContextualExample.014_2x.png
new file mode 100644
index 000000000000..a89199fd8bd9
Binary files /dev/null and b/docs/html/design/media/wear/ContextualExample.014_2x.png differ
diff --git a/docs/html/design/media/wear/ContextualExample.015.png b/docs/html/design/media/wear/ContextualExample.015.png
new file mode 100644
index 000000000000..aa00b1fab77b
Binary files /dev/null and b/docs/html/design/media/wear/ContextualExample.015.png differ
diff --git a/docs/html/design/media/wear/ContextualExample.015_2x.png b/docs/html/design/media/wear/ContextualExample.015_2x.png
new file mode 100644
index 000000000000..7e6421cfc149
Binary files /dev/null and b/docs/html/design/media/wear/ContextualExample.015_2x.png differ
diff --git a/docs/html/design/media/wear/ContextualExample.016.png b/docs/html/design/media/wear/ContextualExample.016.png
new file mode 100644
index 000000000000..8d507994919b
Binary files /dev/null and b/docs/html/design/media/wear/ContextualExample.016.png differ
diff --git a/docs/html/design/media/wear/ContextualExample.016_2x.png b/docs/html/design/media/wear/ContextualExample.016_2x.png
new file mode 100644
index 000000000000..e67cdeec8470
Binary files /dev/null and b/docs/html/design/media/wear/ContextualExample.016_2x.png differ
diff --git a/docs/html/design/wear/context.jd b/docs/html/design/wear/context.jd
new file mode 100644
index 000000000000..9672d85191e6
--- /dev/null
+++ b/docs/html/design/wear/context.jd
@@ -0,0 +1,149 @@
+page.title=Context Awareness on Android Wear
+@jd:body
+
+<style>
+div.slide-wrapper {
+  width:780px;
+  overflow:visible;
+}
+div.slide {
+  width:370px;
+  float:left;
+  margin:0 20px 0 0;
+}
+div.slide p {
+  height:40px;
+}
+</style>
+
+
+<p>Some of the most powerful user experiences with Android Wear are based on context-aware
+notifications and actions. By using device sensors and other contextual cues, your app can reveal
+information and functionality precisely when the user needs it, at a glance.</p>
+
+<p>For example, if you’re building a social app for restaurants, you can recommend popular menu
+items when your app recognizes that the user is at a restaurant. More examples below provide basic
+ideas about what you can do with a notification and action confirmation in your Android Wear
+app.</p>
+
+
+<div class="slide-wrapper">
+
+<div class="slide">
+<h2>Pinterest</h2>
+<p>Displays a notification when one of your geo-tagged pins is within walking distance.</p>
+<img src="{@docRoot}design/media/wear/ContextualExample.005.png" alt=""
+     srcset="{@docRoot}design/media/wear/ContextualExample.005.png 1x,
+             {@docRoot}design/media/wear/ContextualExample.005_2x.png 2x" />
+</div>
+
+<div class="slide">
+<h2>Trulia</h2>
+<p>Displays property details and contact options when you are near a new home.</p>
+<img src="{@docRoot}design/media/wear/ContextualExample.006.png" alt=""
+     srcset="{@docRoot}design/media/wear/ContextualExample.006.png 1x,
+             {@docRoot}design/media/wear/ContextualExample.006_2x.png 2x" />
+</div>
+
+
+
+<div class="slide">
+<h2>Ski Conditions</h2>
+<p>Displays lift status and slope conditions when you arrive at a ski resort.</p>
+<img src="{@docRoot}design/media/wear/ContextualExample.008.png" alt=""
+     srcset="{@docRoot}design/media/wear/ContextualExample.008.png 1x,
+             {@docRoot}design/media/wear/ContextualExample.008_2x.png 2x" />
+</div>
+
+<div class="slide">
+<h2>Thermostat</h2>
+<p>Controls automatically appear when you are at home.
+</p>
+<img src="{@docRoot}design/media/wear/ContextualExample.007.png" alt=""
+     srcset="{@docRoot}design/media/wear/ContextualExample.007.png 1x,
+             {@docRoot}design/media/wear/ContextualExample.007_2x.png 2x" />
+</div>
+
+
+
+<div class="slide">
+<h2>Airport</h2>
+<p>Displays air miles while you are waiting at the gate.
+</p>
+<img src="{@docRoot}design/media/wear/ContextualExample.009.png" alt=""
+     srcset="{@docRoot}design/media/wear/ContextualExample.009.png 1x,
+             {@docRoot}design/media/wear/ContextualExample.009_2x.png 2x" />
+</div>
+
+<div class="slide">
+<h2>Hotel</h2>
+<p>Displays late check out option on the morning of your departure.
+</p>
+<img src="{@docRoot}design/media/wear/ContextualExample.010.png" alt=""
+     srcset="{@docRoot}design/media/wear/ContextualExample.010.png 1x,
+             {@docRoot}design/media/wear/ContextualExample.010_2x.png 2x" />
+</div>
+
+
+
+<div class="slide">
+<h2>Conference</h2>
+<p>Shows which of your friends are also attending the conference.
+</p>
+<img src="{@docRoot}design/media/wear/ContextualExample.011.png" alt=""
+     srcset="{@docRoot}design/media/wear/ContextualExample.011.png 1x,
+             {@docRoot}design/media/wear/ContextualExample.011_2x.png 2x" />
+</div>
+
+<div class="slide">
+<h2>Restaurant</h2>
+<p>Provides suggestions for the healthiest items on the menu when in a restaurant.
+</p>
+<img src="{@docRoot}design/media/wear/ContextualExample.012.png" alt=""
+     srcset="{@docRoot}design/media/wear/ContextualExample.012.png 1x,
+             {@docRoot}design/media/wear/ContextualExample.012_2x.png 2x" />
+</div>
+
+
+
+<div class="slide">
+<h2>Oil Change</h2>
+<p>Offers to set a reminder to change the oil again in six months while waiting at the garage.
+</p>
+<img src="{@docRoot}design/media/wear/ContextualExample.013.png" alt=""
+     srcset="{@docRoot}design/media/wear/ContextualExample.013.png 1x,
+             {@docRoot}design/media/wear/ContextualExample.013_2x.png 2x" />
+</div>
+
+<div class="slide">
+<h2>Car Sharing</h2>
+<p>Unlocks the car as you approach it.
+</p>
+<img src="{@docRoot}design/media/wear/ContextualExample.016.png" alt=""
+     srcset="{@docRoot}design/media/wear/ContextualExample.016.png 1x,
+             {@docRoot}design/media/wear/ContextualExample.016_2x.png 2x" />
+</div>
+
+
+
+<div class="slide">
+<h2>Zoo</h2>
+<p>Notifies visitors when the penguins are going to be fed!
+</p>
+<img src="{@docRoot}design/media/wear/ContextualExample.014.png" alt=""
+     srcset="{@docRoot}design/media/wear/ContextualExample.014.png 1x,
+             {@docRoot}design/media/wear/ContextualExample.014_2x.png 2x" />
+</div>
+
+<div class="slide">
+<h2>Location-based Query</h2>
+<p>Ask things like, "Are there any picnic tables free at the park?" and get answers from 
+people who are there.</p>
+<img src="{@docRoot}design/media/wear/ContextualExample.015.png" alt=""
+     srcset="{@docRoot}design/media/wear/ContextualExample.015.png 1x,
+             {@docRoot}design/media/wear/ContextualExample.015_2x.png 2x" />
+</div>
+
+
+
+</div>
\ No newline at end of file
-- 
cgit v1.2.3-59-g8ed1b