Web Animations Full Course | Build a GTA VI Website & Master GSAP

3h 31m 47s
English
Paid

More than 70% of leading design-oriented companies use GSAP in production. Now you will be able not only to understand their approach, but also to master the tools to work with them or create your own animations at the level of global brands.

Read more about the course

What this means for you:

  • Create animation portfolios that are clear to creative agencies and IT brands
  • Stand out among designers and front-end developers
  • Turn creative interfaces into real orders, offers, and freelance projects

Master animations that businesses pay for

You will learn to create not just "beautiful effects," but selling animations: smooth scrolling, micro-animations that trigger a dopamine response, and emotional design that works.

We will explore how to:

  • Earn user trust like Stripe does
  • Engage the audience like Duolingo
  • Inspire a desire to buy like Apple

Project: GTA VI landing page from scratch

You will recreate a real GTA VI landing page, learning:

  • Video activation on scroll
  • Narration through motion
  • Premium-level interactive sections
  • Scroll-driven video transitions
  • Multi-layered animations and parallax effects
  • Cinematic storytelling with timelines

Learn through practice: live code right in the lessons

Each lesson is not just a video but also interactive work with code:

  • Built-in playground components
  • Smoothing demonstrations + live sliders
  • Instant editing of GSAP animations
  • Repetition through visual learning

Real projects. Real interfaces.

No abstraction - only real interfaces that you have seen in the best products:

  • Animated dock panel in MacOS style
  • Switchable navigation with a sticky effect
  • Facebook-like reactions
  • Card animations, graphs, loaders, toasts, and much more

Watch Online Web Animations Full Course | Build a GTA VI Website & Master GSAP

Join premium to watch
Go to premium
# Title Duration
1 001 Welcome to the World of Modern Web Animation 04:18
2 002 Prerequisites 01:14
3 003 Emotional Design The Business Value of Animation 03:27
4 004 Meet Adrian, Your Instructor 01:51
5 005 Get the Most Out of This Course_ 03:14
6 006 Access to a Private 24-7 Community 01:19
7 007 Environment Setup 02:54
8 008 Our Workflow 06:37
9 009 Your First Animation 08:56
10 010 Committing to GitHub 04:26
11 011 Understanding properties_ 12:56
12 012 Understanding methods 08:43
13 013 What is Easing_ 00:25
14 014 Sine Easing 07:44
15 015 Back Easing 07:16
16 016 Elastic Easings 05:30
17 017 Expo Easing 06:56
18 018 Learn to 05:13
19 019 Learn from 05:28
20 020 Learn fromTo_ 03:39
21 021 Learn Set 03:18
22 022 Introduction 01:13
23 023 App Setup & Installation 13:03
24 024 Hero Section 32:33
25 025 FirstVideo 09:21
26 026 Jason Duval 11:21
27 027 SecondVideo 08:02
28 028 Lucia Caminos 10:15
29 029 PostCard 06:52
30 030 Final Video 05:04
31 031 Outro Section 08:39

Similar courses to Web Animations Full Course | Build a GTA VI Website & Master GSAP

Learn Astro

Learn AstroChris Pennington

Category: Other (Frontend)
Duration 17 hours 12 minutes 58 seconds
The Ultimate Web Scraping Course

The Ultimate Web Scraping CourseAdrian Horning (The Web Scraping Guy)

Category: JavaScript, Other (Frontend)
Duration 10 hours 33 minutes 19 seconds
Advanced FrontEnds

Advanced FrontEndsGary Simon

Category: Three.js, Other (Frontend)
Duration 8 hours 58 minutes 38 seconds
Developing LLM App Frontends with Streamlit

Developing LLM App Frontends with Streamlitzerotomastery.io

Category: Python, Other (Frontend)
Duration 1 hour 43 minutes 52 seconds
Web Security Dev Academy - 12-week online program

Web Security Dev Academy - 12-week online programBartosz Pietrucha

Category: Angular, TypeScript, Node.js, Other (Backend), Other (Frontend)
Duration 16 hours 37 minutes 20 seconds
Full-Stack Fundamentals 2 - Backend

Full-Stack Fundamentals 2 - BackendMckay Wrigley (takeoff)

Category: Other (Backend), Other (Frontend)
Duration 1 hour 45 minutes 49 seconds
SolidJS: The Complete Guide

SolidJS: The Complete GuideSinan Polat

Category: Other (Frontend)
Duration