am 682077d1: Merge "help image updates" into jb-dev

* commit '682077d188e8c9e7d353138401a731b9e11ebd09':
  help image updates
This commit is contained in:
Peter Ng
2012-07-31 09:41:09 -07:00
committed by Android Git Automerger
7 changed files with 19 additions and 23 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 46 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.6 KiB

View File

@@ -23,17 +23,17 @@ page.title=Help
<div class="layout-content-row"> <div class="layout-content-row">
<div class="layout-content-col span-8"> <div class="layout-content-col span-8">
<ol> <ol>
<li><h4>High value</h4> <li><strong>High value</strong>
<p>Without it, users wouldn't be able to customize the most frequently-visited Android screen to meet their needs.</p></li> <p>Without it, users wouldn't be able to customize the most frequently-visited Android screen to meet their needs.</p></li>
<li><h4>Available only through a gesture</h4> <li><strong>Available only through a gesture</strong>
<p>Users can't do this through a button or a menu.</p></li> <p>Users can't do this through a button or a menu.</p></li>
<li><h4>Atypical for the gesture</h4> <li><strong>Atypical for the gesture</strong>
<p>Many high value functions invoked through a gesture - like scrolling, swiping tabs, and turning pages - are common and yield expected results. Users will be able to discover them in your app, and unsolicited help is unnecessary. But here, the gesture does something unexpected: press and hold doesn't just select an app, it also immediately navigates to the Home Screen and creates a shortcut to the app that can then be dragged around.</p></li> <p>Many high value functions invoked through a gesture - like scrolling, swiping tabs, and turning pages - are common and yield expected results. Users will be able to discover them in your app, and unsolicited help is unnecessary. But here, the gesture does something unexpected: press and hold doesn't just select an app, it also immediately navigates to the Home Screen and creates a shortcut to the app that can then be dragged around.</p></li>
</ol> </ol>
<p>However, this is an exceptional case. Most functionality doesn't meet all three of these criteria.</p> <p>However, this is an exceptional case. Most functionality doesn't meet all three of these criteria.</p>
</div> </div>
<div class="layout-content-col span-5"> <div class="layout-content-col span-5">
<img src="{@docRoot}design/media/swipe_views.png"> <img src="{@docRoot}design/media/help_cling.png">
<div class="figure-caption"> <div class="figure-caption">
The first time each user visits the All Apps screen, a semi-transparent overlay appears to teach an important gesture. The first time each user visits the All Apps screen, a semi-transparent overlay appears to teach an important gesture.
</div> </div>
@@ -47,10 +47,10 @@ page.title=Help
<div class="layout-content-row"> <div class="layout-content-row">
<div class="layout-content-col span-7"> <div class="layout-content-col span-7">
<img src="{@docRoot}design/media/swipe_views2.png"> <img src="{@docRoot}design/media/help_overflow.png">
</div> </div>
<div class="layout-content-col span-6"> <div class="layout-content-col span-6">
<img src="{@docRoot}design/media/swipe_views2.png"> <img src="{@docRoot}design/media/help_solo_overflow.png">
<div class="figure-caption"> <div class="figure-caption">
Even if your screen has no other action overflow items, "Help" should appear there and not be promoted to the action bar. Even if your screen has no other action overflow items, "Help" should appear there and not be promoted to the action bar.
</div> </div>
@@ -69,35 +69,31 @@ page.title=Help
<p>When someone chooses "Help":</p> <p>When someone chooses "Help":</p>
<div class="layout-content-row"> <div class="layout-content-row">
<div class="layout-content-col span-7"> <div class="layout-content-col span-4">
<h4 class="do-dont-label bad">Don't</h4> <img src="{@docRoot}design/media/help_dont.png">
<p>Present a dialog asking them to choose between help and other options.</p>
</div> </div>
<div class="layout-content-col span-6"> <div class="layout-content-col span-4">
<img src="{@docRoot}design/media/swipe_views2.png"> <img src="{@docRoot}design/media/help_better.png">
</div> </div>
<div class="layout-content-col span-5">
<img src="{@docRoot}design/media/help_evenbetter.png">
</div>
</div> </div>
<div class="layout-content-row"> <div class="layout-content-row">
<div class="layout-content-col span-7"> <div class="layout-content-col span-4">
<h4 class="do-dont-label bad">Don't</h4>
<p>Present a dialog asking them to choose between help and other options.</p>
</div>
<div class="layout-content-col span-4">
<h4 class="do-dont-label good">Better</h4> <h4 class="do-dont-label good">Better</h4>
<p>Immediately launch a web browser with help content. Place other options in a footer.</p> <p>Immediately launch a web browser with help content. Place other options in a footer.</p>
</div> </div>
<div class="layout-content-col span-6"> <div class="layout-content-col span-5">
<img src="{@docRoot}design/media/swipe_views2.png">
</div>
</div>
<div class="layout-content-row">
<div class="layout-content-col span-7">
<h4 class="do-dont-label good">Even Better</h4> <h4 class="do-dont-label good">Even Better</h4>
<p>Build a help screen in your app and offer other options in the action bar.</p> <p>Build a help screen in your app and offer other options in the action bar.</p>
<p>This requires more development work than launching a web browser, but it's a nicer experience for users because they don't leave your app to get the help they need and doesn't require a network connection.</p> <p>This requires more development work than launching a web browser, but it's a nicer experience for users because they don't leave your app to get the help they need and doesn't require a network connection.</p>
</div> </div>
<div class="layout-content-col span-6">
<img src="{@docRoot}design/media/swipe_views2.png">
</div>
</div> </div>
<h2>Principles for Writing On-Screen Help Content</h2> <h2>Principles for Writing On-Screen Help Content</h2>