Embellishing Responses with Cards

A card is a simple representation of a response that is rendered into the Alexa companion application. It appears as a rectangular container with a title and textual content. We’ve already seen a couple of examples of cards in Chapter 5, ​Integrating User Data​ where cards were used to prompt the user to grant our skill access to their given name and to authorize the skill to access the user’s calendar.

The screenshot shows a few more examples of cards, as they might appear in the iOS Alexa companion application:

In this image, there are three cards displayed. New cards arrive at the top of the list, pushing down older cards. Thus the card that informs about the airspeed of unladen swallows is the most recently received card.

All three of these cards are designed to simply display the query as the title and the spoken response as the content, but the first card also has an image displayed along with the content. In fact, these are examples of two different kinds of cards:

• Simple cards—Have only a title and textual content
• Standard cards—Have a title, textual content, and an image

The card that deals with unladen swallows is an example of a standard card, because it has an image. The other two are simple cards that only have a title and textual content.

Let’s add a few cards to the Star Port 75 Travel skill, starting with a simple card returned in response to the AMAZON.HelpIntent.