Khóa học Figma UI Design
Lịch khai giảng
Tham gia group facebook UI UX VN
Mô tả Khóa học Figma UI Design
Khóa học Figma UI Design từ cơ bản đến nâng cao sẽ giúp bạn:
- Nhanh chóng thành thạo các công cụ và tính năng mới nhất của Figma cho thiết kế UI/UX Web/ Mobile App. Giáo trình luôn cập nhật thường xuyên theo những thay đổi của Figma.
- Biết cách phân tích để vẽ và quản lý các thành phần trên giao diện đúng cách và hiệu quả bằng Figma
- Có được nền tảng cơ sở về thiết kế giao diện.
- Biết cách tư duy có hệ thống theo atomic design.
- Biết cách tạo và quản lý các thành phần thiết kế trong design system.
- Biết về quy chuẩn của thành phần thiết kế theo các design system lớn như Material Design, Ant Design…
- Biết cách tạo và diễn hoạt các mẫu prototype có thể tương tác được để thể hiện ý tưởng, thử nghiệm với người dùng. Hoặc tạo các đoạn animation đơn giản cho mục đích truyền thông, quảng cáo.
- Biết cách quản lý và bàn giao thiết kế khi 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ế.
Khóa học Figma UI Design phù hợp với ai?
- Các bạn Junior Designer cần sử dụng thành thạo Figma trong thiết kế UX-UI Website hoặc Mobile App.
- Các bạn đã và đang là UX UI Designer hay đã tham gia các khóa học về Tư Duy Thiết Kế UX/UI tại Keyframe, muốn sử dụng Figma hiệu quả để tối ưu cho quá trình thiết kế của mình.
- Các bạn UXUI Designer đang sử dụng công cụ khác muốn chuyển sang Figma.
- Các bạn làm vai trò quản lý muốn ứng dụng tư duy hệ thống và quy trình thiết kế bằng Figma trong công việc.
- Những bạn mới bắt đầu tìm hiểu về Thiết Kế UX,UI cũng phù hợp với khóa học này.
Học Qua Hình Thức Trực Tuyến Zoom Với Giảng Viên Có Gì Khác Với Offline Không?
- Cùng xem cảm nhận của các bạn học viên khi tham gia hình thức này nhé.
Giảng viên
-
Anh Lê Minh Quang có hơn 5 năm kinh nghiệm thiết kế. Là một người yêu thích và mong muốn chia sẻ các kiến thức và lợi ích mà Figma mang lại cho UI/UX Design. Hiện đang làm Freelancer.
Giáo trình
-
1 Buổi
Buổi 01 - Tổng quan về Figma và UI Design
- Giới thiệu lộ trình học
- Giới thiệu các nguồn tham khảo
- Khái niệm về UI và UX
- Công việc thiết kế UI trong thực tế
- Định luật Jacob và sự quen thuộc trong thiết kế UI/UX
- Vai trò của Figma trong dự án thực tế
- Đăng ký Figma Education Plan
- Figjam
- Quản lý Team, Project, File
- Community của Figma
- Figma Mirror
- Thực hành các thao tác cơ bản trên file
- Observation mode
- Comment
- Share
- Cách tổng hợp các mẫu tham khảo giao diện trên thực tế cho đồ án cuối khoá
-
1 Buổi
Buổi 02 - Các công cụ tạo hình
- Vẽ icon, hình minh họa bằng vector network, shape, boolean
- Vẽ hình tờ giấy bằng vector network
- Vẽ hình huy hiệu và hình ổ khóa bằng shape cơ bản và boolean
- Vẽ và tô màu viên kim cương
- Plugin: Blush
- Bài tập
- Vẽ icon, hình minh họa bằng vector network, shape, boolean
-
1 Buổi
Buổi 03 - Atomic Design, Design System, Color System, Type System
- Giới thiệu về Atomic Design và Design System
- Tạo text style
- Tạo color style
- Plugin: Styler, Batch Styler
- Sao chép, chia sẻ style
- Bài tập
-
1 Buổi
Buổi 04 - Grid, constraint, auto layout
- Hệ kích thước 4-point grid
- Ứng dụng của grid trong thực tế
- Breakpoints
- Fixed, fluid, adaptive & responsive layouts
- Cách quan sát, phân tích responsive của một giao diện thực tế
- Tạo layout grid style
- Smart Selection
- Đo khoảng cách giữa các thành phần
- Tạo Guides
- Frame & Constraint
- Auto-layout
- Bài tập
-
1 Buổi
Buổi 05 - Hệ thống icon và button
- Component & Variant
- Hệ thống icon
- Hệ thống button
- Modal Bài tập
-
1 Buổi
Buổi 06 - Thực hành: UI trang đăng nhập, tạo tài khoản
- Thực hành vẽ UI trang đăng nhập, tạo tài khoản cho desktop và mobile
- Tạo prototype
-
1 Buổi
Buổi 07 - Thực hành: UI app nhắn tin và mạng xã hội
- Tạo các component trên giao diện desktop
- Áp dụng constraint
- Tạo giao diện responsive cho tablet và phone
- Tạo prototype: while pressing, open overlay, overflow behavior
- Hướng dẫn về UI app mạng xã hội
- Ứng dụng đối tượng chứa hình ảnh giữ đúng tỉ lệ
- Tạo giao diện responsive cho tablet và phone
- Tạo prototype: while pressing, open overlay, overflow behavior
- Hướng dẫn về UI app mạng xã hội
- Ứng dụng đối tượng chứa hình ảnh giữ đúng tỉ lệ
-
1 Buổi
Buổi 08 - Thực hành: UI trang thương mại điện tử, CMS
- Tạo các component, section của trang chủ
- Tạo button chọn thuộc tính sản phẩm
- Tạo component mã giảm giá có chi tiết đồ hoạ rời
- Tạo component Stepper
- Tạo component cấu trúc bảng
- Tạo prototype cho bảng CMS
- Tạo component Stepper
- Tạo component cấu trúc bảng
- Tạo prototype cho bảng CMS
-
1 Buổi
Buổi 09 - Prototype nâng cao
- Ứng dụng của các trigger và action: After delay,On drag, Keyboard/Gamepad, Mouse, Scroll to, Back…
- Các kiểu easing của chuyển động
- Smart Animate và các animation preset
- Các cách nối prototype nhanh và hiệu quả
- Ứng dụng của prototype trong thực tế
-
1 Buổi
Buổi 10 - Các lưu ý khi trình bày, bàn giao thiết kế; Hướng dẫn đồ án cuối khóa
- Các định dạng và kích thước khi export
- Công cụ Slice, Section
- Các plugin hỗ trợ tạo mockup,
- Cách record prototype
- Hướng dẫn đồ án cuối khóa
-
1 Buổi
Buổi 11 - Sửa bài đồ án cuối khóa, giải đáp các thắc mắc chung
- Sửa bài đồ án cuối khóa
- Giải đáp các thắc mắc chung
-
1 Buổi
Buổi 12 & 13 - Hỗ trợ dự án (Remote qua Meet)
-
1 Buổi
Buổi 14 - Tổng kết
- Trình bày đồ án
- Tổng kết khóa học
- Hỏi đáp, chia sẻ cuối khoá
-
1 Buổi
Buổi 01 - Tổng quan về Figma và UI Design
-
Có hơn 9 năm kinh nghiệm làm việc trong lĩnh vực thiết kế và UI/UX, Hiện anh Lộc Nguyễn đang là Lead Designer tại Rooster Beer Vietnam.
Giáo trình
-
1 Buổi
Buổi 01 - Tổng quan về Figma, các thao tác cơ bản
- Giới thiệu lộ trình học
- Giới thiệu các sách về sáng tạo và UI/UX
- Khái niệm về UI và UX
- Công việc thiết kế UI Design
- Các nguồn tham khảo tin cậy về UI/UX
- Định luật Jacob và sự quen thuộc 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
- Thực hành
- Đề tài cá nhân
-
1 Buổi
Buổi 02 - Vector network & Style
- Phương pháp Squint test
- Hướng dẫn vẽ viên kim cương bằng Vector network.
- Plugin: Color Scheme
- Vẽ icon new document.
- Ứng dụng Component vẽ huy hiệu
- Mask
- Plugin Figmotion
- Hướng dẫn vẽ và diễn hoạt mẫu switcher
- Bài tập
-
1 Buổi
Buổi 03 - Vector network & Style (cont)
- Thực hành vẽ nâng cao
- Hướng dẫn ứng dụng component vẽ viên gạch
- Hướng dẫn vẽ căn phòng isometric
- Plugin Easometric
- Bài tập
-
1 Buổi
Buổi 04 - Atomic Design, Design System, Color System, Type System
- Cách tìm cảm hứng màu sắc
- 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
- Plugin Styler
- Thực hành generate, extract style
- Bài tập
-
1 Buổi
Buổi 05 - Layout, grid, spacing, Icon, Button
- Hướng dẫn tạo grid
- Constraint
- 8-point grid
- Hướng dẫn tạo hệ thống Icon
- Hướng dẫn tạo hệ thống Button
- Hướng dẫn vẽ mẫu Modal
- Bài tập
-
1 Buổi
Buổi 06 - Thực hành component, auto-layout
- Hướng dẫn variant component Text field
- Hướng dẫn vẽ UI trang Login
- Bài tập
-
1 Buổi
Buổi 07 - Thực hành component, auto-layout (Cont)
- Hướng dẫn vẽ giao diện trang Contact
- Hướng dẫn tạo prototype
-
1 Buổi
Buổi 08 - Thực hành nâng cao: App nhắn tin
- Hướng dẫn vẽ UI App nhắn tin
-
1 Buổi
Buổi 09 - Thực hành nâng cao: App nhắn tin (tiếp tục) & Mạng xã hội
- Hướng dẫn vẽ UI App nhắn tin (Cont)
- Responsive cho tablet và mobile
- Tạo prototype
- Hướng dẫn vẽ UI mạng xã hội
- Ứng dụng đối tượng chứa hình giữ đúng tỉ lệ
-
1 Buổi
Buổi 10 - Thực hành nâng cao: Giao diện trang thương mại điện tử
- Hướng dẫn vẽ giao diện app thương mại điện tử
- Hướng dẫn tạo component chip chọn thuộc tính sản phẩm
- Hướng dẫn tạo component nhãn răng cưa chọn mã giảm giá
- Hướng dẫn tạo component stepper
- Hướng dẫn tạo component milestone giao hàng
-
1 Buổi
Buổi 11 - Thực hành nâng cao: Giao diện CMS
- Hướng dẫn vẽ giao diện CMS quản lý sản phẩm
- Hướng dẫn tạo component cấu trúc dòng của bảng
- Bài tập
-
1 Buổi
Buổi 12 - 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
- Giao diện app bản đồ
- Plugin Mapsicle
- Ứng dụng Scroll to
-
1 Buổi
Buổi 13 - Trình bày, bàn giao thiết kế
- Hiểu về độ phân giải
- Các định dạng file svg, png, jpeg, pdf
- Hướng dẫn quy hoạch, đặt tên, sắp xếp, ghi chú cho các thành phần trong file thiết kế.
- Hướng dẫn xuất PDF nhiều trang
- Hướng dẫn tạo webfont bằng icomoon
-
1 Buổi
Buổi 14 - Trình bày đồ án & Tổng kết khóa học
- Trình bày đồ án
- Tổng kết khóa học
- Chia sẻ hướng đi, apply Job, Freelancer
-
1 Buổi
Buổi 01 - Tổng quan về Figma, các thao tác cơ bản
-
Chị Hoàng Giang có hơn 10 năm kinh nghiệm làm việc trong lĩnh vực Product Design. Hiện là UI/UX leader tại TrueMoney Vietnam, đồng thời là người tổ chức cộng đồng Friends of Figma, Hà Nội.
Giáo trình
-
1 Buổi
Buổi 01 - Tổng quan về Figma, các thao tác cơ bản
- Giới thiệu lộ trình học
- Giới thiệu các sách về sáng tạo và UI/UX
- Khái niệm về UI và UX
- Công việc thiết kế UI Design
- Các nguồn tham khảo tin cậy về UI/UX
- Định luật Jacob và sự quen thuộc 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
- Thực hành
- Đề tài cá nhân
-
1 Buổi
Buổi 02 - Vector network & Style
- Phương pháp Squint test
- Hướng dẫn vẽ viên kim cương bằng Vector network
- Plugin: Color Scheme
- Vẽ icon new document
- Ứng dụng Component vẽ huy hiệu
- Mask
- Plugin Figmotion
- Hướng dẫn vẽ và diễn hoạt mẫu switcher
- Bài tập
-
1 Buổi
Buổi 03 - Vector network & Style (cont)
- Thực hành vẽ nâng cao
- Hướng dẫn ứng dụng component vẽ viên gạch
- Hướng dẫn vẽ căn phòng isometric
- Plugin Easometric
- Bài tập
-
1 Buổi
Buổi 04 - Atomic Design, Design System, Color System, Type System
- Cách tìm cảm hứng màu sắc
- 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
- Plugin Styler
- Thực hành generate, extract style
- Bài tập
-
1 Buổi
Buổi 05 - Layout, grid, spacing, Icon Button
- Hướng dẫn tạo grid
- Constraint
- 8-point grid
- Hướng dẫn tạo hệ thống Icon
- Hướng dẫn tạo hệ thống Button
- Hướng dẫn vẽ mẫu Modal
- Bài tập
-
1 Buổi
Buổi 06 - Thực hành component, auto-layout
- Lý thuyết về Auto-layout
- Tips and Tricks
- Thực hành vẽ auto-layout cho table
-
1 Buổi
Buổi 07 - Thực hành component, auto-layout (Cont)
- Lý thuyết về component, variant
- Cách dùng component
- Hướng dẫn vẽ UI trang Login
- Hướng dẫn tạo prototype
- Bài tập
-
1 Buổi
Buổi 08 - Thực hành nâng cao: App nhắn tin
- Adapt giao diện vào wireframe có sẵn
- Hướng dẫn vẽ UI App nhắn tin
-
1 Buổi
Buổi 09 - Thực hành nâng cao: App nhắn tin (tiếp tục) & Mạng xã hội
- Hướng dẫn vẽ UI App nhắn tin (Cont)
- Tạo prototype
- Hướng dẫn vẽ UI mạng xã hội
- Ứng dụng đối tượng chứa hình giữ đúng tỉ lệ
-
1 Buổi
Buổi 10 - Thực hành nâng cao: Giao diện trang thương mại điện tử
- Hướng dẫn vẽ giao diện app thương mại điện tử
- Hướng dẫn tạo component chip chọn thuộc tính sản phẩm
- Hướng dẫn tạo component nhãn răng cưa chọn mã giảm giá
- Hướng dẫn tạo component stepper
- Hướng dẫn tạo component milestone giao hàng
-
1 Buổi
Buổi 11 - Thực hành nâng cao: Giao diện CMS
- Hướng dẫn vẽ giao diện CMS quản lý sản phẩm
- Hướng dẫn tạo component cấu trúc dòng của bảng
- Bài tập
-
1 Buổi
Buổi 12 - 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
- Giao diện app bản đồ
- Plugin Mapsicle
- Ứng dụng Scroll to
-
1 Buổi
Buổi 13 - Trình bày, bàn giao thiết kế
- Hiểu về độ phân giải
- Các định dạng file svg, png, jpeg, pdf
- Hướng dẫn quy hoạch, đặt tên, sắp xếp, ghi chú cho các thành phần trong file thiết kế.
- Hướng dẫn xuất PDF nhiều trang
- Hướng dẫn tạo webfont bằng icomoon
-
1 Buổi
Buổi 14 - Trình bày đồ án & Tổng kết khóa học
- Trình bày đồ án
- Tổng kết khóa học
- Chia sẻ hướng đi, apply Job, Freelancer
-
1 Buổi
Buổi 01 - Tổng quan về Figma, các thao tác cơ bản
Lớp: 23K36Q
Khai giảng ngày: 07/06/2023
Giảng viên: Lê Minh Quang
Số buổi học: 14
Trình độ: Cơ bản - Nâng cao
Học phí: 5,800,000đ
Địa điểm: 06 Phan Đình Giót, P.2, Q.Tân Bình, TP.HCM
Hỗ trợ thư viện video bài giảng. Giúp bạn sở hữu trọn vẹn kiến thức dù có vắng học.
Lớp: 23RK37G - Remote
Khai giảng ngày: 19/06/2023
Giảng viên: Hoàng Giang
Số buổi học: 14
Trình độ: Cơ bản - Nâng cao
Học phí: 5,800,000đ
Địa điểm: Học trực tuyến với giảng viên qua Zoom/ Google Meet...
Hỗ trợ thư viện video bài giảng. Giúp bạn sở hữu trọn vẹn kiến thức dù có vắng học.
Lớp: 23HK38G
Khai giảng ngày: 25/07/2023
Giảng viên: Hoàng Giang
Số buổi học: 14
Trình độ: Cơ bản - Nâng cao
Học phí: 5,800,000đ
Địa điểm: Số 1, Ngõ 21, Lê Văn Lương, P. Nhân Chính, Q. Thanh Xuân, HN
Hỗ trợ thư viện video bài giảng. Giúp bạn sở hữu trọn vẹn kiến thức dù có vắng học.
Tác phẩm học viên
reGreen App
Hồ Hoàng Phương Uyên
Harry Potter Shopping Website
Nguyễn Ngọc Minh Trí
Creative Exercise
Greenider
Nguyễn Tuyết Linh
Comic App
Nguyễn Quang Thiện
Book Reading Real Read App
Nguyễn Viết Huy
Hi Skneaker (Hysk)
Bùi Trung Kiên
RVO - Website xem phim trực tuyến
Hoàng Gia Phúc
Thông tin chi tiết
Khoá học Figma UI Design nằm trong Lộ trình học UX/UI Product Design Toàn Diện
- Nếu bạn là người mới thì có thể tham khảo lộ trình dài hạn này nhé.
Vì Sao Bạn Nên Học Figma UI Design Tại Keyframe?
- Được học và tương tác trực tiếp với giảng viên tại lớp học Offline SG/ HN hoặc Remote Teaching qua Zoom tùy theo hình thức học bạn chọn.
- Hỗ trợ thư viện online video bài giảng, giúp bạn sở hữu trọn vẹn kiến thức dù có vắng học.
- Được mentor 1:1 khi làm bài tập và dự án cá nhân xuyên suốt khóa học. Mục tiêu là hoàn thiện sản phẩm khi hoàn thành khóa học để cập nhật vào Portfolio.
- Hỗ trợ kiến thức mãi mãi.
- Keyframe cấp chứng chỉ khi hoàn thành khóa học.
Đừng Ngần Ngại
- Hãy liện hệ với chúng tôi qua https://www.facebook.com/KeyframeMultimediaSchool hoặc chat ngay góc phải màn hình để được tư vấn.
- Ưu đãi ngay 10% khi đăng ký theo nhóm 2 người trở lên.
- Ưu đãi 15% khi đăng ký lộ trình học từ 3 khóa trở lên. Xem thông tin lộ trình học thiết kế UIUX Product Design Completed tại link sau: https://keyframe.vn/cth/chuong-trinh-hoc-uiux-design-completed-4.html
FAQ
Mọi thắc mắc và cần hỗ trợ, vui lòng gọi: (028)39972268 | 0979106109 | 0778478568
-
Quy trình đặt chỗ học
Đóng học phí trực tiếp tại Keyframe
- HCM: Lầu M, 06 Phan Đình Giót, P. 2, Q. Tân Bình, TP. HCM (Xem bản đồ)
- Từ thứ 2 đến thứ 7 : 09h00 – 21h00
- Chủ nhật : 09h00 - 17h00
- Hà Nội: Số 1, Ngõ 21, Lê Văn Lương, P. Nhân Chính, Q. Thanh Xuân, Hà Nội (Xem bản đồ)
- Từ thứ 2 đến thứ 7 : 15h00 – 21h00
Đóng học phí thông qua chuyển khoản nhanh
- Vietcombank
- Tô Dương Phương Bình – 0071004405302
- HCM: Lầu M, 06 Phan Đình Giót, P. 2, Q. Tân Bình, TP. HCM (Xem bản đồ)
-
Học xong có được giới thiệu việc làm không?
- Keyframe cam kết giới thiệu việc làm đối với học viên hoàn thành lộ trình toàn diện của các chương trình học.
-
Giá trị bằng cấp tại Keyframe
- Keyframe cấp chứng chỉ đối với học viên đạt tiêu chuẩn hoàn thành khoá học Offline/ Remote Teaching tại Keyframe (Chứng chỉ này có giá trị xác nhận đã hoàn thành học tại Keyframe)
- Keyframe không cấp chứng chỉ đối với học viên tham gia khoá học Online Video.
Cảm nhận học viên
Khoá học cơ bản. Tiến độ hơi nhanh so với người mới bắt đầu và không có kiến thức về graphic design, tuy nhiên thầy support rất nhiệt tình, giảng dạy cũng tận tâm.
Hành trình 14 buổi học UI Figma với khoá 23K32L và thầy Lộc là một kỉ niệm đẹp với mình ở Keyframe. Tin mình đi, các bạn sẽ ko cảm thấy phí tiền đâu, khoá học rất đáng đồng tiền bát gạo. Từ dịch vụ ở Keyframe, đến chất lượng giáo án và đặc biệt là giảng viên - một người mình đã học hỏi được rất nhiều điều, cả kiến thức lẫn kinh nghiệm trong nghề. Trong lúc học, thầy Lộc truyền đạt những kiến thức rất chi tiết, chia sẻ những tips nhỏ, quan tâm đến học viên tụi mình có theo kịp bài giảng hay ko. Thầy cũng tạo nhiều kênh liên hệ để giúp đỡ học viên hoàn thành tốt bài tập về nhà, đồ án cuối khoá cũng như trả lời những câu hỏi của tụi mình ngoài giờ trên lớp. Đây là cảm nhận thật của mình, bạn nào đang còn phân vân ko biết nên học Figma ở đâu (như mình lúc 2 tháng trc :)))) thì bạn nên thử đặt niềm tin ở Keyframe thử. ^^ Câu cuối, mình cảm ơn thầy Lộc và Keyframe vì sự tâm huyết trong lĩnh vực giảng dạy ngành đồ hoạ nhé.
Lộ trình học của mình thật ra không phải bắt đầu từ khóa UX/UI nhưng nhờ sự dẫn dắt của Mentor Lộc Nguyễn, thầy đã dạy rất nhiệt tình, giải đáp thắc mắc kịp thời, mình đã làm được thành quả hơn cả mong đợi. Cám ơn trung tâm, thầy và các bạn đã mang đến cho mình trải nghiệm tốt đẹp về khóa học đầu tiên của mình. Không chắc mình có thể theo ngành, nhưng nếu đây là khởi đầu của mình thì đã rất là thuận lợi rồi.
Tôi vừa kết thúc khóa học vào t7 tuần trước nhưng phải hôm nay tôi mới có thời gian để viết cảm nhận khóa học được. Sau khóa học điều mà tôi cảm nhận được rõ nhất đó là những kiến thức sâu rộng của giáo viên giảng dạy. Cô rất nhiệt tình chia sẻ kiến thức giúp học viên lắm được những kiến thức cần thiết trong khóa học. Cảm ơn cô và cảm ơn trung tâm
Lớp học Figma rất bổ ích, đầy đủ thông tin để giúp 1 người chưa có nền tảng về phần mềm có thể sử dụng khá thành thạo. Giảng viên Hoàng Giang đã chia sẻ cho chúng tôi nhiều thông tin và kiến thức qua các bài giảng, và qua kinh nghiệm làm việc thực tế của cô. Cám ơn cô giáo và trung tâm KeyFrame rất nhiều.