25 - Thiết kế hiệu ứng bằng Javascript và illustrator - Fedu

25 – Thiết kế hiệu ứng bằng Javascript và illustrator

Giảng viên: NGUYỄN ĐỨC VIỆT

Học phí (mua 1 lần học trọn đời) tại FEDU

650,000  299,000 

Học phí chỗ khác: 650,000 ₫

Học đến khi thành thạo thì thôi

Hoàn lại học phí nếu không hài lòng

Lưu ý: Hình thức học của Fedu là học ONLINE, chúng tôi không mở lớp dạy trực triếp hoặc offline. Học viên vui lòng cân nhắc trước khi đăng ký

Thời lượng: 12h

Bài học: 66 bài bài

Giới thiệu khóa học

Bạn đã biết đến Javascript và illustrator? Bạn thành thạo trong việc sử dụng hai công cụ trên để tạo ra sản phẩn thiết kế? Tuy nhiên bạn chưa biết cách kết hợp hai phần mềm đó để tự mình tạo ra những sản phẩm ấn tượng, đẹp mắt, hợp logic.

Hãy tham khảo khoá học “Thiết kế hiệu ứng bằng Javascript và illustrator” của Fedu. Khoá học mang đến phương pháp và giúp bạn thuần thục trong việc kết hợp giữa công cụ vẽ vector mạnh nhất của adobe là illustrator và công cụ viết hiệu ứng tương tác phổ biến nhất khi lập trình web là Javascript. Kết hợp để tạo nên hiệu ứng đẹp theo logic mong muốn.

Điểm nổi bật của khoá học là học qua các bài tập thực hành, nền tảng lý thuyết và các công cụ sử dụng sẽ hình thành qua các bài tập thực hành.
Khi nắm được phương pháp kết hợp giữa công cụ vẽ tự do illustrator và công cụ lập trình logic JS bạn có khả năng tự điều chỉnh, thiết kế, tương tác theo ý muốn.

THAM GIA KHOÁ HỌC, BẠN SẼ ĐƯỢC CUNG CẤP ĐẦY ĐỦ KIẾN THỨC VỀ:

  • Cơ bản về keyframes và Timeline
  • Nâng cao về chuyển động sử dụng Timeline: sử dụng tham số chuyển động bằng thuộc tính CSS, xử lí thời gian, gia tóc, độ trễ và thời lượng của chuyển động,…
  • Sử dụng callback, run, complete trong Timeline, Sử dụng Scroll Monitor
  • Sử dụng Charming JS: xử lí text chi tiết bằng charming, xử lí hiệu ứng di chuột, sửa lỗi khoảng trắng bằng white space
  • Bản chất hiệu ứng biến đổi hình dạng trong JavaScript
  • Thực hành vẽ chuyển động bằng illustrator và đưa vào JavaScript
  • Bổ sung và hoàn thiện kĩ năng thông qua bài tập thực hành

KHOÁ HỌC ĐANG HƯỚNG ĐẾN NHỮNG BẠN:

  • Học viên yêu thích về lập trình.
  • Học viên muốn tìm hiểu về cách thiết kế hiệu ứng bằng Javascript và illustrator theo một cách bài bản nhất.
  • Học viên đã biết đến và làm quen, sử dụng hai công cụ Javascript và illustrator

ĐỂ HOÀN THÀNH KHOÁ HỌC MỘT CÁCH TỐT NHẤT, HỌC VIÊN ĐĂNG KÍ THAM GIA CẦN CÓ:

  • Máy tính, laotop kết nối mạng ổn định
  • Kiến thức cơ bản về illustrator và javascript

Hãy tham gia ngay khoá học cùng Fedu để có trải nghiệm thiết kế đồ hoạ thú vị và bổ ích!

Nội dung khoá học

Phần 01 – Giới thiệu khóa học
 001 – Giới thiệu khoá học thiết kế hiệu ứng bằng Javascript và illustrator 

