What is Visuals Step? How do I add media or images to my conversation / assistant?
The Visuals Step allows you to include Images and/or GIFs in your voice and chat assistants.
- For chat-based assistants, your visuals will show up as in-line visuals within the chat dialog.
- For voice-based assistants, your visuals will appear on your devices screen, in parallel with the voice-based interactions.
Note: The Visuals Step allows for the display of visuals both in the prototyping view on the Custom Assistant channel, and on actual devices (ie. when designing for Amazon Alexa Assistant channels).
Adding an Image
To get started with the Visual Step, ensure you navigate inside a Visual Step and have an intended Image or GIF to upload into your design.
Tip: You can add your desired Image or GIF by dragging-and-dropping it into the editor, or click Browse and select one from your computer.
Setting the Size
You can select one of three sizes options for your visual's frame:
- Auto - will match the dimensions of any file you upload
- Custom - you can input custom height and width
- Device - select from a list of popular devices' dimensions
Finally, you can select & configure how the visuals will appear on your assistant canvas:
- Actual Size - will render the full image
- Small - will just show a cropped preview of the image
- Hidden - will not show the image at all
Note: There is a difference between Size & Canvas Visibility appearance, as one is how your end user sees the image sizing and the other is around canvas organization, visibility and internal design, respectively.