inflearn logo
inflearn logo

Từ thiết kế luồng người dùng đến hiện thực hóa bản mẫu (prototype)

Một nguyên mẫu (prototype) chuyển động còn hơn cả 100 màn hình đẹp! Hãy tạo ra các nguyên mẫu hoạt động như thật bằng logic điều kiện trong Figma, đồng thời rèn luyện tư duy thiết kế vững vàng ngay cả trong kỷ nguyên AI.

26 học viên đang tham gia khóa học này

Độ khó Cơ bản

Thời gian Không giới hạn

Prototyping
Prototyping
Figma
Figma
figma variable
figma variable
Prototyping
Prototyping
Figma
Figma
figma variable
figma variable
날개 달린 동전

Giới thiệu Khóa học và tạo ra sự phát triển cùng thu nhập nhé!

날개 달린 동전

Đối tác tiếp thị

Giới thiệu Khóa học và tạo ra sự phát triển cùng thu nhập nhé!

Bạn sẽ nhận được điều này sau khi học.

  • Khả năng hiện thực hóa bản mẫu (prototype) hoạt động như ứng dụng thật mà không cần lập trình thông qua các biến số và logic điều kiện.

  • Hoàn thiện 'dịch vụ ứng dụng của riêng bạn có thể nhấp vào được', có thể sử dụng ngay làm portfolio.

  • Khả năng tư duy logic vững chắc trong việc thiết kế từ luồng người dùng cho đến các tình huống ngoại lệ.

  • Kỹ năng giao tiếp bằng hình ảnh để có thể nói với nhà phát triển rằng "Hãy làm đúng như thế này"

💭 Bạn đã bao giờ có những trăn trở như thế này chưa?


  • Tôi đại khái đã hiểu về Variables, nhưng Conditionals (câu lệnh điều kiện) thì vẫn thấy như ngôn ngữ ngoài hành tinh vậy 🤯

  • Tôi mệt mỏi với việc phải làm thủ công, sao chép hàng chục frame mỗi khi tạo prototype ⏳

  • Thật bực bội vì dù đã thử dùng tính năng Figma AI nhưng vẫn không ra kết quả như ý muốn 🤖

  • Rõ ràng là đã làm theo đúng những gì được học, nhưng nó lại không hoạt động mượt mà như một dịch vụ thực tế ❌


Nguyên mẫu (prototype) là yếu tố bắt buộc để kiểm chứng ý tưởng nhanh chóng, nhưng các tính năng nâng cao thường mang lại cảm giác khó khăn. Đặc biệt là các công cụ AI đang gây sốt dạo gần đây, dù tưởng chừng chỉ cần ra lệnh bằng lời nói là xong, nhưng khi thực sự sử dụng thì kết quả trả về lại thường xuyên không đúng ý.

Lý do rất đơn giản.

Bởi vì để chỉ dẫn AI một cách hiệu quả, trước tiên bản thân bạn phải hiểu rõ logic của việc tạo mẫu (prototyping). Điều quan trọng hơn cả kỹ năng viết câu lệnh (prompt) chính là một bản thiết kế rõ ràng về việc "phải tạo ra cái gì và tạo ra như thế nào".


🖥 Giới thiệu lớp học

Khóa học này bao gồm các nền tảng thiết yếu cho kỷ nguyên tạo mẫu bằng AI (AI Prototyping).

Nhiều bài giảng chỉ giải thích về mặt tính năng như "Hãy dùng Variables như thế này" hay "Hãy hỏi AI như thế này". Nhưng khóa học này thì khác.

Từ "tại sao cần logic này", "cách áp dụng vào tình huống thực tế" cho đến "cách cộng tác hiệu quả với AI" - bạn sẽ được học tập một cách hệ thống thông qua các kịch bản thực chiến.

Bạn sẽ nắm vững ba trụ cột của logic là Biến (Variables), Câu điều kiện (Conditionals) và Luồng (Flow) thông qua các ví dụ thực tế, từ đó học cách khai thác tối đa Figma Make (AI Prototyping) dựa trên nền tảng này.


