Tổng quan

Khi người dùng truy cập một website, điều gì giữ họ ở lại lâu hơn? Chính là hiệu ứng trực quan, tương tác mượt mà và chuyển động hấp dẫn. Khóa học “Lập trình hiệu ứng nâng cao với JavaScript và SVG” sẽ đưa bạn vào thế giới đầy sáng tạo của hiệu ứng web – nơi lập trình và nghệ thuật giao thoa để tạo ra trải nghiệm người dùng vượt trội.

Khóa học bắt đầu từ những kiến thức cơ bản như tích hợp Bootstrap, FontAwesome, xử lý CSS với keyframes, đến cách dùng thư viện anime.js, scrollMonitor, và vẽ chuyển động bằng Adobe Illustrator + JavaScript. Đây là hành trình bạn sẽ học cách điều khiển từng khung hình chuyển động, từng layer, từng cú hover đều trở nên có chủ đích và sinh động.

Bài 01–05: Cài đặt cơ bản, tích hợp thư viện, keyframes, lý thuyết và thực hành TimeLine
Bài 06–14: Quản lý thời gian chuyển động (relative/absolute), CSS transitions, gia tốc, delay, callback, truyền tham số HTML
Bài 15–22: Callback nâng cao, các trạng thái chuyển động update/begin/run/complete, SVG bằng JS, charming xử lý text, sự kiện hover
Bài 23–33: Illustrator – tạo vector chuyển động, vẽ hình, vẽ khung, phân tích nguyên lý vẽ chuyển động, áp dụng into HTML với JavaScript
Bài 34–41: Sửa lỗi, tạo project chuyển động, thư viện scrollMonitor, kết hợp nhiều thư viện tạo hiệu ứng web hiện đại

Điểm đặc biệt là bạn không chỉ học code hiệu ứng đơn lẻ mà sẽ được hướng dẫn toàn bộ quy trình xây dựng một project hiệu ứng web hoàn chỉnh – từ bản vẽ trên Illustrator đến triển khai HTML/CSS, xử lý chuyển động bằng JavaScript và tinh chỉnh bằng scroll monitor. Đây là kiến thức mà các frontend chuyên nghiệp dùng để xây dựng website landing page, portfolio, trang giới thiệu sản phẩm… sống động và thuyết phục.

Không đơn thuần là “mỹ thuật số”, đây là kỹ năng giúp bạn biến website thành công cụ kể chuyện bằng hình ảnh – từ đó giữ chân người dùng và tăng trải nghiệm tương tác. Nếu bạn đang làm UI/UX, thiết kế web, hoặc làm sản phẩm cá nhân/freelance, khóa học này sẽ mở ra cánh cửa để bạn “nâng tầm” mọi sản phẩm web.