355 lines
16 KiB
Plaintext
355 lines
16 KiB
Plaintext
fullpage=true
|
||
page.viewport_width=970
|
||
no_footer_links=true
|
||
excludeFromSuggestions=true
|
||
page.metaDescription=Android Auto
|
||
|
||
@jd:body
|
||
|
||
<div style="width:780px; margin:0 auto;">
|
||
|
||
<div id="qv-wrapper">
|
||
<div id="qv">
|
||
<h2>In this document</h2>
|
||
<ol>
|
||
<li><a href="#design">Design</a>
|
||
<ol>
|
||
<li><a href="#designprinciples">Design Principles</a></li>
|
||
<li><a href="#uioverview">UI Overview</a></li>
|
||
</ol>
|
||
</li>
|
||
<li><a href="#architecture">Architecture</a></li>
|
||
<li><a href="#uitemplates">UI Templates</a>
|
||
<ol>
|
||
<li><a href="#launchapp">Launch App</a></li>
|
||
<li><a href="#useractions">User Actions</a></li>
|
||
<li><a href="#drawertransitions">Drawer Transitions</a></li>
|
||
<li><a href="#daynighttransitions">Day and Night Transitions</a></li>
|
||
<li><a href="#customizetemplates">Customizing Templates</a></li>
|
||
</ol>
|
||
</li>
|
||
<li><a href="#devprocess">Development Process</a></li>
|
||
<li><a href="#emulator">Testing Your App</a></li>
|
||
<li><a href="#running">Running Your App</a></li>
|
||
</ol>
|
||
</div>
|
||
</div>
|
||
|
||
<h1>Android Auto Developer Overview</h1>
|
||
|
||
<p>Android Auto extends the Android platform to car entertainment systems. When users connect
|
||
their Android handheld device to a compatible vehicle, Android Auto lets users project apps on
|
||
the vehicle’s touchscreen and interact with them using the vehicle’s controls.</p>
|
||
|
||
<dl>
|
||
<dt style="margin-bottom:10px"><strong>UI Templates</strong></dt>
|
||
<dd style="margin-bottom:20px">
|
||
Android Auto defines interaction models and UI templates for several app categories. The
|
||
first version of Android Auto supports media apps, such as music, podcast, live radio, and
|
||
audio news apps. Future versions will support messaging, communication, local search apps,
|
||
and more.
|
||
</dd>
|
||
<dt style="margin-bottom:10px"><strong>Notifications</strong></dt>
|
||
<dd style="margin-bottom:20px">
|
||
The platform will integrate with existing Android APIs for notifications. Users will get
|
||
some notifications from Android apps on the vehicle’s screen.</dd>
|
||
|
||
<dt style="margin-bottom:10px"><strong>Voice Actions</strong></dt>
|
||
<dd style="margin-bottom:20px">
|
||
Android Auto supports voice search and voice actions for media apps. Future versions
|
||
will support additional voice actions.</dd>
|
||
|
||
<dt style="margin-bottom:10px"><strong>Easy Development Workflow</strong></dt>
|
||
<dd style="margin-bottom:20px">
|
||
To extend an existing Android app for Android Auto, you implement a set of interfaces and
|
||
services defined in the platform. You can reuse existing functionality and many Android APIs
|
||
you already know.</dd>
|
||
</dl>
|
||
|
||
<p>We’ll release the Android Auto SDK in the coming months, which will let you test your
|
||
Android Auto experience on a regular Android device.</p>
|
||
|
||
|
||
<h2 id="design" style="margin-top:30px">Design</h2>
|
||
|
||
<p>Digital experiences for cars should complement and augment driving, not demand the driver's
|
||
attention. Designing these experiences for cars is fundamentally different than in the case of
|
||
phones and tablets. It requires rethinking how these experiences unfold.</p>
|
||
|
||
<h3 id="designprinciples" style="margin-top:25px">Design Principles</h3>
|
||
|
||
<p><strong>Glanceable</strong>. We designed Android Auto to reduce UI complexity, optimize user
|
||
interactions, and lower cognitive load. Effective apps show just enough information
|
||
and only provide features that do not require excessive menu interaction and navigation.</p>
|
||
|
||
<p><strong>Predictive, yet predictable</strong>. Android Auto leverages rich, contextual awareness
|
||
to keep the driver informed about important situations. Timely help is combined with predictable
|
||
functions. Effective apps use patterns for common tasks and show timely information only when
|
||
relevant.</p>
|
||
|
||
<p><strong>Connected</strong>. Android Auto works with apps that drivers already use in other
|
||
devices. Android Auto promotes a continuous app experience from phones and tablets to cars,
|
||
providing access to user's existing settings, subscriptions, and digital libraries. Experiences
|
||
that bring personal content and context from other devices are part of Android Auto.</p>
|
||
|
||
<p><strong>Integrated</strong>. Android Auto blends your apps with the vehicle's entertainment
|
||
system, creating a truly integrated experience in every car. By using the vehicle's screen and
|
||
controls, apps feel tailored to each car.</p>
|
||
|
||
<h3 id="uioverview" style="margin-top:25px">UI Overview</h3>
|
||
|
||
<p>Android Auto is a new environment that leverages existing UI models where appropiate and adds
|
||
new models based on constrains and context. There are three primary concepts for Android Auto:
|
||
<strong>Suggest</strong>, a unified place for predictive content; <strong>Demand</strong>, a
|
||
pervasive way to interact with voice; and the <strong>Facets</strong>, organized spaces for
|
||
primary activities, apps and content.</p>
|
||
|
||
<dl>
|
||
<dt style="margin-bottom:10px"><strong>Suggest: The Google Facet</strong></dt>
|
||
<dd style="margin-bottom:20px">
|
||
Core of continuity and extensibility is contextual stream of Now-like cards, powered by your
|
||
apps and notifications. Relevant, timely, and dynamic, the stream organizes likely people, media,
|
||
places, and information so drivers can quickly continue their activities or start something new.
|
||
Google Now and notifications enable drivers to use the apps and services they know when they are
|
||
most relevant.
|
||
</dd>
|
||
<dt style="margin-bottom:10px"><strong>Demand: The Voice Layer</strong></dt>
|
||
<dd style="margin-bottom:20px">
|
||
Voice-enabled tasks lets drivers accomplish their goals without taking their eyes off the road.
|
||
Android Auto defines actions and intents that your app can register for.
|
||
These are accessible through both persistent UI elements and dedicated hardware controls.
|
||
</dd>
|
||
<dt style="margin-bottom:10px"><strong>Facets and Templates: App-powered activities</strong></dt>
|
||
<dd style="margin-bottom:20px">
|
||
In the car, pages of app icons and different UIs create a distracting and dangerous situation.
|
||
Instead, Android Auto apps power templates which help provide simple but customizable UIs
|
||
for common interactions such as media or communications. Templates incorporate common behaviors,
|
||
such as play/pause or reply to a message, while still letting your app promote its value
|
||
and its brand. Apps are organized into facets (or activities) to enable quick access.
|
||
</dd>
|
||
</dl>
|
||
|
||
<p>Android Auto uses the input and output mechanisms in each vehicle to tailor the interactions.
|
||
Some vehicles have dedicated hardware controls, while others have primarily touch-based systems.
|
||
Android Auto maps common actions and intents across these diverse sets of controls and outputs to
|
||
enable you to concentrate on your unique app experience.</p>
|
||
|
||
|
||
<h2 id="architecture" style="margin-top:30px">Architecture</h2>
|
||
|
||
<p>The Android Auto app projects your app's customized UI on the vehicle's screen. To communicate
|
||
with the Android Auto app, your media app implements a set of media interfaces.</p>
|
||
|
||
<div style="width:750px;margin:0 auto">
|
||
<img src="/auto/images/figure01.png" alt="" id="figure1" />
|
||
<p class="img-caption">
|
||
<strong>Figure 1</strong> - Architecture of Android Auto.
|
||
</p>
|
||
</div>
|
||
|
||
<p>The architecture consists of the following components:</p>
|
||
|
||
<p><strong>Media App</strong> - Runs a media service that exposes content through browsing and
|
||
playback APIs. The service provides content to the Android Auto app. This is your Android app.</p>
|
||
|
||
<p><strong>Android Auto App</strong> - Creates a templated UI and handles user interactions.
|
||
This app uses a media client to request content from the media service running in the media
|
||
app. The client requests data from the media service and monitors service states.</p>
|
||
|
||
<p><strong>Vehicle Display</strong> - Shows app content and supports user interaction via
|
||
on-screen soft buttons and other components, such as physical buttons or steering
|
||
wheel controls.</p>
|
||
|
||
<p>Android media apps must implement binders to these APIs:</p>
|
||
|
||
<ul>
|
||
<li><strong>Browsing</strong> - Enables a media client to browse a hierarchy of a user’s
|
||
media collection, presented as a virtual file system with containers (similar to directories)
|
||
and items (similar to files).</li>
|
||
<li><strong>Playback</strong> - Enables a media client to control media playback and monitor
|
||
playback state through callbacks.</li>
|
||
</ul>
|
||
|
||
|
||
<h2 id="uitemplates" style="margin-top:30px">UI Templates</h2>
|
||
|
||
<p>The Android Auto app uses a templated UI to display content and user interaction
|
||
opportunities. Android Auto provides you with a set of standard UI templates that follow
|
||
international guidelines for minimizing driving distraction. You do not have to test your
|
||
app's UI for for driver distraction, which is a lengthy and expensive process involving
|
||
multiple legislations across the globe and different standards for each vehicle OEM.</p>
|
||
|
||
<p>The UI templates define interfaces for browsing, searching, and listening to content from
|
||
media apps. Although you cannot change the standard template format or layout, you can customize
|
||
the template colors, action icons, background images, and more.</p>
|
||
|
||
<h3 id="launchapp" style="margin-top:25px">Launch App Template</h3>
|
||
|
||
<p>The Launcher template shows all the compatible media apps installed on the user’s
|
||
Android device and lets users select one of them from an scrollable list:</p>
|
||
|
||
<div style="width:500px;margin:0 auto">
|
||
<img src="/auto/images/figure02.png" alt="" id="figure2" />
|
||
<p class="img-caption">
|
||
<strong>Figure 2.</strong> The Launcher template.
|
||
</p>
|
||
</div>
|
||
|
||
<h3 style="margin-top:25px">Primary App Template</h3>
|
||
|
||
<p>After the user selects a media app, the display shows the primary app template. Figure
|
||
3 shows the elements of this template that you can customize:</p>
|
||
|
||
<div style="width:428px;margin:0 auto">
|
||
<img src="/auto/images/figure03.png" alt="" id="figure3" />
|
||
<p class="img-caption">
|
||
<strong>Figure 3.</strong> The main application template.
|
||
</p>
|
||
</div>
|
||
|
||
<p>You can customize the primary app template to show your own icons, app name, and
|
||
background images. Figure 4 shows an example of a customized template:</p>
|
||
|
||
<div style="width:787px;margin:0 auto">
|
||
<img src="/auto/images/figure04.png" alt="" id="figure4" />
|
||
<p class="img-caption">
|
||
<strong>Figure 4.</strong> A customized template.
|
||
</p>
|
||
</div>
|
||
|
||
<h3 id="useractions" style="margin-top:25px">User Actions</h3>
|
||
|
||
<p>The primary app template supports four main actions on the action bar, four auxiliary actions
|
||
on the overflow bar, and the <em>Return</em> action. You can use standard controls and customize
|
||
the actions and icons, as shown in Figure 5.</p>
|
||
|
||
<div style="width:500px;margin:0 auto">
|
||
<img src="/auto/images/figure05.png" alt="" id="figure5" />
|
||
<p class="img-caption">
|
||
<strong>Figure 5.</strong> Custom icons for auxiliary actions.
|
||
</p>
|
||
</div>
|
||
|
||
<h3 id="drawertransitions" style="margin-top:25px">Drawer Transitions</h3>
|
||
|
||
<p>For browse actions, the display shows the drawer transition and template:</p>
|
||
|
||
<div style="width:750px;margin:0 auto">
|
||
<img src="/auto/images/figure06.png" alt="" id="figure6" />
|
||
<p class="img-caption">
|
||
<strong>Figure 6.</strong> The drawer transition.
|
||
</p>
|
||
</div>
|
||
|
||
<p>After the transition from the primary app template to the drawer template, the drawer
|
||
appears on the center. The customized drawer template shows the media containers and
|
||
media files provided by the media service in your app. You can also customize drawers
|
||
with icons for list items.</p>
|
||
|
||
<div style="width:500px;margin:0 auto">
|
||
<img src="/auto/images/figure07.png" alt="" id="figure7" />
|
||
<p class="img-caption">
|
||
<strong>Figure 7.</strong> A customized drawer template.
|
||
</p>
|
||
</div>
|
||
|
||
<h3 id="daynighttransitions" style="margin-top:25px">Day and Night Transitions</h3>
|
||
|
||
<p>All the templates support different color schemes for day and night, as shown in
|
||
Figure 8. The platform provides the state (day or night) and makes adjustments automatically.</p>
|
||
|
||
<div style="width:780px;margin:0 auto">
|
||
<img src="/auto/images/figure08.png" alt="" id="figure8" />
|
||
<p class="img-caption">
|
||
<strong>Figure 8.</strong> Day and night transitions.
|
||
</p>
|
||
</div>
|
||
|
||
<h3 id="customizetemplates" style="margin-top:25px">Customizing Templates</h3>
|
||
|
||
<p>To customize the templates, provide the following app-specific resources and actions
|
||
to the Android Auto media client.</p>
|
||
|
||
<ul>
|
||
<li><strong>Resources</strong> - App logo, app name, theme colors, and background images.</li>
|
||
<li><strong>Actions</strong> - Multiple custom actions; for example: <em>Thumbs Up/Down</em>,
|
||
<em>Favorite</em>, and <em>Bookmark</em>. These actions are app-specific.</li>
|
||
</ul>
|
||
|
||
<p>If provided, the media client automatically uses them in the templated UI.</p>
|
||
|
||
|
||
<h2 id="devprocess" style="margin-top:30px">Development Process</h2>
|
||
|
||
<p class="note"><strong>Note:</strong> When released, the Android Auto SDK will provide
|
||
media service interfaces, an APK for handheld devices that simulates the Android Auto
|
||
app, and other tools for Android Auto development.</p>
|
||
|
||
<p>To create a media app for Android Auto, you include an Android service in your app
|
||
that implements the media service interfaces provided by the Android Auto SDK. These
|
||
interfaces define functionality for browsing and finding content, playing media,
|
||
customizing the UI template, and performing app-specific actions.</p>
|
||
|
||
<p>The media service interfaces present the content library as a navigable tree and enable
|
||
clients to play media, get album art, obtain theme resources for the UI template, and
|
||
invoke app-specific actions.</p>
|
||
|
||
<p>You don’t have to create a new app for Android Auto: you can extend your existing
|
||
Android app with implementations of the media service interfaces. Your service exposes
|
||
your app’s media content, theme resources, and app-specific actions using the methods and
|
||
data types specified by the media service interfaces. This simplifies the development
|
||
cycle because:</p>
|
||
|
||
<ul>
|
||
<li>You do not have to maintain a separate project for Android Auto</li>
|
||
<li>You can reuse existing functionality from your Android app</li>
|
||
</ul>
|
||
|
||
<p>The Android Auto client presents the customized UI to users and invokes the
|
||
functionality from your service as needed. This has two additional advantages:</p>
|
||
|
||
<ul>
|
||
<li>Your app does not implement a UI for Android Auto</li>
|
||
<li>Your app does not manage user interactions directly</li>
|
||
</ul>
|
||
|
||
<p>This also means that you do not have to worry about vehicle-specific hardware
|
||
differences such as screen resolutions, software interfaces, knobs and touch
|
||
controls.</p>
|
||
|
||
|
||
<h2 id="emulator" style="margin-top:30px">Testing Your App on an Android Device</h2>
|
||
|
||
<p>The Android Auto SDK includes an APK with a media client implementation, which is
|
||
similar to those available in compatible vehicles. To test your app with this
|
||
client:</p>
|
||
|
||
<ol>
|
||
<li>Get an Android device with a similar form factor to a dashboard screen (like a
|
||
Nexus 7).</li>
|
||
<li>Configure the device for Android development.</li>
|
||
<li>Install the APK for the media client from the Android Auto SDK on the device.</li>
|
||
<li>Install the APK for your app on the device.</li>
|
||
<li>Open the media client app from the Android Auto SDK on the device.</li>
|
||
<li>Select your app from the list of available services.</li>
|
||
</ol>
|
||
|
||
<p>The customized UI for your app appears on the client. You can navigate the content
|
||
library and play media. If your app provides app-specific actions, these actions appear
|
||
in the UI controls.</p>
|
||
|
||
|
||
<h2 id="running" style="margin-top:30px">Running Your App on Android Auto</h2>
|
||
|
||
<p>Media apps are available on the Google Play Store for compatible Android devices.
|
||
When users connect their Android device to a compatible vehicle, the
|
||
Android Auto media client shows a list of all the Android apps installed on the phone
|
||
that implement the media service interfaces.</p>
|
||
|
||
<p>When users select one of these apps, the Android Auto media client uses the app’s
|
||
service to respond to user input and invoke the methods in the media service interfaces
|
||
to build the UI, navigate the content library, and play media.</p>
|
||
|
||
<div style="margin-bottom:40px"> </div>
|
||
</div>
|