am 682077d1: Merge "help image updates" into jb-dev
* commit '682077d188e8c9e7d353138401a731b9e11ebd09': help image updates
This commit is contained in:
BIN
docs/html/design/media/help_better.png
Normal file
BIN
docs/html/design/media/help_better.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6.2 KiB |
BIN
docs/html/design/media/help_cling.png
Normal file
BIN
docs/html/design/media/help_cling.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 46 KiB |
BIN
docs/html/design/media/help_dont.png
Normal file
BIN
docs/html/design/media/help_dont.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 14 KiB |
BIN
docs/html/design/media/help_evenbetter.png
Normal file
BIN
docs/html/design/media/help_evenbetter.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
BIN
docs/html/design/media/help_overflow.png
Normal file
BIN
docs/html/design/media/help_overflow.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
BIN
docs/html/design/media/help_solo_overflow.png
Normal file
BIN
docs/html/design/media/help_solo_overflow.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 8.6 KiB |
@@ -23,17 +23,17 @@ page.title=Help
|
||||
<div class="layout-content-row">
|
||||
<div class="layout-content-col span-8">
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
</ol>
|
||||
<p>However, this is an exceptional case. Most functionality doesn't meet all three of these criteria.</p>
|
||||
</div>
|
||||
<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">
|
||||
The first time each user visits the All Apps screen, a semi-transparent overlay appears to teach an important gesture.
|
||||
</div>
|
||||
@@ -47,10 +47,10 @@ page.title=Help
|
||||
|
||||
<div class="layout-content-row">
|
||||
<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 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">
|
||||
Even if your screen has no other action overflow items, "Help" should appear there and not be promoted to the action bar.
|
||||
</div>
|
||||
@@ -69,35 +69,31 @@ page.title=Help
|
||||
<p>When someone chooses "Help":</p>
|
||||
|
||||
<div class="layout-content-row">
|
||||
<div class="layout-content-col span-7">
|
||||
<h4 class="do-dont-label bad">Don't</h4>
|
||||
|
||||
<p>Present a dialog asking them to choose between help and other options.</p>
|
||||
<div class="layout-content-col span-4">
|
||||
<img src="{@docRoot}design/media/help_dont.png">
|
||||
</div>
|
||||
<div class="layout-content-col span-6">
|
||||
<img src="{@docRoot}design/media/swipe_views2.png">
|
||||
<div class="layout-content-col span-4">
|
||||
<img src="{@docRoot}design/media/help_better.png">
|
||||
</div>
|
||||
<div class="layout-content-col span-5">
|
||||
<img src="{@docRoot}design/media/help_evenbetter.png">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<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>
|
||||
<p>Immediately launch a web browser with help content. Place other options in a footer.</p>
|
||||
</div>
|
||||
<div class="layout-content-col span-6">
|
||||
<img src="{@docRoot}design/media/swipe_views2.png">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="layout-content-row">
|
||||
<div class="layout-content-col span-7">
|
||||
<div class="layout-content-col span-5">
|
||||
<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>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 class="layout-content-col span-6">
|
||||
<img src="{@docRoot}design/media/swipe_views2.png">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h2>Principles for Writing On-Screen Help Content</h2>
|
||||
|
||||
Reference in New Issue
Block a user