Nội Dung Khóa Học
▶️ Phần 1: Các yếu tố cơ bản (Hiểu về Figma, các thành phần và công cụ cơ bản)
Bài 1 : Giới thiệu khóa học Figma
Bài 2 : Giới thiệu Figma
Bài 3 : Cách cài đặt
Bài 4 : Giao diện chính Figma
Bài 5 : Các section thuộc tính đối tượng
Bài 6 : Các công cụ cơ bản nhất
Bài 7 : Vẽ vector trong Figma
Bài 8 : Tổng kết phần mở đầu và bài tập
—–
▶️ Phần 2: Các yếu tố về frame (Frame là thành phần nền tảng và cốt lõi trong figma, chương này giúp bạn hiểu về frame)
Bài 9 : Giới thiệu frame
Bài 10 : Tạo và làm việc với frame
Bài 11 : So sánh frame và group
Bài 12 : Constraints của frame – siêu công cụ cho responsive
Bài 13 : Tổng kết chương và bài tập
—–
▶️ Phần 3: Autolayout (Autolayout là một công cụ rất hiểu quả để thực hiện dàn trải các thiết mang tính bố cục thứ tự)
Bài 14 : Giới thiệu autolayout
Bài 15 : Autolayout và text
Bài 16 : Tạo autolayout
Bài 17 : Thuộc tính chính của autolayout
Bài 18 : Resizing với autolayout
Bài 19 : Autolayout lồng ghép phức tạp
Bài 20 : Các demo và công dụng
Bài 21 : Bài tập autolayout: tạo chatbox
—–
▶️ Phần 4: Component/Instance/Variants (Công cụ nền tảng hỗ trợ cho sự tự động hóa trong figma)
Bài 22 : Giới thiệu về component/instance
Bài 23 : Bộ luật component
Bài 24 : Sử dụng component và instance như thế nào
Bài 25 : Variants – bản nâng cấp nâng tầm component
Bài 26 : Các thuộc tính của variants
Bài 27 : Một vài ví dụ của việc dùng variants
Bài 28 : Bài tập component: làm lịch với component
Bài 29 : Bài tập kết hợp: tạo responsive table
—–
▶️ Phần 5: Hệ thống hóa (Trong chương này chúng ta sẽ học cách để tạo ra các cấu trúc hệ thống cho file figma của bạn)
Bài 30 : Style là gì?
Bài 31 : Làm việc với color style
Bài 32 : Làm việc với text style
Bài 33 : Ứng dụng trong thực tế
Bài 34 : Các loại style khác
Bài 35 : Lưới trong Figma
Bài 36 : Bài tập: hệ thống icon
—–
▶️ Phần 6: Thực chiến (Đem kiến thức đã học ở các chương vừa rồi vào việc thực hiện một website/app)
Bài 37 : Làm web/app thì quy trình thế nào
Bài 38 : Vẽ sitemap bằng FigJam
Bài 39 : Dùng Figma dựng wireframe
Bài 40 : Stylish cho giao diện
Bài 41 : Dùng figma biến wireframe thành giao diện
—–
▶️ Phần 7: Prototype và trình diễn (Trình diễn trong figma giúp bạn làm rõ hơn về quy trình vận hành của web/app)
Bài 42 : Giới thiệu về prototype trong Figma
Bài 43 : Cách tạo interaction
Bài 44 : Setup prototype
Bài 45 : Các thuộc tính của interaction
Bài 46 : Overlay và các tính chất của overlay
Bài 47 : Animation trong Figma prototype
Bài 48 : Smart animate
Bài 49 : Đặc tính của smart animate
Bài 50 : Trình diễn thành phần và scrolling
Bài 51 : Interactive component
Bài 52 : Bài tập smart animate: loading screen
Bài 53 : Bài tập smart animate: one page menu
Bài 54 : Bài tập smart animate: header scroll-down menu
—–
▶️ Phần 8: Tổng kết (Tóm tắt các kiến thức đã học và sự nhắc nhở chung)
Bài 55 : Tổng kết khóa và tóm tắt kiến thức
Bài 56 : Một vài lời gợi ý và nhắn nhủ
