用Figma打造絕佳UI/UX 課後評價、心得與優缺點！

為什麼要學習Figma？

最近因工作需要做出程式的原型，以及簡單設計出 UI/UX 等，所以需要使用 Figma 來幫助我快速做出所需的原型，剛好找到 Hahow 上有這門＂產品設計實戰：用Figma打造絕佳UI/UX＂的課程。

所以我的需求是在最短時間內學習 Figma 的所有基礎功能，以及如何流暢地展現出 Prototype，那我認為這堂課是有達成我的需求，此外也有教我更多關於實作上需要注意的事項，都會在下文介紹。

下方為這堂課的簡介影片：

Figma打造絕佳UI/UX 老師介紹

先附上關於這門課的老師介紹，讓大家能夠更了解授課人的經驗與資歷，這也算是上課前非常重要的一點，畢竟老師本身做得好，教的課才能讓學生信服！

關於老師 Simon Lin

擁有超過 7 年的產品設計經驗，擅長透過簡單直覺的設計方案來解決複雜的使用者問題和挑戰，並且致力於打造美好的產品使用體驗並在市場中創造商業價值。

目前居住在澳洲雪梨，在全球前五大的巨型獨角獸 Canva 擔任資深產品設計師，專注打造全球超過千萬使用者的 SaaS 平面設計工具，幫助更多人體會到設計的美好。2017-2022 曾旅居日本東京 5 年，在全球職缺搜尋引擎 Indeed 擔任資深 UX 設計師，負責日本市場的本地化體驗與服務。

同時也是產品設計教育平台與內容媒體 AAPD 的創辦人，擁有超過近 2 萬的訂閱讀者也與超過 200 名在產品設計領域的作者合作，提供許多實用的內容。

2021 也開設了超過 5,000 人參與的產品設計線上課程，我們的願景是培養兼具軟硬實力的產品設計師，陪伴他們走過職涯的每個階段與挑戰，讓設計產業變得更加成熟。

Figma打造絕佳UI/UX 課程內容

接下來會是關於課程的六個章節，讓大家能對課程有個基礎的認識，前面 1～5 章都有 Figma 的頁面可以看，最後一章主要是在介紹更長遠的目標需要注意的，老師的話是會附上推薦看的文章。

• 第 1 章 產品設計核心觀念：UX設計思維與產品開發流程
• 第 2 章 Figma 快速上手：核心操作基礎
• 第 3 章 Figma 進階技巧：打造可擴展的設計與常見 UI 元件
• 第 4 章 讓你的設計動起來：基礎與進階原型設計（Prototyping）
• 第 5 章 產品設計實戰：從0 到 1 設計實際的產品（App&Web）
• 第 6 章 準備進入業界：成為產品（UI/UX）設計師的最後一哩路

此外還有課程雙週報與 Slack 的群組，雙週報是每隔兩週提供資訊，像是：課程有更新、學員故事、作品健檢、線上直播還有其他與產品設計有關的，群組則是提供學員們發問與交流。

第 1 章 產品設計核心觀念

第一章是教關於 UI / UX 的核心觀念、產品常見的開發流程、產品設計師所需具備的能力、工作流程等，還有對視覺設計的美感如何養成、以及如何練習的方法也都有提到。

上完課後開始會對於日常使用的 APP 思考為什麼要這樣設計與這樣設計的好處，這是我覺得第一章的課帶給我最多的價值，透過主動思考程式介面設計來反思與學習。

因為熱門的 APP 都一定有專業的產品設計師，我們可以從那些熱門產品中主動觀察他的介面、顏色與字體，像是我之前學習寫文時，也會試著去注意文章架構、版面，所以這點在設計上也非常受用。

第 2 章 Figma 快速上手

這章節就像標題一樣，教你 Figma 有哪些實用功能，這章對我來說幫助很大，畢竟要從完全不會用到快速上手所有功能，如果是自己摸索的話，肯定需要花較長的時間。

而且對於剛接觸的人來說，自學用法效率一定是比不上直接從課程中學習，像是快捷鍵、顏色樣式、形狀使用、鋼筆技巧等，除了這些之外還有許多都是在快速上手中非常實用的。

