- Anima for Sketch
- Anima for Sketch
- Install Plugin
- Install Plugin
- Create a Project
- Create a Project
- Preview & Sync Project
- Preview & Sync Project
- Upgrade a Team
- Upgrade a Team
- Tutorial Files
- Tutorial Files
- Introduction
- Introduction
- Pins
- Pins
- Stacks (Flexbox)
- Stacks (Flexbox)
- Padding
- Padding
- Screen Presets
- Screen Presets
- Keyboard Shortcuts
- Keyboard Shortcuts
- Symbols
- Symbols
- Examples
- Examples
- Introduction
- Introduction
- Links
- Links
- Breakpoints
- Set Homepage
- Breakpoints
- Set Homepage
- Hover Effects
- Hover Effects
- Entrance Animation
- Entrance Animation
- Fixed Position
- Fixed Position
- Text Input & Forms
- Text Input & Forms
- Videos/GIFs/Lottie
- Videos/GIFs/Lottie
- Embed Code
- Embed Code
- Interaction & Animation
- Interaction & Animation
- Interactions Intro
- Interactions Intro
- Samples
- Samples
- Play
- Breakpoints Viewport
- Comments
- Code
- Share Prototype
- Manage Access Levels
- Publish Website
- Publish Website
- Custom Domains
- Custom Domains
- Analytics
- Analytics
- Project Settings
- Project Settings
Getting Started
Layout
Prototype
Collaborate
Prototype Link
Project Settings
Built with ❤️ in NYC & TLV
Videos/GIFs/Lottie
Introduction
With Anima, you can embed Videos, GIFs, and Lottie files in your Anima websites and prototype right in Sketch.
Videos can be in the form of a video player or simply a cover/hero video without any control buttons.
Supported Video links are:
- YouTube
- Vimeo
- MP4
- GIF
- Lotie JS files
The embedded video player can have these settings:
- Auto Play
- Loop
- No Control Buttons
- Cover (rect)
- Learn how you can upload your own Video/GIF/Lottie files to your design.
How To Embed Videos, GIFs, or Lottie files:
To embed a video to your website:
- Select the layer that will become the video
- Go to Prototype, expand the Smart Layers section, and select Video/GIF
- Paste your video’s URL
- Choose the Playback Settings: Auto Play, Loop, No Controls, Cover
- Save
To see it, click Preview in Browser in the Anima Panel.
Files
If you want to embed locally stored files, go to your Project Settings, and in the Files tab, you can upload your videos/GIFs files from your computer and Anima will create a direct .mp4, .gif url that you can embed in the Video/GIF Smart Layer in Sketch.
Examples
Landing Page Demo
Full-width cover video for a landing page:
Video Players Demo
Test all the different video sources, YouTube, Vimeo, mp4, GIF: