Khóa học

UI Design System

Là khóa học bổ sung cho Product Designer và UI/UX Designer muốn nâng cấp tư duy hệ thống

Bao gồm

Design system - FoundationDesign tokensComponent, PatternDesign System trong tổ chứcCách viết document & handoff

Hiểu rõ giá trị và vai trò của Design System trong tổ chức​

Biết cách xây dựng và duy trì một hệ thống thiết kế chuyên nghiệp

Sử dụng Design Tokens để tạo ra UI linh hoạt, dễ mở rộng và đồng bộ với hệ thống code

Ai nên tham gia khoá học này?

Bạn đã làm nghề được 1-2 năm và tham gia các dự án tại công ty nhưng nhận ra mình cần phải phát triển hơn nhưng chưa biết bắt đầu từ đâu?

Thứ bạn thiếu có thể là tư duy hệ thống, cách suy nghĩ ở cấp độ sản phẩm (product design thinking) hoặc việc teamwork cùng developer.

Với các kiến thức chuyên môn về lĩnh vực thiết kế, bạn đã có cho mình tư duy thẩm mỹ và kỹ năng phù hợp để làm ra một thiết kế đẹp. Giờ đây bạn cần bổ sung tư duy hệ thống, tính quy hoạch và các nguyên tắc của ngành UI/UX Design.

Bạn đang là sinh viên ngành graphic, marketing và các ngành liên quan đang muốn bước chân qua ngành UI/UX.

Khóa sẽ giúp bạn tạo dựng kỹ năng thực tế sau khi đã được định hướng tư duy ở môi trường lớp học chuyên sâu.

UI/UX Designer

Bạn đã làm nghề được 1-2 năm và tham gia các dự án tại công ty nhưng nhận ra mình cần phải phát triển hơn nhưng chưa biết bắt đầu từ đâu?

Thứ bạn thiếu có thể là tư duy hệ thống, cách suy nghĩ ở cấp độ sản phẩm (product design thinking) hoặc việc teamwork cùng developer.

Graphic Chuyển Ngành

Với các kiến thức chuyên môn về lĩnh vực thiết kế, bạn đã có cho mình tư duy thẩm mỹ và kỹ năng phù hợp để làm ra một thiết kế đẹp. Giờ đây bạn cần bổ sung tư duy hệ thống, tính quy hoạch và các nguyên tắc của ngành UI/UX Design.

Sinh Viên khối ngành Thiết Kế

Bạn đang là sinh viên ngành graphic, marketing và các ngành liên quan đang muốn bước chân qua ngành UI/UX.

Khóa sẽ giúp bạn tạo dựng kỹ năng thực tế sau khi đã được định hướng tư duy ở môi trường lớp học chuyên sâu.

Tại sao nên học khóa

UI Design System

08 buổi

Học sâu - Hiểu sâu

03 lần

Nâng cấp chương trình

02 học bổng

Cho 2 sản phẩm đầu ra xuất sắc nhất mỗi khóa

Top 1

Khóa học về Design System trên thị trường

Thông tin khoá học

UI Design System

UI Design System là khóa học bổ sung cho Product Designer và UI/UX Designer muốn nâng cấp tư duy hệ thống. Học viên sẽ được hướng dẫn xây dựng một bộ Design System hoàn chỉnh trên Figma, kết hợp với tài liệu hóa chuyên nghiệp trên Notion. 

LỢI ÍCH KHÓA HỌC MANG LẠI:

  • Giúp UX/UI Designer chuẩn hóa quy trình thiết kế và đảm bảo tính nhất quán trên các sản phẩm.
  • Hiểu và áp dụng Design System cho phép designer giao tiếp hiệu quả hơn với lập trình viên, giảm lỗi trong quá trình phát triển.
  • Kỹ năng xây dựng Design System là xu hướng hot trong ngành thiết kế, giúp designer nổi bật, đặc biệt trong các công ty quốc tế hoặc dự án quy mô lớn, tăng cơ hội thăng tiến.
  • Designer có thể dễ dàng điều chỉnh và mở rộng hệ thống thiết kế khi sản phẩm phát triển, đáp ứng nhu cầu thay đổi của thị trường.

Giảng viên

Diễm Mai

  • Hơn 10 năm kinh nghiệm trong ngành UI/UX
  • Hiện là UI/UX Leader cho dự án HR Tech tại thị trường Nhật
Học phí
3,420,000 ₫ 3,600,000 ₫
Ngày khai giảng
04/08 (thứ 2 - 6)
Thời gian học
19h-21h
Chọn hình thức học

Trình độ

CƠ BẢN

Kiến thức đầu vào

FIGMA

Thời lượng

08 BUỔI

Giấy chứng nhận

01. Tổng quan về Design system

  • Design System là gì? Tại sao cần Design System?
  • Phân biệt Style Guide và Design System.
  • Các bộ DS nổi bật hiện tại (Material Design, Carbon, Polaris...).
  • Cấu trúc cơ bản của một Design System.

02. Design system - Foundation

Nắm được các thành tố cơ bản cấu thành nên Foundation của 1 bộ Design system, bao gồm: Color system, Iconography, Typography, Spacing, Elevation, Illustration…
Bài tập: tạo 1 bộ foundation cho 1 brand giả định

03. Design tokens

  • Design token là gì? Vai trò của token trong Design system.
  • Các cấp độ Token (global, alias, component).
  • Cách hoạt động với token (đối với designer và developer).

Bài tập: tạo lập Design token trên Figma (với Variable)

04. Component-based design

  • Nguyên lí hoạt động của Atomic design và cách ứng dụng.
  • Cấu trúc và naming convention cho component library.
  • Biến thể, trạng thái, khả năng tái sử dụng.

Bài tập: Thiết kế một số components cơ bản (Button, Input, Card...)

05. Pattern - based design

  • Các dạng pattern thường gặp trong Design system.
  • Cách tạo lập và ứng dụng linh hoạt trong thiết kế.

Bài tập: Thiết kế một số patterns phổ biến (modal, sidebar, table…)

06. Design System trong tổ chức

  • Ai là người dùng Design System?
  • Cách làm việc giữa Designer – Developer.
  • Quản lý hệ thống ở quy mô lớn.
  • Cách tổ chức và bảo trì thư viện.

07. Viết Document & Handoff

  • Cách viết guideline cho component, token.
  • Đảm bảo tính thống nhất giữa file design và production code.
  • Tool hỗ trợ handoff: Zeroheight, Storybook, Notion...

Bài tập: Viết tài liệu hướng dẫn sử dụng 1–2 component/pattern đã thiết kế.

08. Review đồ án cuối khóa

  • Đồ án cuối khóa: Thiết kế foundation + token + 5 component/pattern + tài liệu hướng dẫn.
  • Học viên thuyết trình bài làm.
  • Nhận xét và phản hồi.

Học Xong Được gì?

01

xây dựng design system chuyên nghiệp

Nắm vững cách xây dựng và duy trì một bộ Design System hoàn chỉnh trên Figma và tài liệu hóa trên Notion.
02

hiểu và tối ưu vai trò design system

Hiểu rõ giá trị và vai trò của Design System trong tổ chức, cải thiện hiệu quả làm việc với team dev, sẵn sàng cho sự mở rộng và phát triển sản phẩm.
03

thực hành qua đồ án

Áp dụng kiến thức đã học vào đồ án cuối khóa, sẵn sàng triển khai vào project thực tế.

Sản Phẩm Học Viên

UI Design

Chillsound

Trần Thiện Sáng

Figma - Khóa 33

BlogGame

Võ Trần Quang Thông

Figma - Khoá 31

Katdo Studio

Bùi Việt Tú

Mobile App - Khóa 1

GoCamp

Bùi Việt Tú

UI Design

Egoz App

Nguyễn Đặng Văn

Mobile App - Khóa 2

App Learning Language

Nguyễn hồng Hưng

UX - Khoá 17

Cinemate

Quảng Bội Kha

UI Design

DeMor

Phước Hậu

Mobile App - Khoá 01

POGO

Thịnh Đinh

Mobile App - Khóa 01

Artventure

Anh Thư

Học viên nói gì về TELOS?

Sau khi hoàn thành 6 khóa học ở Telos mình từ 1 đứa vẽ cái logo Figma còn méo lên méo xuống giờ đã có trong tay một vài project UI/UX nho nhỏ cho cả app và web, ngoài ra còn có thể tự code một trang landing page đơn giản nữa. Đối với một người bắt đầu từ con số 0 như mình thì mình cảm thấy rất tự hào vì đã đi được quãng đường xa như vậy, may mắn có Telos đồng hành. Mỗi buổi học đều là một hành trình kiến thức thú vị được anh chị giảng viên truyền đạt hết sức nhiệt tâm và chi tiết. Mình muốn gửi lời cảm ơn tới trung tâm và các anh chị, vì đã luôn kiên nhẫn tận tình hỗ trợ học viên trong suốt quá trình học tập. Và kể khi không còn học ở đây nữa thì vẫn nhận được sự hỗ trợ trọn đời. Đó là điều mà mình thấy rất trân trọng.

Xem Chi Tiết
Võ Thị Anh Thư

Em là sinh viên ngành Thương mại điện tử, nó là một lĩnh vực hoàn toàn khác với UXUI. Vì vậy mà ban đầu học UXUI em có gặp đôi chút khó khăn, như việc không có nền tảng về thiết kế, cần phải học cách tư duy có hệ thống và yêu cầu khả năng tự học khá nhiều. TELOS đã giúp em rất nhiều trong việc giải quyết những khó khăn mà em gặp phải. Nhờ vào môi trường học tập thoải mái, giảng viên tận tâm, và cả kho tàng bài tập tha hồ để thực hành thì em đã thành thạo hơn trong việc sử dụng các công cụ, bên cạnh đó em còn học được thêm về tư duy thiết kế, tư duy hệ thống và các bước làm ra sản phẩm thực tế.

