강의

멘토링

로드맵

BEST
Programming

/

Front-end

GSAP Guide for Web Animation Part.02

“GSAP is capable of this?” Breaks the stereotype that animation is complex and difficult.

(5.0) 29 reviews

275 learners

  • kindtiger
gsap
프론트엔드
인터랙티브웹
html/css
Interactive Web
JavaScript
HTML/CSS

Reviews from Early Learners

What you will learn!

  • How to use GSAP

  • Understanding Animation

  • Understanding the Web

  • HTML structure

  • GSAP Plugin

With various codes and various animations
GSAP is more powerful and cooler! 😎

GSAP, a JavaScript animation library

Gain a deeper understanding of GreenSockAnimationPlatform (GSAP) and learn how to systematically build and manage animations.

✅ If you want to use GSAP better!
More code, animations, and practice materials!

I want to use GSAP better...
Are you saying there isn't enough Korean material? 🥲

Have you used GSAP for some time, but want to understand it more deeply and use it more effectively? Still feeling overwhelmed by the lack of proper Korean documentation or guides? GSAP allows you to add various animations with just basic syntax, but as you delve deeper into its properties, you'll be able to handle an ever-increasing variety of animations.

This lecture is Part 2 of the advanced GSAP Basics course, a continuation of the previous course. It's designed to allow you to apply the concepts learned in the Basics course to create a wider variety of code and animations.

Animation Controls

👉 Learn various animation control methods provided by GSAP.

DeepDive

👉 Gain a deeper understanding of GSAP's instrumental features by handling callbacks for frequently used animations and using 3D effects.

Advanced Stagger

👉 Learn about the various applications and usage methods of Stagger and its handling.

Advanced Timeline

👉Learn how to efficiently manage timelines and design function-driven animations.

* Toy Story, the class example, is a design work by Go Yu-jin.

By experiencing the various properties and methods of GSAP that you weren't familiar with, you can increase your learning ability and learn how to systematically build and manage animations ! If you take a solid step-by-step approach to GSAP, you'll eventually be able to apply it freely. 😄

You can do it after taking the class!

  • ✅ By looking at the animation, you can infer which properties and methods of GSAP are used internally.
  • ✅ You will be able to see yourself implementing the animation you want to create without difficulty.
  • Practice materials are provided for each section so you can apply what you've learned!

💡 If you understand Part 02 well, you will gain much more from the ScrollTrigger lecture in Part 03 that follows.


Q&A 💬

Q. Why should I learn GSAP?

For web developers, where productivity is paramount, implementing animations with pure JavaScript is both irrational and unnecessary. Wouldn't it be more convenient to use a well-made tool? It's like using a hammer instead of your hands to drive nails.

Q. What are the benefits of learning GSAP?

You will gain the ability to analyze animations and easily incorporate them into your projects.

Q. What can I do if I learn GSAP?

You can add animation to any web work, making static websites more dynamic.

New to GSAP? Check out past lectures.

Recommended for
these people

Who is this course right for?

  • Developers who know GSAP but want to understand it more deeply

  • Developers interested in the interactive web

  • Developers who want to create web animations

  • Designers curious about the interactive web

  • Anyone who needs an explanation of GSAP

Need to know before starting?

  • HTML, CSS, JavaScript

  • This lecture is a continuation of the previous Part 01 lecture.

Hello
This is

4,418

Learners

225

Reviews

292

Answers

4.9

Rating

5

Courses

 

---안녕하세요 디자인과 개발에 재미를 가지고 강의를 만드는 범쌤입니다 🙂 -----------------------------------------------------온라인 / 오프라인 출강 문의는 seonbeom2@gmail.com 으로 연락주세요 🙇‍♂

 

Curriculum

All

47 lectures ∙ (12hr 18min)

Course Materials:

Lecture resources
Published: 
Last updated: 

Reviews

All

29 reviews

5.0

29 reviews

  • Hyungjin님의 프로필 이미지
    Hyungjin

    Reviews 20

    Average Rating 5.0

    5

    100% enrolled

    수강 완료했습니다!! 😆 저번 기초 파트에 이어서 gsap에 대해 좀 더 깊이 있게 다뤄서 그런지 생각보다 강의가 길었습니다 애니메이션을 구현할 때 좀 더 다양한 팁이랑 새로운 기능들을 배울 수 있었고 이번엔 저번 기초 파트보다 각 섹션 별로 예제도 많아지고 중간에 필요한 js 설명이랑 수강생입장에서 궁금해할 거 같은 부분을 미리 캐치하시고 설명해 주시는 부분이 좋았습니다. 항상 범쌤 수업 들을 때마다 느끼는 거지만 쉽고 재밌게 잘 가르쳐 주시는거같아요 다음 스크롤 트리거 강의도 너무 기대됩니다 빨리 나왔으면 좋겠어요! 수업 하나하나 정말 재밌게 봤습니다 👍👍 정성스러운 강의 제작하시느라 고생하셨습니닷!!🐯🐯

    • hoon Cli님의 프로필 이미지
      hoon Cli

      Reviews 50

      Average Rating 5.0

      5

      100% enrolled

      강의 가격이 만만찮아서 구매전에 정말 망설였는데 part2 내용이 정말 알차서 잘샀구나 싶습니다. gsap 플러그인, 메서드, 콜백 등은 기본이고 실습자료로 주시는 예시와 소스들 자체도 활용할 부분이 많아보입니다. 그리고 1회 완주한 소감은 과연 여기서 배운 걸 적재적소에 활용하려면 얼마나 연습을 해야할지 기쁘면서도 걱정이 되네요. 다음 스크롤트리거 강의도 기대됩니다.

      • aldald9505님의 프로필 이미지
        aldald9505

        Reviews 2

        Average Rating 5.0

        5

        100% enrolled

        1편에 이어 2편도 너무나도 알찬 강의였습니다

        • 이연수님의 프로필 이미지
          이연수

          Reviews 2

          Average Rating 4.0

          5

          100% enrolled

          복습하러 자주 오겠습니다. 설명해주시는 능력 정말 최고세요. 강의 듣기 전 gsap에 대한 기초 개념도 없이 바로 실전에서 활용했었습니다;; 이해도가 전혀 없는 상태라 gsap 사용한 홈페이지들을 많이 보고 따라해봐도 문법이 너무 많아서 헷갈리고ㅠ 그래서 gpt 한테 물어보고 작성해 달라하고, 레퍼런스를 아예 복붙해서 쓰던지 거의 바닥을 기면서 프로젝트를 끝냈었습니다 ㅋㅋ.. 이 강의 덕분에 gsap에 대한 전반적인 이해와 응용을 할 수 있게 되었습니다.! gsap 다른 선생의 강의 들어보면 ~이런게 있다. 하면서 수박 겉햝기 식으로 쌩쌩 넘어가서 정말 환불하고 싶은 강의가 있었는데,, 범 선생님은 뭐가 뭔지 하나씩 제대로 짚어가며 이해시키려고 노력하시는 모습에 감동받았습니다. 이 선생님 강의는 명강의입니다,, 강의 볼 때 마다 수강료를 지불해야할 것 같은 기분이 듭니다. 복습하러 자주 오겠습니다. 설명해주시는 능력 정말 최고세요.

          • dada da님의 프로필 이미지
            dada da

            Reviews 2

            Average Rating 5.0

            5

            32% enrolled

            이해하기 쉽고 예제가 좋아요

            $121.00

            kindtiger's other courses

            Check out other courses by the instructor!

            Similar courses

            Explore other courses in the same field!