We are excited to announce new audio and visual features that enable you to build richer responses for Alexa skills. APL 1.5 adds new responsive components, new image filters and blending capabilities, support for AVG shadows, new accessibility features and more. APL for Audio 0.9 (beta) adds compositions and resources, named component configurations and properties that simplify content reuse, and improved authoring tool features. Check out the APL 1.5 and APL for Audio 0.9 (beta) technical documentation to get started today.
APL 1.5 adds the following responsive components that enable you to quickly create intuitive and natural visual responses.
The image component now accepts an array of values in the source property and new image filters allow you to modify images or combine images in a variety of ways, enabling you to reduce the number of assets you need to create a visual response. For example, you can:
Blend two images together.
Blend an image with a color or gradient.
Apply desaturation and grascale filters.
Alexa Vector Graphics (AVG) now support shadows which allows you to add depth to your visuals in an efficient way, making visuals more glanceable. Below is an example of an AVG Text Item.
{
"type": "AVG",
"version": "1.2",
"height": 1000,
"width": 1000,
"items": {
"type": "text",
"fill": "orange",
"fontWeight": "bold",
"fontFamily": "amazon-ember, sans-serif",
"fontSize": 120,
"text": "5 o'clock",
"x": 10,
"y": 100,
"filters": [
{
"type": "DropShadow",
"color": "black",
"horizontalOffset": 3,
"radius": 3,
"verticalOffset": 3
}
]
}
}
You can take advantage of new accessibility features to deliver improved experiences for customers using assistive technologies. APL 1.5 adds new accessibility properties to the environment object (fontScale, screenMode, screenReader, and timing ) and adds actions and role properties to the base component. The actions property allows users to programmatically invoke components, and the role property provides machine-readable information about the purpose of the component. This allows you to create skills that enable vision-impaired customers to perform common touch interactions, such as tapping or swiping on screen, using only their voice. Note: You can test your skill using the Alexa Accessibility features.
Sample Component w/Actions Property
The following touchable element has one standard action (“activate”) which registers as a single press and release.
{
"type": "TouchWrapper",
"actions": [
{
"name": "activate",
"label": "Reply to user",
"command": {
"type": "SendEvent",
"arguments": "Activated by action invocation"
}
}
]
}
Compositions combine primitive components into a new custom component you can reuse multiple times in the main template of your APLA document. Compositions simplify your workflow allowing you to only provide the parameters requested by the composition.
Sample Composition
The composition has two parameters called visitor and punchline. The parameters are passed to the Speech components, which generate speech using SSML.
"compositions": {
"KnockKnock": {
"parameters": [
{
"name": "visitor",
"type": "string"
},
{
"name": "punchline",
"type": "string"
}
],
"items": [
{
"type": "Sequencer",
"items": [
{
"type": "Speech",
"contentType": "SSML",
"content": "<speak><say-as interpret-as='interjection'>knock knock</say-as>.</speak>"
},
{
"type": "Speech",
"contentType": "SSML",
"content": "<speak><voice name='Joey'>Who's There</voice></speak>"
},
{
"type": "Speech",
"contentType": "SSML",
"content": "<speak>${visitor}</speak>"
},
{
"type": "Speech",
"contentType": "SSML",
"content": "<speak><voice name='Joey'>${visitor} who?</voice></speak>"
},
{
"type": "Speech",
"contentType": "SSML",
"content": "<speak>${punchline}</speak>"
},
{
"type": "Silence",
"duration": "500"
}
]
}
]
}
}
Sample Response using the KnockKnock Composition
When rendered, the following response will speak all three knock knock jokes in sequence.
"mainTemplate": {
"parameters": [
"payload"
],
"item": {
"type": "Sequencer",
"items": [
{
"type": "KnockKnock",
"visitor": "Cereal",
"punchline": "Cereal pleasure to meet you."
},
{
"type": "KnockKnock",
"visitor": "Alpaca",
"punchline": "Alpaca the trunk, you pack the suitcase."
},
{
"type": "KnockKnock",
"visitor": "Voodoo",
"punchline": "Voodoo you think you are asking me so many questions?"
}
]
}
}
Resources are named entities you can access through data-binding. You define resources in blocks within your APLA document and create conditional resources based on values in the environment property.
Sample Resources
In this example, you can name numbers to use later in a pair within a volume filter. By defining the numbers as resources, you can use the resources in multiple locations and update all references to the volume of multiple components by updating the value.
"resources":[
{
"number": {
"quiet": 0.5,
"loud": 1.5
}
}
]
To use a resource in your document, use the @ syntax.
Sample Component using APLA Resource
"mainTemplate": {
"parameters": [
"payload"
],
"item": {
"type": "Sequencer",
"items": [
{
"type": "Speech",
"content": "John Jacob Jingleheimer Schmidt, his name is my name too.",
"filter":[
{
"type": "Volume",
"amount": "@quiet"
}
]
},
{
"type": "Speech",
"content": "Whenever I go out, the people always shout"
},
{
"type": "Speech",
"content": "There goes John Jacob Jingleheimer Schmidt!",
"filter":[
{
"type": "Volume",
"amount": "@loud"
}
]
},
{
"type": "Speech",
"content": "Nanananananana",
"filter":[
{
"type": "Volume",
"amount": "@quiet"
}
]
}
]
}
}
Ever wish you could focus on a specific segment of an audio response? With the updated APLA authoring tool you can now click in the timeline to listen to different portions of your response, select a portion of the timeline to play, and turn on a loop mode to repeatedly play back the entire response or just the portion you selected.
You now receive error events that notify you about any errors that happened during APL audio processing.
Read more about APL and APL for Audio (beta) and reach out to Product Managers Arun and Austin on Twitter (@aruntalkstech and @austinvach) if you have any questions.