As an Alexa developer, you have the ability to provide Alexa skill cards that contain text and/or images (see Including a Card in Your Skill's Response). There are two main types of cards:

• Simple Card - contains a title and text body.
• Standard Card - contains title, text body, and one image.

Customers interacting with your skill can then view these cards via the Alexa app or on Fire TV. While voice experiences allow customers to break from their screens, graphical interfaces act to complement and can enhance the experience users have with your skill.

In our new guide, Best Practices for Skill Card Design, you can learn how to best present information on cards for easy consumption by customers. Skill cards contain the same information (image and text) everywhere they appear, but have differing layouts depending on the access point, the Alexa app or Fire TV.  

To drive engagement with your Alexa skill, we’ve compiled the top 10 tips for effective Alexa skill card design.

Tip #1: Use cards to share additional information or details to the voice experience

Cards do not replace the voice experience, instead, they deliver value-added content. Customers should not need to rely on the cards to enjoy your voice experience and cards should never be required to use an Alexa skill. Instead, they should be used to provide additional information.

For example, imagine a customer asks for a recipe and you want to share details of the recipe. The skill card could add additional context by providing the recipe category, recipe description, cook time, prep time, and number of ingredients,  while Alexa may simply say, “Try chicken parmesan accented by a homemade tomato sauce.”

Tip #2: Show users what they can do with guidance and sample utterances

Cards can be a great way to get a lost user back on track, or enable self-service to show users what they can do. Give enough detail for the user to move forward when lost – without going overboard. Suggest sample utterances when they need help, or when AMAZON.HelpIntent is triggered. Always keep the utterances relevant and in context of the current situation. For example, don't suggest an utterance on how to check your previous scores when the user is in the middle of the game.

Tip #3: Keep it short, informative, and clear

Structure the copy for cards in brief, informative sentences or lines of text and avoid unstructured product details. Don’t rely on large blocks of text and keep details to a minimum so that users can quickly evaluate the card at a glance. For example, show a stock symbol and the current stock quote instead of a full sentence describing the change, which is more difficult to quickly grasp.

Tip #4: Use line breaks

Use line breaks (/n) to help format individual lines of addresses, product details or information. Again, this makes it easier to quickly scan for key information. However, don’t double line break when separating parts of a street address.

Tip #5: Keep URL links short and memorable

Since URLs in cards are not clickable links, don’t only show URLs to direct users to other sites. Instead, provide clear direction on how to get to more information (e.g., “Go to giftsgalore.com and head to ‘My Account’”). While we don’t encourage the use of URLs in cards, if you do include them, make it easy for the user to consume and remember.

Tip #6: Make it consumable at a glance

A general guideline for card content is to keep it short and easy to read. Cards should provide quick bits of content that users can consume at a glance. Providing images is a helpful way to quickly convey key information (e.g., images of a cheese pizza vs. a pepperoni pizza are instantaneously distinguishable). The card shouldn’t include everything that Alexa says, but instead simply the key information in the card (e.g., a bulleted list of product details vs. the full description).

Tip #7: Determine the frequency and the number of cards

The timing and frequency of pushing cards is important. Having too many cards can take away from the voice experience. Avoid pushing cards with every response, unless it is necessary or aids your use case (e.g., a card for each trivia question).

Tip #8: Avoid caps and grammatical errors

Avoid using all caps in headlines or in the body copy and always make sure your text is readable and grammatically correct. Note: full sentences are not required as quick comprehension is key.

Tip #9: Use informative images

Use standard Alexa skill cards with the intention of creating a unique experience that builds on the overall conversation. Keep the card visually interesting and delightful. For example, providing an image of a man yanking up his trousers along with the Word of the Day “hoick” will help your users learn and remember a new vocabulary word.

Tip #10: Test your cards on various devices

One of the most important things to remember is to consider the differing layouts on the Alexa app and Fire TV when designing cards for your skill. While a customer uses an Amazon Echo, he or she may not have the Alexa app open and in turn, may not see the cards at all. On the other hand, a customer using your skill through Fire TV will see the cards appear on the TV as Alexa is speaking.

Add to the your Alexa skill experience

Some great uses of skill cards include:

• Cat pictures to accompany facts about various felines
• Photos of food and/or drinks to complement recipes
• Text of inspirational quotations for a user to read along and remember
• A list of ingredients from a recipe search
• Detailed information about a stock quote
• Confirmation number after a purchase

Join us for a free webinar on skill cards

Learn more about Alexa skill card design by checking out the best practices guide and technical documentation on how to include a card in your skill.

Here are some tips to keep in mind. Your Alexa skill card:

• Does not replace the voice experience, but rather should act as to complement to the voice interaction
• Should be easy to read with proper grammar, punctuation, and capitalization
• Should provide information that aids comprehension or provides additional detail

Join us on November 4 at 12 p.m. PT for a live webinar with Principal Alexa Evangelist Paul Cutsinger. He’ll dive into more tips and tricks for skill cards and step through how to include a card in your skill’s response.

More Resources

• Live Webinar: Tips for Skill Card Design, Nov. 4
• Best Practices for Skill Card Design
• Including a Card in your Skill's Response