Phần 02 – Cài đặt cơ bản
 002 – Cài đặt cơ bản để bắt đầu học hiệu ứng 

 003 – Tích hợp thư viện bootstrap và fontawesome 

Phần 03 – Cơ bản về keyframes và Timeline
 004 – Chuyển động với keyframes 

 005 – Lý thuyết về Timeline 

Phần 04 – Nâng cao về chuyển động sử dụng Timeline
 006 – Thực hành về Timeline 

 007 – Xử lý thời gian trong TimeLine theo kiểu relative 

 008 – Xử lý thời gian trong TimeLine theo kiểu absolute 

 009 – Sử dụng tham số chuyển động bằng thuộc tính CSS 

 010 – Gia tốc, độ trễ, và thời lượng của chuyển động 

 011 – Triển khai nhiều chuyển động trong một dòng 

 012 – Hướng của chuyển động 

Phần 05 – Cách truyền tham số chuyển động
 013 – Truyền tham số chuyển động thông qua HTML thế nào 

 014 – Giải thích về việc gửi nhận dữ liệu 

 015 – Kết hợp truyền tham số với chuyển động 

Phần 06 – Sử dụng callback, run, complete trong Timeline
 016 – Sử dụng Callback trong khi thiết kế chuyển động 

 017 – Sử dụng Update, begin, run và complete 

Phần 07 – Chuyển động sử dụng tham số from – to
 018 – Tóm tắt kiến thức đã học 

 019 – Chuyển động sử dụng tham số from – to 

Phần 08 – Sử dụng Charming JS
 020 – Xử lý text chi tiết bằng ‘charming’ 

 021 – Sửa lỗi khoảng trắng khi sử dụng charming bằng white-space 

 022 – Xử lý hiệu ứng di chuột với anime và charming 

Phần 09 – Kết hợp JavaScript và illustrator
 023 – Vẽ bằng javascript SVG 

 024 – Vẽ hình bằng illustrator để làm chuyển động 

 025 – Hiểu nguồn gốc và nguyên lý vẽ chuyển động bằng javascript 

Phần 10 – Các bước thực hành biến hình đã thiết kế thành chuyển động
 026 – Chuyển động đầu tiên – Phần 1 – vẽ chuyển động bằng Adobe Illustrator 

 027 – Các bước biến hình đã thiết kế thành chuyển động 

 028 – Vẽ chữ, vẽ khung và làm chuyển động với Javascript 

Phần 11 – Thực hành làm chuyển động qua bài tập
 029 – Làm bài tập chuyển động – phần setup cơ bản và chuẩn bị 2 layer 

 030 – Làm chuyển động với khối HTML theo hình đã vẽ 

 031 – Áp dụng qui trình làm chuyển động 

 032 – Tạo layer mới trên HTML có sẵn 

Phần 12 – Thực hành vẽ chuyển động bằng illustrator và đưa vào JavaScript
 033 – Vẽ hình chuyển động trên Adobe illustrator 

 034 – Chuyển động Timeline bằng javascript 

 035 – Sửa lỗi chuyển động cách 1 

 036 – Sửa lỗi chuyển động cách 2 

Phần 13 – Sử dụng Scroll Monitor
 037 – Project số 2 phần HTML CSS 

 038 – Sử dụng thư viện scroll Monitor 

Phần 14 – Project số 2 phần vẽ illustrator
 039 – Vẽ hình chuyển động trên phần mềm Illustrator 

 040 – Xử lý CSS cho phần hình thành một layer trên web 

Phần 15 – Hoàn thiện hiệu ứng Project số 2
 041 – Viết javascript xử lý phần hiệu ứng 

 042 – Kết hợp hiệu ứng scrollMonitor và anime 

 043 – Thực hành bài 3 chuyển động vẽ – phần HTML và CSS 

 044 – Thực hành bài 3 chuyển động vẽ – phần JS 

