Khóa học Figma UI Design

Khóa học Figma UI Design

Lịch khai giảng

    • Lớp: 25K65Q

      Khai giảng ngày: 14/05/2025

      Giờ học: 18:30 - 21:00

      Lịch học: Thứ 4, Thứ 7

      Giảng viên: Lê Minh Quang

      Thời lượng: 14 buổi học

      Trình độ: Cơ bản - Trung cấp

      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: 25RK66L - Remote

      Khai giảng ngày: 10/06/2025

      Giờ học: 19:00 - 21:30

      Lịch học: Thứ 3, Thứ 5

      Giảng viên: Lộc Nguyễn

      Thời lượng: 14 buổi học

      Trình độ: Cơ bản - Trung cấp

      Học phí: 5,800,000đ

      Địa điểm: Học trực tuyến với giảng viên qua Zoom/ Meet/ Classin...

      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.  


  • Sắp có lịch mới
    Liên hệ Keyframe để được hỗ trợ

Học viên review khóa học Figma UI Design tại Keyframe?

Mô tả Khóa học Figma UI Design

Khóa học Figma UI Design từ cơ bản đến trung cấp 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ế UXUI Product Design. 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 Google Meet 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

  • Có duyên với ngành thiết kế từ năm 2012, với các công việc làm về Packaging, Digital, UI/UX,... Từ năm 2018, mình đã bắt đầu định hình được thế mạnh về UI/UX, vậy là mình bắt đầu nghiêm túc nghiên cứu và phát triển sự nghiệp ở mảng này. Hiện tại mình đang là Lead Designer tại Rooster Beers từ năm 2020.

    Giáo trình

  • 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 TT CNTT - Tập đoàn Viettel, đồ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 - Làm quen & Tổng quan UI/UX
      • Làm quen
      • 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 vẽ các hình cơ bản
    • 1 Buổi Buổi 02 - Vector network & Các yếu tố cơ bản part 1
      • Khái niệm vector network
      • Thực hành vẽ icon new document
      • Phương pháp Squint test
      • Các yếu tố cơ bản của Visual design
      • Chi tiết yếu tố cơ bản: Typography, color
      • Thực hành công cụ soạn chữ
      • Thực hành công cụ tô màu
      • Quy tắc sử dụng màu sắc 60-30-10
      • Kiểm tra độ tương phản về màu sắc
      • Plugin: Stark
      • Hướng dẫn vẽ viên kim cương bằng Vector network
      • Mask
    • 1 Buổi Buổi 03 - Vector network & Các yếu tố cơ bản part 2
      • Thực hành vẽ icon huy hiệu
      • Chi tiết yếu tố cơ bản: Iconography
      • Plugin: iconify
      • Một số yếu tố cơ bản khác: line, size, shape, image, link, button, input
      • Phân biệt ảnh vector và bitmap
      • Thực hành vẽ nâng cao bộ icon
      • Bài tập thực hành vẽ ổ khóa
      • Chọn đề tài
    • 1 Buổi Buổi 04 - Layout & Auto layout
      • Khái niệm cơ bản về layout
      • Các cách tạo layout: Grids (lưới) basic/layout
      • 8-point grid
      • Hướng dẫn tạo lưới tương ứng trên các thiết bị đáp ứng responsive layout
      • Mẹo dùng lưới
      • Phương thức tạo vách ngăn (containment)
      • Vai trò của negative/white space (không gian âm/khoảng trắng) trong thiết kế
      • Giới thiệu tổng quan về Auto-layout
      • Thực hành tạo Button
      • Thêm/sửa/xóa các phần tử trong auto layout
      • Bài tập vẽ giao diện social media (facebook/instagram)
    • 1 Buổi Buổi 05 - Auto layout
      • Hướng, khoảng cách, đệm
      • Áp dụng khoảng cách âm
      • Nested auto layouts
      • Cài đặt và điều khiển auto layout
      • Thực hành tạo nav bar, check list, card, task card
      • Bài tập áp dụng auto layout cho giao diện social media
      • Tips & tricks
      • Thay đổi kích thước linh động trong auto layout
      • Các ràng buộc constraints
      • Vị trí tuyệt đối
      • Thực hành tạo noti label cho icon
      • Bài tập vẽ giao diện dashboard/quản lý contact
    • 1 Buổi Buổi 06 - Component
      • Lý thuyết về component, variant
      • Cách dùng component
      • Áp dụng tạo component cho các đối tượng đã tạo auto layout: nav bar, check list, card, task card
      • Hướng dẫn tạo 1 variants phức tạp gồm nhiều trường thuộc tính
      • Đổi tên và sắp sếp lại các trường thuộc tính
      • Giá trị boolean trong variants
      • Cấu trúc đặt tên của variants
      • Thực hành tạo variants: banner thông báo, inputs text
      • Bài tập tạo component cho các thành phần trong giao diện quản lý
    • 1 Buổi Buổi 07 - Component nâng cao
      • Chữa bài tập
      • Tips and tricks
      • Thực hành tạo variants: avatars, sticky notes, switcher, mobile và tablet menu
      • Text property
      • Sửa text properties từ design panel
      • Chỉnh sửa thuộc tính văn bản hàng loạt
      • Boolean property
      • Áp dụng boolean property vào card nội dung
      • Instance swap property
      • Áp dụng thuộc tính hoán đổi cá thể trong bộ icon
      • Expose nested instance
      • Áp dụng hiển thị các thuộc tính lồng nhau cho thẻ nội dung và button
      • Phân biệt cách sử dụng variant và component properties
      • Chỉnh sửa hàng loạt trong component set
      • Thực hành: tạo variant tin nhắn, button, toast banner, task cards
    • 1 Buổi Buổi 08 - Atomic design và design system part 1
      • Tư duy theo Atomic design
      • Tổng quan về design system
      • Tham khảo 1 số bộ design system nổi tiếng
      • Các thành phần của design system
      • Lợi ích của việc sử dụng design system
      • Trở ngại của việc áp dụng design system
      • Tạo hệ thống chữ (typography)
      • Thực hành tạo hệ thống chữ theo mẫu của material design
      • Plugin: type scale, lorem ipsum, nisa text, styler,...
      • Bài tập thực hành vẽ giao diện app thương mại điện tử
    • 1 Buổi Buổi 09 - Design system part 2
      • Chữa bài tập app TMĐT
      • Tạo hệ thống màu (color): mô hình màu, cách chọn màu
      • Plugin: image palette, color generator, color palette
      • Thực hành tạo hệ thống màu
      • Tạo hệ thống iconography
      • Hệ thống spacing, grid: 8px, tỉ lệ khung hình, mục tiêu chạm
      • Tạo hệ thống button
      • Thêm ảnh động vào thiết kế
      • Plugin: Lottiefiles
    • 1 Buổi Buổi 10 - IA, flow, wireframe, variable
      • Tổng quan kiến trúc thông tin (IA)
      • Flow và User flows
      • Hướng dẫn thực hành vẽ wireframes
      • Sử dụng lo-fi wireframe kit
      • Sử dụng component từ các design system có sẵn
      • Adapt giao diện UI tương ứng wireframe
      • Mirror design và xem prototype trên Figma mobile
      • Khái niệm token, variable
      • Hướng dẫn tạo variable color tạo theme cho giao diện light/dark mode
      • Sử dụng variable string tạo biến thể ngôn ngữ
      • Sử dụng variable number, boolean tạo biển thể kích thước: mobile/tablet/desktop
      • Thực hành tạo variable cho card sản phẩm, giỏ hàng
    • 1 Buổi Buổi 11 - Prototype part 1
      • Tổng quan prototype
      • Các loại cử chỉ
      • Các bước tạo prototype
      • Prototype trigger, interaction/action và animation
      • Thực hành smart animate
      • Thực hành tạo prototype cho popup/modal sử dụng spring animation
      • Thực hành tạo list ảnh sản phẩm sử dụng scroll to
      • Interactive component prototype, interactive component lồng nhau
      • Bài tập
    • 1 Buổi Buổi 12 - Prototype part 2
      • Thực hành tạo một số tương tác thường gặp: menu, tooltip, chart, table, slide ảnh, trò chơi x-o
      • Kết hợp component, auto layout tạo prototype cho dock menu và tasks list
      • Video trong prototypes
      • Scroll, ứng dụng scroll trong thiết kế landing page
      • Set variable và điều kiện trong prototype
      • Thực hành áp dụng tạo màn hình convert nhiệt độ (C/F), chuyển đổi tỷ giá (VND/USD)
      • Bài tập
    • 1 Buổi Buổi 13 - Trình bày, bàn giao thiết kế
      • Các định dạng và kích thước khi export
      • Pixel preview
      • Tỷ lệ export
      • Ghi chú và sắp xếp file
      • Record prototype
      • Section - phân nhóm bản vẽ
      • Hiểu về độ phân giải
      • Các định dạng ảnh svg, png, jpeg, pdf
      • Hướng dẫn quy hoạch, sắp xếp, ghi chú cho các thành phần trong file thiết kế
      • Plugin trace ảnh, tách nền, tạo mockup
      • Ngăn chặn export, copy duplicate file
      • Hướng dẫn xuất PDF nhiều trang
      • Hướng dẫn nộp bài project cuối khóa
    • 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
  • 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

  • Có kinh nghiệm hơn 6 năm trong lĩnh vực Graphics Design & UI/UX. Từng tham gia thực hiện sản phẩm cho đa dạng loại hình như Start Up, Tập Đoàn, SME... và có cơ hội làm việc với các thị trường nước ngoài như Singapore, Nhật Bản, Hàn Quốc. Hiện đang là UI/UX Designer tại FPT Software.

    Giáo trình

