
Design System with Figma
kindtiger
Through this course, you will build a design system and experience the explosive synergy of your design work.
초급
Figma, Figma Tokens, Design System
GSAP sẽ đưa bạn tiến một bước gần hơn tới việc phát triển web tương tác và quan điểm của bạn về hoạt ảnh sẽ thay đổi.
Cách sử dụng GSAP
Hiểu hoạt hình
Hiểu về Web
Cấu trúc HTML
Plugin GSAP
GSAP đã nắm được cốt lõi!
Web tương tác, dễ dàng và thuận tiện hơn nhiều 🌠
Đây là trang mã hóa bản sao Bridge được tạo bằng GSAP. (Liên kết)
Bạn có hứng thú với web tương tác không? Bạn có muốn tạo ra những hình ảnh động web ấn tượng bằng JavaScript không? Bạn có đam mê cả thiết kế và phát triển không? GSAP chính là nền tảng đột phá dành cho bạn.
GSAP, do GreenSock tạo ra, là một nền tảng hoạt hình cho phép các nhà phát triển front-end, nhà thiết kế UI và những người khác dễ dàng và thuận tiện tạo hoạt hình bằng JavaScript.
✅ Nếu bạn quan tâm đến web tương tác, OK!
✅ Bất kỳ ai biết HTML, CSS và JavaScript!
Tuy nhiên... mặc dù GSAP có sức hấp dẫn lớn nhưng thực sự không dễ để quyết định sử dụng nó.
Nguyên nhân là do khó tìm được tài liệu hoặc tài liệu học tập tiếng Hàn phù hợp.
Nhưng đồng thời, GSAP cung cấp nhiều chức năng khác nhau để thuận tiện cho người dùng.
Do đó, nếu bạn học đúng các chức năng cốt lõi, bất kỳ ai cũng có thể dễ dàng sử dụng nó.
Tôi hy vọng khóa học này sẽ giúp nhiều người yêu thích GSAP và phát triển web tương tác!
Xây dựng một nền tảng vững chắc
Để hiểu rõ hơn các tính năng cốt lõi
Tôi sẽ giải thích từng phần một.
(Tween, Dòng thời gian, Khung hình chính...)
Thực hành với sự tự tin
Sau bài giảng, bạn có thể thực hành
Cung cấp môi trường và thử thách.
(Tài liệu môi trường Notion và tài liệu Timeline)
Ngay cả người mới bắt đầu cũng có thể làm được mà không cần lo lắng
Ngay cả khi bạn chỉ biết những kiến thức cơ bản về HTML/CSS + JS
Bạn có thể học đủ rồi.
(Sẽ tốt hơn nữa nếu bạn biết sâu về CSS và JS!)
💡 Sau khi học GSAP, góc nhìn của bạn về hoạt hình sẽ thay đổi!
Bây giờ, bạn sẽ thấy các nguyên tắc hoạt hình trên web, thứ mà trước đây bạn chỉ thấy và đánh giá cao bằng một câu đơn giản "Ồ, đẹp quá ". Sau khi tham gia khóa học này, bạn sẽ có thể dự đoán chính xác phương pháp và thuộc tính nào được sử dụng, thậm chí tự mình triển khai chúng, ngay cả khi xem cùng một hoạt hình.
GSAP là một nền tảng hoạt ảnh được GreenSock xây dựng, cho phép bạn tạo hiệu ứng động cho bất kỳ thành phần nào có thể điều khiển bằng JavaScript (thuộc tính CSS, SVG, React, Canvas, Normal Object, v.v.). Nền tảng này cũng hỗ trợ khả năng tương thích đa trình duyệt trên nhiều trình duyệt và nhanh hơn jQuery tới 20 lần.
Tìm hiểu về các thuộc tính và phương thức của đối tượng GSAP bằng cách trực tiếp kiểm tra tài liệu chính thức của GreenSock.
Tìm hiểu các nguyên tắc hoạt hình cơ bản và tạo hoạt hình đơn giản bằng Tween.
Tìm hiểu cách kiểm soát và điều chỉnh dòng thời gian trong hoạt hình của bạn bằng cách sử dụng dòng thời gian.
Tạo phần giới thiệu trang web động của riêng bạn.
💾 Hướng dẫn về Môi trường Khóa học và Tài liệu Học tập
H. Tại sao tôi nên học GSAP?
Đối với các nhà phát triển web, nơi năng suất là tối quan trọng, việc triển khai hoạt ảnh chỉ bằng JavaScript là không hợp lý và không cần thiết. Chẳng phải sẽ tiện lợi hơn nếu sử dụng một công cụ được thiết kế tốt sao? Giống như dùng búa thay vì tay để đóng đinh vậy.
H. Lợi ích của việc học GSAP là gì?
Bạn sẽ có khả năng phân tích hoạt ảnh và dễ dàng kết hợp chúng vào các dự án của mình.
H. Tôi có thể làm gì nếu học GSAP?
Bạn sẽ không thể tạo nội dung web tương tác ngay sau khi hoàn thành khóa học này. Tuy nhiên, vì đây là khóa học xây dựng nền tảng vững chắc, nên sẽ rất hữu ích nếu bạn học với tâm thế củng cố kiến thức nền tảng :)
H. Tôi có cần chuẩn bị gì trước khi tham dự buổi thuyết trình không?
Bạn nên có kiến thức nền tảng về HTML, CSS và JavaScript. Mặc dù bạn có thể theo dõi mà không cần nhiều kiến thức, nhưng việc hiểu rõ tài liệu sẽ giúp bạn mở rộng đáng kể kiến thức.
H. Nội dung bài học được trình bày ở mức độ nào?
Phần 1 là khóa học GSAP cơ bản. Khóa học này tập trung vào ngữ pháp và các hàm GSAP cơ bản.
Khóa học này dành cho ai?
Các nhà phát triển muốn thêm hình ảnh động vào web
Các nhà phát triển muốn sử dụng GSAP đúng cách
Nhà thiết kế tò mò về hoạt hình web
Cần biết trước khi bắt đầu?
HTML
CSS
JavaScript
4,375
Học viên
221
Đánh giá
291
Trả lời
4.9
Xếp hạng
5
Các khóa học
---안녕하세요 디자인과 개발에 재미를 가지고 강의를 만드는 범쌤입니다 🙂 -----------------------------------------------------온라인 / 오프라인 출강 문의는 seonbeom2@gmail.com 으로 연락주세요 🙇♂
Tất cả
27 bài giảng ∙ (3giờ 55phút)
Tài liệu khóa học:
Tất cả
61 đánh giá
5.0
61 đánh giá
Đánh giá 26
∙
Đánh giá trung bình 4.8
5
I finished the course in half a day since the lecture was uploaded! I had studied GSAP a little bit before, so I know a little bit about the basic grammar and I had done some simple projects. That's why I think I finished the course quickly. Before Beom, there was no instructor who provided online lectures on GSAP in my native language, so I listened to Udemy and understood it step by step, so I think I understood a lot of the concepts I didn't understand this time. Let me give you my honest feedback. Part 1 is a really basic lecture! Since it focuses on grammar and concepts, there aren't many related in-depth toy projects. However, you can create endless examples based on the grammar you learned in Part 1. (Just like you can create various examples with Pure CSS, you can create them using GSAP.) The reason I'm saying this is because I want to tell you that if you feel a little disappointed because there are few examples, or if you feel that it's too easy because it only teaches grammar, please refer to it. Since I already know the basic grammar, I am waiting for a more in-depth lecture with a larger amount of toy projects. Even so, the reason I bought this lecture is because it feels like a GSAP native language dictionary to me, I bought it to keep it and take it out whenever I forget the grammar or method usage. I feel dizzy, so please upload all of Part 4 as soon as possible. ㅠ
Đánh giá 2
∙
Đánh giá trung bình 5.0
5
Wow, the lecture I was looking for is here... There are only lectures on vanilla JavaScript on the market, and no GSAP lectures except for the tutorials released within GSAP, but this lecture is really like lightㅜ I was looking for an animation library that can produce output in practice, and it's so goodㅜ Thank you so much for giving me the lecture, and since I'm grateful, please release the next lecture. I hope you'll be blessed, instructorㅎㅎ
Đánh giá 20
∙
Đánh giá trung bình 5.0
Đánh giá 4
∙
Đánh giá trung bình 5.0
5
I often have interaction projects, so I searched on Google and used the codes from related blogs, but I missed a lot of the basics. 😂 It's organized as a Notion document, so it's definitely easy to understand visually👍 The feedback is really good. The lecture quality is great. The explanations are detailed and problems are caught in advance. A little disappointing thing is that it would be good if you could add a few more examples. I want to see how it can be applied in this way with various examples. ㅎㅎ When you make a lecture, it takes a lot of time to make a good lecture, but even if it's not a lecture, I want to review the lecture content and see the instructor's various sources by giving a link to Codepan. Of course, you can search for it by keyword on Codepan, but it's hard to find sources created only using lectures. It was a really helpful lecture!
Đánh giá 3
∙
Đánh giá trung bình 5.0
5
While working, I found gsap in another site's code, and I wanted to study it, so I took the course! I was at a loss when looking at English sites, but there was a course that taught me from the basics like this! It's so great and has so many fun and diverse functions that I think the future of animation is gsap! I'm really looking forward to the next part~
925.315 ₫
Hãy khám phá các khóa học khác của giảng viên!
Khám phá các khóa học khác trong cùng lĩnh vực!