🎯 Triết lý cốt lõi của khóa học

  • Trước khi sử dụng AI, hiểu rõ logic là ưu tiên hàng đầu

  • Học tập trung vào nguyên lý, không chỉ đơn thuần là làm theo.

  • Kịch bản thực tế có thể áp dụng ngay trong công việc


🎯 Bạn sẽ học được những gì?


Chương 1~3: Xây dựng nền tảng Prototype cơ bản

Nếu bạn mới bắt đầu làm quen với Figma Prototype hoặc muốn kiểm tra lại các kỹ năng cơ bản, hãy bắt đầu từ đây. Bạn sẽ được học cách thao tác Prototype và các khái niệm cốt lõi (cấu trúc layer, component), đồng thời nắm bắt tư duy thực tế thông qua việc trực tiếp tạo ra các dự án thực chiến như Admin Dashboard và Onboarding Flow.


Chương 4: Flow - Cách thiết kế các luồng phức tạp

Khi số lượng màn hình càng nhiều, bản mẫu (prototype) sẽ càng trở nên phức tạp. Bạn sẽ được học cách xác định các lộ trình nhiệm vụ chính thông qua Task Flow, thể hiện các nhánh rẽ và lựa chọn bằng User Flow, và kết nối logic với màn hình thông qua Wireflow. Từ đó, bạn sẽ phát triển kỹ năng vẽ sơ đồ thiết kế một cách hệ thống trước khi bắt tay vào sản xuất prototype.


Chương 5: Variable và Conditional - Tạo nguyên mẫu thông minh

Hãy quên đi việc lặp đi lặp lại một cách thủ công hàng chục khung hình (frame). Sử dụng Variable để ghi nhớ dữ liệu và thay đổi trạng thái, đồng thời triển khai logic phản hồi khác nhau tùy theo điều kiện bằng Conditional. Bạn sẽ trực tiếp thực hiện các dự án như Lịch, Chi tiết sản phẩm, Giỏ hàng để hoàn thiện một bản prototype hoạt động giống như ứng dụng thực tế.


Chương 6: Figma Make - Cách thức mới để cộng tác với AI

Lý do nhiều nhà thiết kế thất bại trong việc tạo nguyên mẫu (prototyping) bằng AI không phải do câu lệnh (prompt), mà là do thiếu hụt trong khâu thiết kế hệ thống. Dựa trên các kiến thức đã học về Variable, Conditional và Flow, bạn sẽ học cách truyền đạt logic cho AI một cách hiệu quả. Hãy cùng trải nghiệm sự tiến hóa trong vai trò của nhà thiết kế: từ lao động chân tay sang lao động trí óc.


🧠 Tại sao tôi lại tạo ra khóa học này?

Nhiều khóa học Figma hướng dẫn cách tạo ra những giao diện đẹp mắt, nhưng lại không đi sâu vào cách làm thế nào để giao diện đó vận hành một cách thông minh.

Các khóa học về tạo mẫu bằng AI thường chỉ dạy bạn "hãy viết prompt như thế này". Tuy nhiên, nếu không hiểu về logic, dù bạn có viết prompt tốt đến đâu thì kết quả mong muốn cũng sẽ không xuất hiện.

Điều thực sự cần thiết trong thực tế là:

  • Làm thế nào để phân tích các tương tác phức tạp thành logic.

  • Cần thiết lập những điều kiện nào để tạo ra một bản mẫu (prototype) hiệu quả.

  • Làm thế nào để đưa ra yêu cầu có cấu trúc cho AI

Khóa học này được xây dựng dựa trên triết lý "Hiểu rõ logic trước khi sử dụng AI".

Khi sử dụng AI trên nền tảng logic vững chắc, bạn mới có thể kiểm chứng nguyên mẫu (prototype) một cách nhanh chóng và chính xác. Hiểu rõ nguyên lý của logic và giải quyết việc triển khai với sự hỗ trợ của AI - đây chính là quy trình làm việc của một nhà thiết kế tương lai.