Lớp: 25K65Q

Khai giảng ngày: 14/05/2025

Giờ học: 18:30 - 21:00

Lịch học: Thứ 4, Thứ 7

Giảng viên: Lê Minh Quang

Thời lượng: 14 buổi học

Trình độ: Cơ bản - Trung cấp

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: 25RK66L - Remote

Khai giảng ngày: 10/06/2025

Giờ học: 19:00 - 21:30

Lịch học: Thứ 3, Thứ 5

Giảng viên: Lộc Nguyễn

Thời lượng: 14 buổi học

Trình độ: Cơ bản - Trung cấp

Học phí: 5,800,000đ

Địa điểm: Học trực tuyến với giảng viên qua Zoom/ Meet/ Classin...

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.  

151 Reviews

Bùi Minh Khanh

Em cảm thấy khóa học rất tuyệt vời. Thầy Tùng Lâm rất tâm huyết và nhiệt tình giảng dạy. Thầy chia sẻ rất nhiều kiến thức bổ ích và luôn giúp đỡ học viên khi gặp khó khăn mặc dù thời gian khóa học cũng không nhiều. Cảm ơn thầy vì sau khóa học của thầy em đã thành thạo phần mềm hơn và tự tin hơn để theo đuổi ngành nghề này. Mặc dù chỉ mới là khởi đầu và còn rất nhiều điều phải học hỏi nhưng với những kiến thức trong khóa học mà thầy đã dạy chính là những nền tảng rất quan trọng nhất và em sẽ luôn áp dụng vào quá trình phát triển sau này.