Phần 16 – Bản chất hiệu ứng biến đổi hình dạng trong JavaScript
 045 – Hiểu bản chất hiệu ứng biến đổi hình dạng trong Javascript 

 046 – Thực hành hiệu ứng biến đổi 

Phần 17 – Phân tích và hướng dẫn các thao tác với hiệu ứng biến hình
 047 – Phân tích phần cấu trúc của hiệu ứng 

 048 – Phần CSS cho layer số 1 

 049 – Xử lý phần layer số 2 

 050 – Xử lý javascript cách 1 

Phần 18 – Hoàn thiện bài tập hiệu ứng biến hình bằng JavaScript
 051 – Hoàn thiện hiệu ứng với cách số 2 

 052 – Hướng dẫn hiệu ứng số 2 

 053 – Hướng dẫn hiệu ứng số 3 và 4 

Phần 19 – Giới thiệu hiệu ứng mặt nạ
 054 – Giới thiệu hiệu ứng mặt nạ 

 055 – Phân tích chuyển động và xử lý HTML-CSS 

 056 – Thực hành bài tập đơn giản để hiểu bản chất của hiệu ứng 

Phần 20 – Sáu hàm JavaScript sử dụng đóng gói hiệu ứng
 057 – Đóng gói hiệu ứng ở mức độ đơn giản 

 058 – Bốn hàm sử dụng để tạo HTML và gắn nội dung HTML 

 059 – Cách bọc một thẻ HTML trong một thẻ HTML khác 

 060 – Cách 2 dùng để gói HTML bằng javascript 

 061 – Thực hành 6 hàm javascript đã học 

Phần 21 – Thực hành đóng gói hiệu ứng mặt nạ
 062 – Đóng gói hiệu ứng – phần HTML 

 063 – Đóng gói code sử dụng function 

 064 – Hoàn chỉnh phần plugin hiệu ứng 

Phần 22 – Hoàn thiện hiệu ứng
 065 – Tích hợp scroll Monitor 

 066 – Viết function hoàn thiện scroll Monitor 

HỌC VIÊN SAU KHI THAM GIA KHOÁ HỌC SẼ HOÀN TOÀN TỰ TIN:

  • Hiểu bản chất của thiết kế hiệu ứng bằng Javascript và illustrator
  • Kết hợp giữa công cụ vẽ vector mạnh nhất của adobe là illustrator và công cụ viết hiệu ứng tương tác phổ biến nhất khi lập trình web là Javascript.
  • Tạo nên những hiệu ứng đẹp theo logic mong muốn.

NGUYỄN ĐỨC VIỆT

  • Sinh năm 1986, tốt nghiệp Đại học Bách khoa, khoa Công nghệ thông tin. Anh hiện đang là Giảng viên Thiết kế web.
  • Với 8 năm kinh nghiệm giảng dạy, anh đã có hàng nghìn học viên đã tốt nghiệp và làm việc trong lĩnh vực thiết kế, đặc biệt là thiết kế web chuyên nghiệp. Ngoài ra anh còn tham gia rất nhiều dự án web cho FPT và các dự án Freelance khác về thiết kế web dựa trên ngôn ngữ lập trình mã nguồn mở, PHP, .NET
  • Anh đã tham gia hiệu đính và dịch rất nhiều đầu sách về thiết kế web cho hệ thống thư viện đại học FPT.
  • Ngoài ra anh còn tham gia rất nhiều dự án web cho FPT, dạy các shortcourse cho người đi làm và các dự án Freelance khác về thiết kế web dựa trên ngôn ngữ lập trình mã nguồn mở.

Đánh giá

Chưa có đánh giá nào.

Hãy là người đầu tiên nhận xét “25 – Thiết kế hiệu ứng bằng Javascript và illustrator”

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *

25 – Thiết kế hiệu ứng bằng Javascript và illustrator 299,000 đ ĐĂNG KÝ NGAY