👥 Đề xuất cho những đối tượng sau

  • Nhà thiết kế nắm vững kiến thức cơ bản về Figma nhưng lại cảm thấy bế tắc mỗi khi nhắc đến Variables và câu lệnh điều kiện.

  • Những người muốn giải quyết bằng một logic duy nhất thay vì phải làm thủ công sao chép hàng chục khung hình (frame).

  • Những người đã thử sử dụng các công cụ tạo mẫu (prototyping) bằng AI nhưng không hài lòng với kết quả.

  • Những người muốn hiện thực hóa các tương tác phức tạp nhưng không biết phải bắt đầu từ đâu

  • Những người muốn giải thích một cách rõ ràng dựa trên logic khi giao tiếp với nhà phát triển (Developer) hoặc quản lý sản phẩm (PM)

  • Những người muốn trở thành nguồn lực thực chiến ngay lập tức trong môi trường startup vốn cần kiểm chứng giả thuyết nhanh chóng.


✅ Sau khi hoàn thành khóa học này

  • Khả năng tạo mẫu (prototyping) cao cấp, sử dụng thành thạo Variables, Conditionals và Flow.

  • Khả năng tư duy logic để thiết kế và triển khai các tương tác phức tạp một cách có hệ thống

  • Kỹ năng thực tế để sử dụng hiệu quả công cụ tạo nguyên mẫu AI (Figma Make)

  • Cấu trúc nguyên mẫu sạch sẽ và hiệu quả, thoát khỏi hàng trăm đường dây nối chằng chịt như mì Ý.

  • Năng lực kiểm chứng siêu tốc, dẫn dắt từ việc xác thực ý tưởng nhanh chóng đến thử nghiệm người dùng.

  • Khả năng giao tiếp dựa trên logic với nhà phát triển và PM


⚠️ Thông báo

Thông báo thay đổi chính sách tài khoản Figma Education (tính đến tháng 12 năm 2024)

Gần đây, với việc bổ sung tính năng Make trong Figma, chính sách gói Education đã thay đổi. Hiện tại, không thể sử dụng tài khoản Education nếu không có xác thực từ cơ sở giáo dục.

Phương pháp "nộp ảnh chụp màn hình chứng nhận khóa học" như đã hướng dẫn trong các bài giảng trước đây hiện đã trở nên khó khăn để đăng ký tài khoản Education. Do đó, có thể sẽ có hạn chế trong việc thực hành các tính năng nâng cao (điều kiện, biến số, kiểm soát luồng, v.v.) ở giai đoạn giữa và cuối khóa học.

Hiện tại chúng tôi đang xem xét các phương án thay thế và sẽ thông báo cho các bạn ngay khi tìm ra giải pháp khắc phục.

Chúng tôi xin lỗi vì sự bất tiện này và mong quý khách thông cảm.



Khuyến nghị cho
những người này

Khóa học này dành cho ai?

  • Nhà thiết kế luôn phải giải thích bằng lời mỗi khi nhận được câu hỏi "Cái này hoạt động như thế nào?"

  • Những người đã biết về Biến (Variables) và Câu lệnh điều kiện (Conditionals) nhưng vẫn thấy bế tắc khi áp dụng vào thực tế.

  • PM/Người lên kế hoạch muốn kiểm chứng ý tưởng nhanh chóng mà không cần phát triển hệ thống.

  • Những ai đang lo lắng về việc cần bồi dưỡng năng lực nào với tư cách là một nhà thiết kế trong kỷ nguyên AI.

  • Những ai muốn thoát khỏi những bản prototype chỉ dừng lại ở mức click và chuyển màn hình.

  • Những nhà sáng lập/người lập kế hoạch muốn trình diễn ý tưởng của mình như một ứng dụng thực tế mà không cần lập trình.

Cần biết trước khi bắt đầu?

  • Chỉ cần có kinh nghiệm thiết kế màn hình bằng Figma là đủ.

  • Hoàn toàn không cần kiến thức về lập trình hay phát triển phần mềm.

  • Một số tính năng (Variables) chỉ khả dụng trong các gói trả phí của Figma.

Xin chào
Đây là moment

Chương trình giảng dạy

Tất cả

26 bài giảng ∙ (5giờ 53phút)

Tài liệu khóa học:

Tài liệu bài giảng
Ngày đăng: 
Cập nhật lần cuối: 

Đánh giá

Chưa có đủ đánh giá.
Hãy trở thành tác giả của một đánh giá giúp mọi người!

Khóa học tương tự

Khám phá các khóa học khác trong cùng lĩnh vực!

2.258.233 ₫