Introduction

Alexa Presentation Language (APL) is an exciting new way to have full control over the visual display of your skills.  Prior to APL, you were limited to using one of about a half dozen display templates with limited control over the layout.  Now, with APL, you can create your own custom layouts, using an HTML like format, that works across all devices, from small Echo Spot screens (480x480px) all the way to Large TV screens (1920x1080px).

With APL, you can customize almost every visual element of the display.  You can add new components, change the fonts, colors, and styles of each element, and add events to dynamically change the display when users take specific actions or say specific things.   

You can learn more about APL here.

Creating APL Templates

Amazon has developed a visual authoring tool for creating APL templates.  This tool allows you to edit your layout and styles and instantly see how your template will look on various device sizes. 

You can start with a sample template or create your own APL template from scratch.

Start using the APL Authoring Tool now.

Using your APL Template in Voice Apps

To get you started quickly, we've created an "APL Template Demo" sample project.  You can start with this sample project or create your own from scratch.  Either way, it's really easy to use APL in your Voice Apps projects!

Once you've created an APL Template using the APL Authoring Tool, we've made it really easy to use it in your Alexa Skills.   All you need to do is use our new APL Template function and Voice Apps handles the rest.   We take care of enabling APL support in your skill and determining if the user is using a device which supports APL.

Export your APL Template

  1. In the APL Authoring Tool, click the "Export Code" button at the top right of the page.  This will export your template and data in a single JSON file.
  2.  Open the exported JSON file in your favorite text editor
  3.  Copy the entire text to your clipboard.

Add the APL Template Function to your Skill

  1.  Open the Responses tab for the intent you wish to display an APL template
  2.  At the bottom of the response group, you will see a new icon for "APL Template".  Click on this icon to add the APL Template function to your skill.
  3.  Paste the JSON document for your APL Template into the template editor.  You can also edit or create the template in the JSON editor we provided.

Test your new APL Template

The Voice Apps test console doesn't support displaying your template yet, so you'll need to publish your skill to the Amazon Developer portal and test your skill there.

  1.  Click the "Publish" button at the top of the page to deploy your skill to the Amazon Developer portal.
  2.  Open the Amazon Developer portal and navigate to your skills list.
  3.  Open your skill and click the "Test" tab.
  4.  Enable your skill for testing and test your skill.
  5.  When you get to the intent where you created your APL Template, you will see the template displayed at the bottom of the test window.  
  6.  You can change the size of the display to see how it will look on different devices.

Conclusion

APL is going to make it possible to build skills with rich displays and interactions.   We at Voice Apps are really excited to be the first Skill Development Tool to support APL. 

If you have questions, comments, or suggestion, please let us know!

Jeff
VoiceApps.com

Did this answer your question?