AVS Companion App


This document covers the branding, best practices, and customer experience that create a great Alexa companion app. A successful Alexa companion app should allow your customer to quickly and easily set up and configure Alexa, educate your customer about how to use Alexa, and drive engagement with Alexa.

App Branding

Your companion app branding includes both the app name and tile. This is the first thing customers will see when they search for, download, or open your companion app.

If you are including the word "Alexa" in your app name or the Amazon Alexa logo in your app tile, you must follow the guidelines below.

App Naming

Appropriate app naming helps customers understand that Alexa is available in your app. When including the word "Alexa" in the app name, you must:

  • Include the word "Alexa" in the overall name
  • Not begin with the word "Alexa"

App Tile

App tile
App tile
App tile

App tiles give customers a way to visually identify any app as an Alexa companion app. When including the Amazon Alexa logo in the app tile:

  • The app tile must contain the Amazon Alexa logo, protected in a white circle or square shape. The shape should have a drop shadow that is 30% Opacity, 0px X Offset, 1px Y Offset, and 3px Blur
  • The background color can be partner specific
  • High contrast (darker) works best for background colors and gradients
  • Avoid white and light color background tones for maximum readability
  • Use square or circle base shape options, depending on the platform your app is on.

What Not to Do

Keep in mind when designing the app tile that you must adhere to the Amazon Alexa brand guidelines, specifically the what not to do section. Here are additional use cases, specific to app tiles.

App tile don'ts
App tile don'ts
App tile don'ts
App tile don'ts
Don't place logo without a white circle to protect it Don't use a white or light background Don't place the logo on a circle other than white Don't fill the inside of the logo with a color

App Font

Use the following font families for Alexa-related screens, features, and functionality:

  • Amazon Ember Display
  • Bookerly
  • Noto Sans CJK

Bookerly is used mainly for Things to Try text, and Noto Sans CJK is supplied for Chinese, Japanese, and Korean language support. Amazon Ember Display and Bookerly are reserved for Alexa-related uses only.

Find the Amazon font files on the Amazon Developer Portal (requires login) under the Resources tab.

Setting up Alexa

Alexa setup consists of three steps: introduction, authentication, and customer education. The introduction and education steps should explain what Alexa is and does, highlighting the benefits of voice control. Setup should be integrated into the product OOBE flow so that the customer moves directly from product setup into Alexa setup.

For information on creating your setup flow, see the Setup and Authentication overview.

Customer education

The introduction and education stages of setting up Alexa, as well as the Alexa settings portion of your companion app, all provide opportunities to educate the customer about the benefits of using Alexa.

Customer education

We recommend including screens in your app that educate the customer on:

  • Features that are delightful and useful on your product
  • How to use the product’s buttons to wake Alexa
  • For those products that are voice-initiated, how to turn the product’s microphones off.

This reinforces the information provided in the user guide, ensuring new customers are educated on how to use your device.

Settings

Alexa settings within your companion app or on your device will give your customer more control over their Alexa experience without having to use the Amazon Alexa app. The Alexa settings section should be labeled “Amazon Alexa” and if you use logos for each setting, use the Alexa brand asset provided by Amazon.

Your companion app or device should present all the Amazon settings that your product allows customers to change. Settings that can be made available in your companion app or on your device include:

  • Time zone
  • Enabling and disabling the Start of Request and End of Request sounds (only for products with prominent visual attention systems)
  • Do Not Disturb ON/OFF

Settings that must be made available in the Alexa settings menu of your companion app or on your device are:

Alexa Sign In/Sign Out

You must include an easy-to-find, easy-to-use way for customers to sign out and sign back in again. It can be integrated into the companion app's Alexa settings or may be a standalone screen within the app or on the device. If it is a standalone screen, we recommend using the Things to Try content so that customers are reminded of the benefits of staying signed in.

Signout

Sign In/Sign Out vs Register/Deregister

Registration of an Alexa Built-in (ABI) product links it exclusively to a customer's Alexa account. Successful sign in permits a registered ABI product to access the Alexa Voice Service. Sign out removes an ABI product's permission to access the Alexa Voice Service, but does not deregister the product from the customer's account. Please note the following important points:

  • Your product's device settings must provide customers with the ability to sign in to and sign out of the Alexa Voice Service. Do not refer to sign in and sign out as register and deregister in your device settings.
  • Your device settings cannot provide customers with the ability to deregister. Deregistration of an ABI product is only possible through Amazon via the Amazon Alexa app or the Amazon.com customer account menu.
  • During the authentication stage of setup via Login with Amazon (LWA), an ABI product is both registered and signed in.

Multilingual mode

If your product enables multilingual mode, you must allow customers to choose their preferred languages, including specifying the primary language, in the Alexa settings in your companion app or on the device.

Using multilingual mode, Alexa is able to understand customer utterances in multiple languages and reply in the language the customer is currently using. Customers can choose which languages Alexa will understand, including designating a primary language which will determine the language of the on-device prompts. Alexa skills will also be available depending on whether they support the chosen primary language.

Find information about enabling multilingual mode in the locale combinations API page, which also has a list of which languages/locales are currently included.

Alexa in App

When integrating Alexa into your product, your product must have:

  • Affordances to physically interact with Alexa
  • Affordances to communicate Alexa states

This can be either on the device or in your companion app, however, it is strongly discouraged to put this in your companion app as it does not provide your customer with a great Alexa experience.

If your companion app is the way a customer physically interacts with Alexa, it must follow the following guidelines for both buttons and Alexa states.

Alexa States

A product should ideally display the Alexa states on the product and not in the companion app, as it is not a good customer experience. However, if you choose to display the Alexa states in the companion app, you must communicate state to customers either visually or with the sounds provided by Amazon. A great product experience communicates Alexa states with both, and they should be synchronized.

Sounds

Your companion app needs to use audio cues to indicate when Alexa has started and stopped listening. Sounds communicate Alexa states and should use the sound file optimized for your speaker quality. Typically companion apps use the “medium” set, though there are three sets of sound files available.

See Attention System Sounds for more details.

Voice Chrome

Coupled with a VUI response, voice chrome visually communicates Alexa’s various attention states to customers.

For specific guidance on colors and animations for each state, see Attention System Voice Chrome.

Consistent use of Amazon Alexa brand assets throughout your companion app will protect product integrity and help customers to instantly recognize references to Amazon Alexa, thereby allowing your app to be clearly understood. See AVS UX Logo and Brand Usage for more information.

 


Was this page helpful?

Last updated: Nov 27, 2023