LottieLab Introduction | Training Course

Course Facts

2 day course
Our Trainers are Authorised Professionals
Live Online or Classroom-based
Certificate of completion
Maximum class size of 6 for scheduled courses
Unlimited support after your course
Courses at all levels: Introduction, Intermediate, Advanced and Masterclasses

Course Outline

Introduction to Lottie and LottieLab
Creating Simple Lottie Animations
More Advanced Animation Techniques
Interactive Elements and States
Optimising Lottie Animations
Creating a Responsive Animated Header
Collaboration and Workflow
Advanced Topics and Future Trends

FULL OUTLINE

We can tailor this course to you

If you have specific requirements, talk to us about customising this course to meet your exact needs.

Enquire Now

We offer LottieLab Introduction as a private course, which means the course content can be fully customised to your exact learning requirements and run on your preferred dates.

LottieLab Private One-to-One Training

One-to-one tuition tailored to your exact requirements. Your choice of duration, dates and content.

Enquire Now

LottieLab Team Training for Companies

Group bookings provide you with the most cost-effective way to train your team.

Enquire Now

LottieLab Introduction — Team Training and Bespoke Sessions

Booking a private training session allows you to focus on your exact needs on dates that work best for you or your team.

Sessions can be run online or in person, on your site or at our London training centre.
We manage training for many of the UK’s largest companies, taking care of all the admin, working with you to ensure the perfect course.
Our expert trainers will first understand your requirements and then tailor each session to your exact specification.
We offer a free consultation service to work out every detail of your course.

Prices for bespoke sessions with our expert trainers start at £595 + VAT, depending on the course and number of people.
Costs include all preparation time to customise the course to your exact requirements.

Overview of LottieLab Introduction

The Lottie file format is a JSON-based animation file format that is widely used for creating and sharing lightweight, scalable animations on websites, apps, and other digital platforms. LottieLab is the premiere Lottie creation tool and our 2 day course will teach participants everything they need to get started with creating and editing Lottie animations using LottieLab's intuitive interface and features. We'll show you how to implement interactive elements in Lottie animations to enhance user engagement, optimise Lottie files for performance and seamless integration into web and mobile applications, how to collaborate effectively on animation projects using LottieLab's team features and much more besides. Topics covered include Introduction to lottie and lottielab, Creating simple Lottie animations, More advanced animation techniques, Interactive elements and states, Optimising Lottie animations, Creating a responsive animated header, Collaboration and workflow, Advanced topics and future trends and Integration of LottieLab with Figma and Adobe After Effects.

Course Outline for the LottieLab Introduction Training Course

Introduction to Lottie and LottieLab

Introduction to Lottie animations and their benefits
Introduction to and benefits of the JSON file format
LottieLab interface overview
Setting up a LottieLab account and workspace

Creating Simple Lottie Animations

Importing assets and creating simple animations
Understanding keyframes and tweening in LottieLab
Exploring animation properties and effects
Creating a a simple loading animation

More Advanced Animation Techniques

Working with layers and nested compositions
Mastering timing and easing for smooth animations
Using LottieLab's built-in animation presets
Designing an animated icon set for a mobile app

Interactive Elements and States

Introduction to LottieLab's interactivity features
Creating multi-state animations
Implementing click, hover and scroll interactions
Building an interactive toggle button

Optimising Lottie Animations

Best practices for file size reduction
Performance considerations for web and mobile
Using LottieLab's optimisation tools
Optimising a complex animation for web use

Creating a Responsive Animated Header

Designing animations for different screen sizes
Implementing scroll-based animations
Integrating interactive elements into a cohesive design
Building a responsive animated header for a landing page

Collaboration and Workflow

Using LottieLab's collaboration features
Version control and feedback integration
Exporting and implementing Lottie files in various platforms
Creating and iterating an animated product showcase

Advanced Topics and Future Trends

Exploring other LottieLab features such as Comments and Multi-Artboard
Examples of successful implementations of Lottie animations in industry
The future of web animations and LottieLab's roadmap

Integration of LottieLab with Figma and Adobe After Effects

Using the LottieLab Figma plugin to export designs directly into LottieLab, simplifying the transition from design to animation
Exporting SVG files from Figma for use in Lottie animations
Searching and importing animations from the LottieFiles library directly within Figma
Using the LottieFiles plugin for After Effects to render animations into Lottie format
Previewing animations with custom background colours to see how they will appear in different contexts before exporting.
Exporting animations to the compact ".Lottie" format
Uploading animations directly to the LottieFiles workspaces from After Effects