Udemy
    •  
    •  
    •  
    •  
    •  
    •  
    •  
    •  
Subscribe
Turn what you know into an opportunity and reach millions around the world.
Learn More
Your cart is empty.
Keep shopping
LottieFiles for Webflow Course
Rating: 4.2 out of 5(4 ratings)
474 students

LottieFiles for Webflow Course

Learn how to integrate Lottie animations seamlessly into your Webflow websites to create engaging pages - no code needed
Created byLottieFiles Courses
Last updated 12/2024
English

What you'll learn

  • Basics of creating animations using tools such as Figma and Lottie Creator.
  • How to add Lottie animations to Webflow websites.
  • Explore interactive Lottie animations and how to apply them on websites.
  • Creating animated websites using no-code.
  • Learn best practices, tips, and tricks for using LottieFiles for Webflow to build motion websites.

Explore related topics

Course content

6 sections • 11 lectures • 30m total length

  • Creating Lottie animations in Figma3:47

    Welcome to the LottieFiles for Webflow Certification. In this first section of the course, Jesse Showalter will walk you through creating Lottie animations. In this video, we will be using the LottieFiles plugin for Figma to learn how to animate frames, customize presets, and export animations for seamless integration into your Webflow projects.

    To learn more about how to create Lottie animations in Figma using the LottieFiles plugin, check out the LottieFiles for Figma certification.

  • Creating Lottie animations in Lottie Creator2:47

    In this lesson, we will explore the web-based Lottie animation Lottie Creator to create your motion designs. We will examine the UI, demonstrate how to animate from scratch or with presets, and show you how to export your creations.

  • Creating Lottie animations using AI tools3:08

    In this lesson, we will learn how to leverage AI features in Figma and Lottie Creator to supercharge your animation creation process. We will cover how to use AI Prompt to Vector to generate your designs, customize them, and animate them with Motion Copilot.

Requirements

  • A LottieFiles account is also required. Login from the LottieFiles website to create your free account. (Access to premium Lottie animation is limited to paid plan members)
  • You'll need a Webflow account. A free Starter Site plan is available on the Webflow website.
  • In this course, we will utilize the LottieFiles for Webflow app, which is accessible within the Webflow marketplace section.
  • No previous UX Design/UI Design experience is needed.
  • Basic Webflow skills are needed.

Description

Hi there! Today, we from the LottieFiles team are here to explore adding animation or motion to websites in specific Lottie animation and Webflow.

Enhance your websites with LottieFiles for Webflow

LottieFiles for Webflow empowers you to create websites that are both interactive and engaging with access to over 500,000 free and premium animations at your fingertips. Find animations suitable for every imaginable use case. Additionally, you can access your own LottieFiles workspace directly within Webflow, eliminating the need to switch between multiple tabs.

Course details

This course is designed for people of any skill level, teaching you how to integrate animations into your Webflow websites, along with some basics on creating animations.

Section 1: Learn how to create animations that can be inserted into your Webflow projects

  1. LottieFiles for Figma

  2. Lottie Creator

  3. Exploring LottieFiles AI Features

Section 2: Implementing Lottie animation to Webflow

  1. Overview of LottieFiles plugins and customization options

  2. Positioning animations

Section 3: Interactivity

  1. Hover and click-based triggers

  2. Scroll triggers when in view

  3. On-load animations

Section 4: Conclusion

  1. Overall recap with tips and tricks

Once you finish this course, please take the quiz under additional content to test your skill set, which will take you one step closer to becoming a LottieFiles for Webflow expert.

Alrighty, it's time to get started!

Who this course is for:

  • This course is designed for individuals interested in animation and motion design and is open to all skill levels: beginners, intermediate, and experts. This course is particularly useful for:
  • Product Designers: Learn how to streamline your workflow by converting and integrating Lottie animation into your Webflow websites to create engaging experiences.
  • UI UX Designers: Explore best practices to improve user experience and user interface by using motion to guide them through the no-code platform.
  • Design enthusiast: Anyone who just has a general interest and passion in learning the world of motion in web design.

Report abuse