Animation
On this page
On this page
Using animation
Use the premade sparkle animation to add interest to AI indicators, including icons and chatbot avatars.
- Animations should start on rollover, hover, or click and loop once before returning to the inactive state.
- For clarity, be sure that the AI sparkle is visible when the animation is at rest.
- Don't create new animations.
Note
To request a new animation, chat us on Slack at #help-brand.
Animation do's and don'ts
-
Make sure that the AI sparkle is visible at the beginning and end of the animation loop, including when the animation is at rest. -
The animation should stay within the same bounding box as the static icon, so that padding does not need to be adjusted. -
Don't allow animations to play before the user interacts with them, or allow animations to loop endlessly. -
Don't use animations that are exaggerated or over-the-top.
