Motion Components

A motion component in Alexa Presentation Language (APL) is a responsive component for widgets that incorporates motion. The motion components provide the recommended way to include motion in your widget. Because your widget displays in the Widget Panel alongside the other widgets the user installed, excessive motion might distract users and lead to a poor user experience.

Available motion components

The following table summarizes the motion components in the alexa-layouts package and indicates which viewport profiles in the alexa-viewport-profiles package support the component.

Name Description Standard viewports Widget viewports

Motion Pager

Displays content in a series of pages with a widget-specific "swipe away" animation for changing pages. You use APL components and responsive components or templates to define the pages to show.

No

Medium

Motion Scale

Displays content in a series of pages with a widget-specific "zoom" animation for changing pages. You use APL components and responsive components or templates to define the pages to show.

No

Medium

Press State

Creates a tap target in the body of the widget that displays a subtle animation when tapped.

No

Medium

Viewport profiles and motion components

Viewport profiles are available in the alexa-viewport-profiles package.

The motion components support the widget viewport profiles. Widget viewport profiles include the following:

  • Widget Medium (@hubWidgetMedium)

For details about the viewport profiles, see Viewport Profiles.

Design guidance

For design guidance on how to use the responsive motion components, see Alexa Design Guide: Widget Responsive Motion Components.

Was this page helpful?

Last updated: Nov 28, 2023