Đối Tượng Tham Gia:
- UI/UX Designer đang quan tâm tới variable và cách dùng
- Người đã học lớp figma căn bản và muốn đi sâu hơn
- Người đang cần quản lý hệ thống thiết kế chuyên sâu, phức tạp
Khóa Học Sẽ Dạy Những Gì?
- Các công cụ căn bản và nền tảng nhất của variable
- Các loại hình variable từ colors, number, string, boolean
- Cách làm việc với variable từ dễ tới khó và chi tiết
- Cách ứng dụng các loại variable khác nhau và nguyên lý, áp dụng nó vào thiết kế
- Tư duy công cụ khoa học, độc đáo và chuẩn bị sẵn sàng để có thể vận dụng vào công việc
Lợi Ích Sau Khóa Học:
- Thuần thục cách sử dụng công cụ variable
- Quy hoạch hệ thống có tầm nhìn, quy chuẩn để có thể mở rộng ra
- Dư sức vận dụng linh hoạt các loại hình variable để hỗ trợ thiết kế
- Sáng tạo và logic với các nguyên lý của prototype nâng cao
- Không bỏ sót bất cứ gì trong variable tools
- Nguyên một playlist bài tập, làm thoả thích. Các tài liệu và tài nguyên tại group cộng đồng Figma.
Nội Dung Khóa Học
▶️ Chương 1: Mở đầu
Bài 1: Định nghĩa Variable
Bài 2: Ý nghĩa của công cụ
Bài 3: Tính ứng dụng
Bài 4: Lấy education plan trong figma
—–
▶️ Chương 2: Căn bản & làm quen
Bài 5: Không gian làm việc
Bài 6: Tạo collection và variable
Bài 7: Các loại variable và sự hiển thị
Bài 8: Gán variables
Bài 9: Giới thiệu Variable mode
Bài 10: Bài tập chương
—–
▶️ Chương 3: Color variable
Bài 11: Xây thư viện
Bài 12: Tạo lặp vai trò của màu
Bài 13: Gán vào elements
Bài 14: Setup môi trường và mode
Bài 15: Ứng dụng vào thiết kế
Bài 16: Bài tập chương: setup library và modes
—–
▶️ Chương 4: Number Variable
Bài 17: Giới thiệu các ứng dụng
Bài 18: Nguyên lý và các phân loại
Bài 19: Setup thử
Bài 20: Gán vào các element
Bài 21: Chỉnh sửa biến góc
Bài 22: Bài tập chương: setup thiết kế
—–
▶️ Chương 5: Các loại variable khác
Bài 23: Giới thiệu
Bài 24: Ứng dụng của string
Bài 25: Ứng dụng của boolean
Bài 26: Bài tập chương: setup responsive
—–
▶️ Chương 6: Prototype nâng cao #1: Set Variable
Bài 27: Giới thiệu chung
Bài 28: Set variable và nguyên lý
Bài 29: Đưa vào thiết kế và hiển thị
Bài 30: Bài tập: Thay đổi kích cỡ thành phần
Bài 31: Bài tập: Product card in Cart
—–
▶️ Chương 7: Prototype nâng cao #2: Conditional & Nested
Bài 32: Giới thiệu điều kiện (conditional)
Bài 33: Các nguyên lý và công thức
Bài 34: Bài tập #1 Product Card
Bài 35: Bài tập #2 Select Options
Bài 36: Bài tập #3 Loading
—–
▶️ Chương 8: Prototype nâng cao #3 Variable mode
Bài 37: Giới thiệu
Bài 38: Bài tập #1: setup light/dark mode
Bài 39: Bài tập #2: setup theme mode
—–
▶️ Chương 9: Siêu bài tập cuối khoá
Bài 40: Giới thiệu về bài tập
Bài 41: Phân tích cấu trúc modal
Bài 42: Setup thành phần (component/variant)
Bài 43: Bố cục thiết kế lên giao diện (autolayout)
Bài 44: Setup màu sắc (color variable)
Bài 45: Setup khoảng cách (spacing variable)
Bài 46: Setup kích cỡ (size variable)
Bài 47: Setup sử dụng theme (mode)
Bài 48: Prototype #1 (change theme)
Bài 49: Prototype #2 (conditional selected)
Bài 50: Prototype #3 (PopUp Notification)
—–
▶️ Chương 10: Tổng kết
Bài 52: Tổng kết khoá
Bài 53: Các lộ trình học xa hơn