第 3 章 Figma 進階技巧

進階單元教了元件、變量的使用方法與如何用會更加方便，在這單元學習到的對於後續的 UI/UX 設計能夠節省很多時間，還有常見的設計如表單、按鈕、列表、導覽視窗、彈跳視窗。

還有格線系統與 Auto Layout，格線系統算是排版的細節，而 Auto Layout 就真的是非常實用的功能，針對不同裝置的響應式設計，在行動裝置上的顯示與排版可以說是必要的功能。

另外也有介紹他常用的 Plugins 與 Community、如何自製 ICON 系統、如何與工程師合作（合作時需要注意的細節）。

第 4 章 讓你的設計動起來

這章節是讓你前面的設計能夠根據不同按鈕來跳出不同的視窗與動畫，也就是說讓整個原型能夠像是真正的程式一樣動起來，但也有許多不同的觸發行為與轉場動作需要選擇，這章節就是在說明這個。

要在什麼情況下選擇何種方式會更適合，如果看不懂的話也可以點擊 Figma 教學檔案，直接把檔案 Duplicate 一份到你的 Draft 裡看他的 Prototype 是如何連結的。

第 5 章 產品設計實戰

這個章節會示範 App 與 Web 設計的整個流程，也就是實作上設計產品時從核心樣式、元件庫、Wireframe、Mockup 到最後的 Prototyping。

在 iPhone 的 APP 上所示範的 Prototype 完成度很高，所以看完跟著做一定能懂，而 Web 所示範的是響應式設計要怎麼做。

最後第六章就讓有興趣的人，買完課程就可以看了，也是對於有著長遠目標的人適合看，如果是對學習 Figma 有興趣的我都還蠻推薦去買，這門課程的影片也都很有質感，以下附上其中一段課程影片。

Figma打造絕佳UI/UX 優缺點

先說明這裡的優缺點是個人主觀學習上，認為有哪些優、缺點，缺點更像是需要改進的部分，所以根據你的需求再看這門課程符不符合你的需求，優點是適合的人，缺點是不適合的。

優點

對於像我這種初學者，完全沒有使用過 Figma 也可以快速了解基本功能，以及設計、UI/UX 相關的必備入門知識，以及實作上如何更好的使用動畫來表達我想傳達的設計。

講師的設計能力從課程本身的剪輯動畫就能看出，還有上課簡報都有詳細的列出來，重點是上課簡報也是使用 Figma 製作，所以有哪段不會，直接把 Figma 檔案打開來看設置就可以懂了！

如果你是原本就會設計，但不懂 UI/UX 的話，學習速度會更快，畢竟原本就有一定的美感，現在只要掌握了使用技巧就能快速做出你腦中的想法，除了 Figma 好用之外，講師也教的簡單易懂也很重要！

缺點

對於想要單純精進 UX 的人上完這堂課，會覺得不是很有幫助，畢竟這篇算是由入門教起的，但如果對於未來職涯有想朝這方面前進，那我覺得第六章會是對你最有幫助的。

Figma打造絕佳UI/UX 課後評價、心得

其實這堂課的價格與內容可以說是非常超值，對於新手來說我是完全推薦去買這堂課的，除非你是想精進UX，那這堂課的CP值會沒那麼高，不過可以參考其他學生的評價也有高達 5 顆星。

我個人從一開始完全沒接觸過 Figma 到用一個禮拜的時間看完影片，再到花一個禮拜的時間做出專案所需的 Prototype，總共耗時 2 個禮拜，但做出的成果也算是不錯。

假設我沒有買這堂課，從 0 完全自學 Figma 到要做出 Prototype，那應該會超過一個月，而且途中使用的格式一定需要來回調整好幾次，做起來一定是沒有效率的。

總結來說，對於在學或在職的人，完全沒接觸過 UI/UX 或是有一點理解但想要快速上手 Figma，我都是很推薦去上這堂課，花短短的時間幫你節省後續調整的瑣事，以及與其他學生交流加速學習！