Figma Animation Course
by @igorvensko
Stunning Website Design & Magic Animation in Figma
In over 20 hours of video you will learn how to create eye-catching animated website design prototype and advanced techniques for animating and cool interactions.
scroll
to explore
Course is divided into 3 parts
part
01
Level up as a designer
How to boost your creativity and become a better as a designer
part
02
Animation Techniques
How to animate: from the simplest button to the most complex screen transitions
part
03
Animated Website Design from scratch
How to create website design, record prototype and publish on social networks
This course is for designers who want:
Professionally animate website design prototypes in Figma
Delivering animated prototypes demonstrates a higher level of professionalism and dedication to client satisfaction, leading to happier clients and potential referrals.
Increase client approval rate by 70%* with animated prototypes
Clients can better visualize the user experience, interactions, and transitions, leading to a clearer understanding of the design concept.
*Compared to non-animated based on my experience
Increase competitive advantage
Showcasing your design and tech skills through animated website prototypes sets you apart from the competition, making you the top choice for clients and design agencies.
Speed up the process of animation projects
Everything becomes easy once you understand how it works.
By the end of this course, you'll be able to understand the principles of animation and use them to make your designs pop.
Less edits and faster payments
This immersive experience helps clients better understand the flow and usability of the design without further questions.
As a result, the number of edits is reduced, which speeds up the process of final approval with the client.
Get next level in showcasing projects
With the addition animations, your projects can create a real "wow" factor that not only grabs attention but also leaves a lasting impression, making them truly stand out from the rest.
What will you learn?
No matter if you're a pro or just starting your creative journey, my course will show you how to add awesome animations that make your designs more engaging and spectacular!
01
Level up as a designer
How to boost your creativity and become a better as a designer
7 chapters - 00:53:59
00:25
1.
Train yourself
01:25
2.
WOW factor
03:25
3.
My story
00:45
4.
Critique
00:58
5.
How not to get left behind
00:13
6.
If you're stuck
00:05
7.
Client is your best friend
00:23
02
Animation Techniques
How to animate: from the simplest button to the most complex screen transitions
8 chapters - 10:09:09
1.
Basics
00:25
2.
Shapes
01:25
3.
Typography
03:25
4.
Buttons
00:45
5.
Video / Gif
00:58
6.
One screen
00:13
7.
Parallax
00:05
8.
Website examples
00:23
00:23
00:23
03
Animated Website Design from scratch
How to create website design, record prototype and publish on social networks
10 chapters - 10:07:46
1.
Brief and Grids
00:25
2.
Inspiration
01:25
3.
AI Assets
03:25
4.
Typography
00:45
5.
First screen
00:58
6.
Product page
00:13
7.
Home page
00:05
8.
Animation
00:23
9.
Record prototype
00:23
10.
Publish on social networks
00:23
Let's bring your designs to life and impress everyone
Whether you're designing websites, apps, or user interfaces, adding animation to your work will take it to the next level.
Meet
Igor Vensko
Web/UI/UX/Graphic Designer with 10+ years experience in design from Poland. Creative concept maker with non-standard problem solving. Share my knowledge on Youtube.
Founder WizardMode.io
Happy husband and father of two.
Patient and honest.
on Behance
What people say about Youtube tutorials
FAQs
Recommended but not necessary to use paid programs and applications to take the course.
You can use the free Figma Starter Plan, and for the rest of the tasks, I will show you 100% free alternatives.
No matter if you're a pro or just starting your creative journey, my course will show you how to add awesome animations that make your designs more engaging and spectacular!
The course only shows the process of creating animation in Figma. No code or programming. Animation in Figma is created for presenting a project to the client (to increase the percentage of project approval) and social networks. Animations of varying complexity are shown and further development depends on many factors. Some animations can be implemented on the site by creating a GIF or video, for some elements you need a senior javascript developer, parallax we can create in website builders like Framer or Webflow etc.
Personally, I focus only on creating the design (graphic part). After the project is approved, I send the Figma file and an example of animation in the form of a video file and comments to the coder for further development.
We can implement any idea and animation, it all depends on the project budget, coder skills and deadline.
✓ The fundamentals of animation, timing, and easing
✓ Create eye-catching animations using Figma's animation tools.
✓ Master advanced techniques like animating components and creating complex interactions.
✓ Build interactive prototypes with smooth transitions and user interactions.
✓ Learn to use Smart Animate in Figma.
✓ Learn the principles of Motion Design for Web design, the motion design process and prototyping your projects for your clients.
✓ This course is for anyone who wants to improve their level and skills in animation and prototyping.
✓ By the end of this course, you'll be able to understand the principles of animation and use them to make your more engaging and awesome.
Starter or Professional (I suggest designers have a Professional Plan to unlock Figma's full capabilities).
A Professional Plan is required to add mp4 videos (one chapter in part 2, one chapter in part 3). But in the free Starter Plan, we can always use GIF files for replacement.
However, I've tailored this course so that you can go through it with Figma's free Starter Plan and upgrade at your own pace, whenever you're ready.
✓ Figma design tool (free Starter Plan or Professional Plan).
✓ You should have a basic grasp of Figma's tools.
✓ A computer with a good internet connection.
✓ Adobe Photoshop (optional, but highly recommended).
Since this course is completely digital, all purchases are considered final. Rest assured, I put all my heart and soul into creating this course and I'm sure you'll love it!
Don't hesitate! If you have any doubts about the course's suitability for you, drop me a message at wizardcoursepro@gmail.com, and together, we'll determine if it's the perfect match for your needs.
Level up as a designer
+ Animation Techniques
+ Animated Website Design
SPRING SALE
$99
- 20h+ video content
- All techniques
- En / Fr / Es Subtitles
- Lifetime access
Level up as a designer
+ Animation Techniques
$60
- 10h+ video content
- 50+ different techniques
- 30+ buttons examples
- Subtitles and lifetime access
Level up as a designer
+ Animated Website Design
$60
- 10h+ video content
- Full design process
- 15+ techniques and parallax
- Subtitles and lifetime access
VAT/Tax inclusive