Võ Ngọc Minh Thành - 25K60L

Thầy Lộc giảng bài nhiệt tình và tận tâm, ngoài những kiến thức nền tảng về UI, thầy cũng chia sẻ thêm kiến thức về UX. Xin cảm ơn thầy Lộc và trung tâm!!!

Huỳnh Vương Ngọc - 25K60L

Khoá học này nhờ thầy Lộc mà mình đã có thể bổ sung thêm nhiều kiến thức không chỉ ở mặt UI mà còn là mặt UX, cách tạo ra một web/app sẽ cần những gì, việc xây dựng design system rõ ràng sẽ quan trọng như thế nào... Thầy Lộc rất nhiệt tình và luôn chủ động hỏi han các bạn trong lớp làm bài có ổn không, có vướng mắc chỗ nào không, và tận tình hướng dẫn. Thầy cũng thường xuyên chia sẻ kinh nghiệm của thầy trong quá trình làm việc và luôn động viên học viên, thúc đẩy motivate mọi người để làm bài thiệt tốt Cảm ơn thầy Lộc và KeyFrame đã cho em có cơ hội học tập nhiều điều thú vị thông qua khoá học này ^^

Nguyễn Trần Tuấn Huy - 25K60L

Mình vừa học xong khoá Figma UI Design của anh Lộc, nếu bạn còn phân vân về khoá học này mình nghĩ là bạn phải nên học ngay thôi vì anh dạy rất dễ hiểu, rất chi tiết , chia sẻ rất nhiều kiến thức về ngành một cách rất thực tế, anh cũng rất vui tính và luôn hỗ trợ học viên nhiệt tình nữa. Anh Lộc 10 điểm không có nhưng

Đoàn Ngọc Diệp - 24K59L

Khoá học sẽ hơi nhiều kiến thức cho bạn nào chưa biết gì về UI/UX do đặc thù ngành học, nhưng nếu chăm chỉ về nhà chịu khó xem lại video bài giảng thì sẽ mau hiểu hơn. Giảng viên tận tâm có thể hỏi các thắc mắc về bài tập ngoài giờ họ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

Khóa học Figma UI Design

có trong chương trình học

Chương trình học UI/UX Product Design Completed

Lộ trình: 4 - 12 tháng

FAQ

  • 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
  • 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.
)