Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

YouTube

Figma Smart Animate Tutorial - Parallax Effect with GIF Animation on Website

Igor Vensko Tutorials via YouTube

Overview

Learn to create a dynamic parallax effect with GIF animations for website design in Figma. This comprehensive tutorial guides you through the entire design process, from crafting the initial screen layout to implementing advanced animation techniques. Master the art of Smart Animate, create custom GIFs, and apply parallax effects to enhance your website presentations. Explore various design elements, including graphs, bottle imagery, and masking techniques. Gain insights into creating simple GIFs in Photoshop and integrating them seamlessly into your Figma project. Perfect your skills in zoom effects, multi-object animations, and polishing touches to elevate your web design portfolio.

Syllabus

Start
First screen
First screen Graphs
Create gif for animation
Parallax Bottle
Zoom / Parallax / Masks
Create simple gif in Photoshop
Hand with bottle
x4 bottles
Simple parallax
Fade in white
Final touch

Taught by

Igor Vensko Tutorials

Reviews

Start your review of Figma Smart Animate Tutorial - Parallax Effect with GIF Animation on Website

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.