Xem Chi Tiết
Hoàng Nguyên Hạnh
Sinh Viên Năm 2 Ngành TMĐT

Là Product Owner, mình thường phải tự xử lý các wireframe, lofi Ul trên Figma, khi học về cấu trúc Figma giúp mình quản lý tốt hơn và làm các wireframe nhanh hơn. Ngoài ra mình cũng có thể tự tin làm những UI design cho sản phẩm riêng hoặc tham gia các cuộc thi hackathon. Một lợi ích khác là mình hiểu cấu trúc các bạn Ul designer đang tổ chức. Nội dung và cấu trúc khóa học ở TELOS được tổ chức hợp lý về số lượng buổi, nội dung từng buổi. Sau mỗi buổi giảng viên đều có bài tập để thực hành và sửa bài tập vào ngày hôm sau, việc thực hành giúp cho dễ dàng nhớ kiến thức. Hình thức học online cũng khá tiện lợi cho học viên. Kiến thức thực tế và có thể áp dụng vào công việc hàng ngày.

Xem Chi Tiết
Lê Nguyễn Thùy Dương
Product Manager

Là một học viên sau khi đã hoàn thành khoá học Figma tại TELOS mình có một vài cảm nhận như sau. Khoá học tại đây không chỉ giúp mình sử dụng thành thạo các công cụ trong Figma, nắm vững các khái niệm quan trọng trong lĩnh vực thiết kế, mà còn giúp mình áp dụng chúng linh hoạt trong thực tế. Thầy cô giảng viên tại Telos rất xuất sắc trong việc truyền đạt kiến thức một cách rõ ràng và dễ hiểu. Thầy cô rất là nhiệt tình và sẵn sàng hỗ trợ mình trong quá trình làm thiết kế nếu mình có gặp khó khăn gì. Không chỉ vậy, môi trường học tập tại Telos cũng rất thân thiện và thoải mái, từ thầy cô giảng viên đến anh chị học viên khác ai cũng hoà đồng, vui vẻ. Cuối cùng, việc nhận được học bổng sau khi hoàn thành khoá học là một động lực lớn để mình tiếp tục phấn đấu. Mình cảm ơn Telos vì cơ hội này và tin rằng những kỹ năng mà mình đã học được sẽ là nền tảng vững chắc cho mình sau này.

Xem Chi Tiết
Huệ Mẫn

Câu hỏi thường gặp

01. Tôi chưa biết gì cả liệu có học được không?

02. Đầu ra của khóa học là gì?

03. Tôi có được hỗ trợ sau khóa học không?

04. Một lớp có tối đa bao nhiêu học viên?

05. Trung tâm có nhận dạy 1 kèm 1 không?

06. Quy trình đăng ký và vào học như thế nào?

Zalo

Điền form và TELOS sẽ liên hệ

Rất mong chờ đón chào bạn ở lớp học Figma lần này nhé!

    Điền form và TELOS sẽ liên hệ

    Rất mong chờ đón chào bạn ở lớp học Code for Designer lần này nhé!

      Điền form và TELOS sẽ liên hệ

      Rất mong chờ đón chào bạn ở lớp học UI Design lần này nhé!

        Điền form và TELOS sẽ liên hệ

        Rất mong chờ được đón chào bạn ở lớp học figma lần này nhé

          Điền form và TELOS sẽ liên hệ

          Rất mong chờ đón chào bạn ở lớp học UX Design lần này nhé!

            Điền form và TELOS sẽ liên hệ ENĐiền form và TELOS sẽ liên hệ

            Rất mong chờ được đón chào bạn ở lớp học lần này nhé

              Điền form và TELOS sẽ liên hệ

              Rất mong chờ được đón chào bạn ở lớp học figma lần này nhé

                Điền form và TELOS sẽ liên hệ

                Rất mong chờ đón chào bạn ở lớp học Mobile Design lần này nhé!

                  Điền form và TELOS sẽ liên hệ

                  Rất mong chờ đón chào bạn ở lớp học Web Design lần này nhé!

                    Điền form và TELOS sẽ liên hệ

                    Rất mong chờ được đón chào bạn ở lớp học Business Analysis cơ bản lần này nhé!

                      Điền form và TELOS sẽ liên hệ

                      Rất mong chờ được đón chào bạn ở lớp học Business Analysis luyện thi ECBA lần này nhé!

                        Điền form và TELOS sẽ liên hệ

                        Rất mong chờ được đón chào bạn ở lớp học Business Analysis thực chiến lần này nhé!

                          Điền form và TELOS sẽ liên hệ

                          Rất mong chờ đón chào bạn ở lớp học UI Design System lần này nhé!

                              I. Thông tin cá nhân

                              II. Lựa chọn khóa học

                              TELOS Academy sẽ liên hệ với bạn trong vòng 24 giờ để hiểu rõ hơn về nhu cầu của bạn. Hãy để ý điện thoại để không bỏ lỡ cuộc gọi từ chúng mình nhé!