Thiết kế giao diện (UI/UX) Website bằng Figma
 

 

Thiết kế giao diện (UI/UX) Website bằng Figma
 
 
1. Giới thiệu
 
Figma là một ứng dụng gồm nhiều công cụ thiết kế trên nền tảng Website. Với Figma, bạn có thể sáng tạo không giới hạn giao diện người dùng (UI/UX), thiết kế tạo mẫu, tạo bài đăng trên các mạng xã hội và nhiều dự án thiết kế khác.
Khóa học Thiết kế giao diện (UX/UI) Website bằng Figma sẽ cung cấp kiến thức cơ bản và kỹ năng cần thiết để học viên có thể Thiết kế giao diện web/app đẹp, lấy người dùng làm trung tâm bằng phần mềm Figma. Tham gia khóa học, học viên nắm được nền tảng cơ sở về thiết kế giao diện (UX/UI); được giới thiệu các quy chuẩn thiết kế theo Material Design; hiểu và tạo được các thành phần trong Design System cho giao diện Website.
 
2. Mục tiêu khóa học 
 
Kỹ năng đạt được:
 
  • Có nền tảng cơ bản về thiết kế giao diện (UI/UX).
  • Cung cấp công cụ và tính năng mới nhất của Figma, ứng dụng Figma thiết kế UI/UX Web/ Mobile App.
  • Tạo ra prototype của giao diện để có thể tương tác, dùng thử.
  • Hiểu và biết cách ứng dụng các kiểu diễn hoạt Prototype để tạo ra những bản dùng thử có thể tương tác.
  • Tạo các banner quảng cáo động bằng plugin trên Figma dạng file .GIF, .MP4 nhanh chóng và dễ dàng,... tối ưu cho UX/UI thay vì phải dùng các phần mềm animation chuyên dụng.
  • Biết cách quản lý và export các thành phần trong file thiết kế để làm việc với developer.
  • Ứng dụng các plugin cần thiết để tăng hiệu quả cho công việc thiết kế.

Phương pháp đào tạo theo hướng dự án:

  • Học viên có được những trải nghiệm thực tiễn với dự án thực tế trong suốt quá trình học.
  • Học viên có thể thiết kế hoàn chỉnh giao diện UI/UX về web/app đẹp, lấy người dùng làm trọng tâm.

Chất lượng giảng dạy:

  • Giảng viên đã và đang thực hiện các dự án thực tiễn nên giàu kinh nghiệm thực tế.
  • Giảng viên đạt được chứng nhận chuyên môn từ các tổ chức trong lĩnh vực Mỹ thuật Đa phương tiện và được đánh giá cao.

3. Đối tượng tham dự

  • Những bạn muốn trở thành UI/UX Designer, thiết kế đồ hoạ.
  • Những bạn muốn học hỏi để có thêm kiến thức về UX/UI bổ trợ cho công việc.
  • Sinh viên theo học chuyên ngành CNTT tại các trường Đại Học và Cao đẳng.
  • Những người lập trình web/app muốn nghiên cứu về thiết kế Web và Mobile App.
  • Những người thiết kế freelance, thiết kế đồ họa cho các studio ảnh, các đơn vị quảng cáo.

4. Chứng nhận:

Học viên nhận được chứng nhận hoàn thành khóa học Thiết kế giao diện (UI/UX) Website bằng Figma do Trung tâm Công nghệ Phần mềm Đại học Cần Thơ cấp.
 
5. Thời lượng khóa học: 40 giờ
 
6. Nội dung chương trình:
 
- Giới thiệu về Figma và các thao tác cơ bản:
 
  • Khái niệm về UI/UX
  • Các quy luật và nguyên tắc cần biết trong thiết kế UI/UX
  • Vai trò của Figma trong dự án thực tế
  • Đăng ký Figma Education Plan
  • FigJam
  • Community của Figma
  • Chọn Đề tài cá nhân.
  • Thực hành (Figma)

 

- Component, Vector network & Style:

 
  • Shape, Group, Frame, Pages và các thuộc tính
  • Giới thiệu về Vector và các tính năng của Vector
  • Components và Variants
  • Plugin Figmotion
  • Plugin Mockup
  • Hướng dẫn vẽ và diễn hoạt mẫu switcher
  • Plugin Easometric
  • Thực hành (Figma)
  • Vẽ switcher (sử dụng Effect: Shadow)
 
- Design System:
 
  • Giới thiệu các quy chuẩn thiết kế theo Material Design
  • Biết cách tư duy hệ thống trong thiết kế theo Atomic Design (là cách phân cấp thành phần thiết kế)
  • Atomic Design và ứng dụng trong Design System
  • Màu sắc và Phân cấp thông tin
  • Hướng dẫn tạo hệ thống màu
  • Plugin Color Scheme
  • Tạo theo mẫu của Material Design
  • Tạo hệ thống chữ cho đề tài cá nhân
  • Hướng dẫn tạo design System (text style, color style)
  • Hướng dẫn grid và giới thiệu 1 số bố cục phổ biến
 
- Wireframing, User flow, Auto layout Auto layout và ứng dụng:
 
  • Hướng dẫn tạo Wireframe
  • Hướng dẫn tạo User Flow
  • Constraint
  • Responsive
  • Một số tips tăng tốc độ thiết kế Figma
 
- Prototype:
 
  • Lỗi UI thường gặp
  • Tính dễ sử dụng
  • Prototype (tương tác)
  • Text field
 
- Thực hành Thiết kế giao diện web thương mại điện tử:
 
  • Hướng dẫn thiết kế giao diện web thương mại điện tử
  • Thực hành Component Interaction
  • Scrollbar, Fillter 
 
- Prototype nâng cao:
 
  • Thực hành tạo Prototype Splash screen
  • Các kiểu chuyển động nhanh chậm dần
  • Ứng dụng After Delay
  • Carousel
  • Ứng dụng Interactive component
  • Ứng dụng After Delay, Drag to, Scroll to
 
- Trình bày đồ án & Tổng kết khóa học.
 
 
Chi tiết liên hệ:
 
Phòng Tư vấn – Trung tâm Công nghệ Phần mềm Đại học Cần Thơ.
Khu III - Đại học Cần Thơ, Số 01 – Lý Tự Trọng, Q. Ninh Kiều, TP. Cần Thơ.
Tel: 0292.3835.581
Zalo: 0582621345 (Aptech Cần Thơ).