Trainer,Ggb

UI 魔法課程

最高享有

25%

早鳥優惠

...

春麵’Ggb 設計專案

👊 我相信，設計不只是畫介面，而是將你的專長、興趣與 UIUX 結合，打造出屬於你的職業價值！

活動系統官網設計

[ UIUX設計 ]
[ 視覺設計 ]
[ 網站規劃 ]

行銷活動官網設計

[ UIUX設計 ]
[ 視覺設計 ]
[ 網站規劃 ]

兄弟象品牌商城設計

[ UIUX設計 ]
[ 視覺設計 ]
[ 網站規劃 ]

哲煜科技代理服務設計

[ UIUX設計 ]
[ 3D設計 ]
[ 視覺設計 ]
[ 網站規劃 ]

遊戲行銷活動網站設計

[ UIUX設計 ]
[ 視覺設計 ]
[ 活動規劃 ]

哲煜科技官網設計

[ UIUX設計 ]
[ 視覺設計 ]
[ 網站規劃 ]

活動系統官網設計

[ UIUX設計 ]
[ 視覺設計 ]
[ 網站規劃 ]

行銷活動官網設計

[ UIUX設計 ]
[ 視覺設計 ]
[ 網站規劃 ]

兄弟象品牌商城設計

[ UIUX設計 ]
[ 視覺設計 ]
[ 網站規劃 ]

哲煜科技代理服務設計

[ UIUX設計 ]
[ 3D設計 ]
[ 視覺設計 ]
[ 網站規劃 ]

遊戲行銷活動網站設計

[ UIUX設計 ]
[ 視覺設計 ]
[ 活動規劃 ]

哲煜科技官網設計

[ UIUX設計 ]
[ 視覺設計 ]
[ 網站規劃 ]

關於訓練師春麵'Ggb

Hi 大家好 👋

我是一位充滿熱情的 UIUX 資深設計師，擁有 20 年以上設計經驗，累積參與 60+ 項數位產品開發。

曾擔任遊戲科技公司設計主管，以及哲煜科技設計經理，負責設計團隊培訓與教學顧問。

✨ 數位產品設計，從 0 到 1 打造完整體驗

✨ 設計系統整合與規劃，提升產品一致性與效率

✨ 發掘個人職場優勢，協助設計師找到自己的核心競爭力

與我一起學習，

解鎖

UI 魔法技能

Magic

UIUX設計流程與實操方法

跨平台 Web、Mobile 設計的關鍵

Magic

Figma 基礎與進階技能

掌握 UI 設計元件與 UI Kit 管理

Magic

學會設計系統與佈局規劃及協作方法

高品質互動原型設計製作技巧

Magic

發掘個人設計風格與天賦

應用AI 設計工具強化視覺效果

Magic

學會選擇合適的專案作打造作品集

面試準備方向與實戰演練

關於 UI 魔法課程

課程包含

包含 7 章 59 單元

課程包含

6 項實作、1 項測驗、1 項健檢

觀看限制

不限觀看次數

第一章：打開設計的奧秘，踏上魔法之路！

從設計基礎建立信心，讓你明白 UI 設計不只是畫面，而是從使用者角度出發的規劃技術。

• UI/UX 是什麼魔法？1 單元

• 用戶體驗背後的價值思考2 單元

• 設計師在產業中的定位與成長路徑3 單元

• 數位產品如何改變世界的案例分析4 單元

• 打造個人設計風格和職涯願景5 單元

• 設計師常見迷惘與如何找回熱情6 單元

• UI/UX 對世界的影響力7 單元

• 行業趨勢與設計師未來潛力8 單元

• UI/UX 的創造價值與社會貢獻9 單元

• 課程總覽與如何最大化學習效益10 單元

第二章：掌握設計流程基礎魔法

設計不是靠靈感，是靠結構與觀念。這章帶你用設計師的視角思考問題，從畫面目標、資訊分類、版型節奏，到邏輯清晰的 Layout 初稿，為你的設計打下最穩的基礎

• UI 設計是什麼？跟平面設計有什麼不同？1 單元

• 教你怎麼從目標出發思考 UI 該呈現什麼資訊2 單元

• 從使用者的操作路徑開始思考，建立設計的邏輯與順序3 單元

• 學會區分主、副資訊與資訊優先順序，建立清楚的架構基礎4 單元

• 拆解常見的視線模型與動線安排技巧5 單元

• UI 排版要先有「骨架」再談細節學會用 wireframe 或草圖工具做出基本結構6 單元

• UI Layout 常用框架與模組拆解7 單元

• 如何透過留白、對齊與間距讓畫面有節奏8 單元

• 介紹 UI 設計中視覺元素的功能與邏輯組合方式，建立基本樣式系統的觀念9 單元

• 結構邏輯與模組，實際轉化成畫面草圖，建立個人化的設計流程 SOP10 單元

• 實作練習｜運用資訊分類、草圖起稿與簡單的 UI 重構提案實作

第三章：掌握 Figma 魔法武器

設計師的畫筆就是工具，這章帶你精通 Figma 的高頻操作、設計流程與專案管理技巧，讓你能從草稿到畫面快速進化，也能和團隊高效協作不卡關

• Figma 是什麼？為什麼設計師都在用它？1 單元

• 常用功能基礎操作，建立精準操控的手感2 單元

• 元件 Components 是什麼？怎麼建立與重複使用3 單元

• Figma 中最強大的版面控制工具 Auto Layout4 單元

• 畫面尺寸怎麼設計才有彈性？介紹設計畫面常見的尺寸規範與響應式RWD觀念5 單元

• 如何正確使用文字與顏色樣式（Style）6 單元

• Prototype 動線互動設計入門7 單元

• 與工程師協作的標註技巧8 單元

• ＡＩ魔法：常用ＡＩ設計工具介紹與應用9 單元

• Figma 常用插件運用與介紹10 單元

• 實作練習｜從 Frame、Auto Layout、Style 到 Components ，運用實作實作

第四章：發掘你的設計魔法天賦

這章不是學技能，而是更認識你自己。透過心理學與設計測驗，找出你在 UI 設計裡的潛力領域，協助你找到最適合發展的設計風格、專長與工作方式。設計的魔法，其實早就藏在你身上了

• 設計師也要懂心理學：探索你的使用者＆自我1 單元

• 設計人格測驗：找出你是哪一型設計師2 單元

• UI 設計常見 4 種人格類型與優勢解析3 單元

• 你的「情緒價值共感力」在哪一塊最強？4 單元

• 用設計筆記本，記錄你的感受觀察力5 單元

• 你最擅長的「畫面節奏感」是什麼風格？6 單元

• 測測你的「創意能量來源」：自我驅動 vs 外部激勵7 單元

• 你在團隊中最適合什麼角色？8 單元

• 運用「同理心地圖」探索自己與用戶的交集9 單元

• 整理出屬於你的「設計魔法屬性卡」10 單元

• 實作練習｜設計自己的「魔法師履歷卡」實作

第五章：打造你的設計法寶

這章的主軸是打造「能說服別人」的設計作品集，不是把畫面拼起來而已，而是要有脈絡、有策略、有故事。我們會用一步步的練習，幫你從零開始做出第一個具備 UI 思維的完整作品

• 如何找出有價值的專案主題1 單元

• 學會轉化題目為任務目標，釐清使用情境與核心任務2 單元

• 透過簡單表格，快速列出畫面需要有哪些功能與內容項目3 單元

• 不用高深工具，手繪就能做！建立畫面階層與任務流程的基礎地圖4 單元

• Wireframe 起稿：先畫框，再做美5 單元

• 根據目標族群挑選合適風格，建立品牌感的設計方向6 單元

• Mockup 彩色畫面設計：整合你的所有魔法7 單元

• UI 呈現提案法：用一頁稿傳遞你的設計邏輯8 單元

• ＡＩ魔法：應用ＡＩ設計工具強化你的設計作品9 單元

• 精修與優化：學會調整、對比與細節微調10 單元

• 實作任務｜打造一份完整規劃設計的 UI 作品實作

第六章：打開魔法師的大門「試煉」

你已經會設計、能畫出好作品，但走進面試現場時，卻說不出為什麼這樣設計。這一章，就是幫你準備好「面試這場戰鬥」從自我介紹、作品講解、實作答題、模擬演練，讓你每一句話都有自信的表達

• 解析 UIUX 設計師常見的面試題型與考核邏輯1 單元

• 打造你的個人介紹開場白2 單元

• 面對實作題｜拆題思維與答題結構3 單元

• 提供超過 20 題常見設計師面試題，從經歷、邏輯、工作情境、合作經驗4 單元

• 從作品選擇、簡報邏輯、到面試中的簡報講稿結構，教你怎麼說得清楚又吸引人5 單元

• 讓你學會怎麼講出設計思維與使用者考量，而不是只會說「我覺得這樣比較好看」6 單元

• 面試後該做什麼？7 單元

• 實作任務｜模擬面試講稿與簡報製作實作

• 實作任務｜實際的面試練習，了解市場需求實作

第七章：實戰面試走進設計師的現實世界

這是一個讓你實戰演練的機會。通過模擬面試演練，對照真實情境，檢驗自己對設計問題的解答能力，並接受專業的指導與反饋，幫助你在真正的面試中更加自信，從容應對挑戰，快速提升自己的面試表現。

• 面試者的提問技巧：你問的好，也是一種專業1 單元

• 心態魔法補血術：面試失利也不怕，面對面試落選與等待期該怎麼調整與強化自己2 單元

• 作品集與履歷雙審核機制，提交後將獲得個別化建議與優化方向健檢

• 測驗任務｜1V1 面試模擬演練（可回放）用真實模擬幫你減緩壓力，練習流暢與自信測驗

學員福利與課程特色

實用技巧避免空洞理論

系統性的教學方式

小班制輔導教學

1對1 即時回饋與建議

100% 滿意保證

實戰專案真實案例學習

秉持著正心正念正能量的精神，決不公開學員案例及作品

實用設計資源網站與常用插件應用

課程內容會根據業界趨勢與新技術持續免費更新優化

看得見的 UI 視覺・看不見的 UX 魔法

不再只是被動接受設計的人

而是成為設計的創造者。

「你將學習視覺魔法、體驗煉金術，並逐步成長為能夠打造出

讓人驚艷的數位體驗的召喚法師。👊」

魔法師@ Dora

課程比學校的更貼近實戰，老師講的使用者流程超清楚，幫助我在期末專題直接用上

設計系大學生

魔法師@ Leox39

因為想走產品經理路線，所以來補 UIUX，課程裡面的規劃產品思考方式

企管系大學生

魔法師@ 小樂

原本只是想轉職試試看，結果上完這堂課超有信心，從 UI設計邏輯到 prototype 都能跟上！

客服人員

魔法師@ Maymay

設計畫面背後的邏輯超有幫助，學完這堂課我自己也能規劃活動頁，不用每次都拜託設計師了！

行銷人員

魔法師@ Dora

課程比學校的更貼近實戰，老師講的使用者流程超清楚，幫助我在期末專題直接用上

設計系大學生

魔法師@ Leox39

因為想走產品經理路線，所以來補 UIUX，課程裡面的規劃產品思考方式

企管系大學生

魔法師@ 小樂

原本只是想轉職試試看，結果上完這堂課超有信心，從 UI設計邏輯到 prototype 都能跟上！

客服人員

魔法師@ Maymay

設計畫面背後的邏輯超有幫助，學完這堂課我自己也能規劃活動頁，不用每次都拜託設計師了！

行銷人員

魔法師@ Wendy

這門課幫我把設計流程重新整理，特別是在規劃設計那塊，的重要性，觀念變清楚很多！

UIUX 設計師

魔法師@ 小智設計練功中

從完全沒設計背景，老師講得超清楚！連我這種新手也可以做出自己的介面設計，很有成就感！

商管系大學生

魔法師@ Momo_

以前只會做 Banner，現在我能自己畫 UI！這堂課真的很適合想轉職又怕難的設計師。

平面設計師

魔法師@ Amy Lin

不是設計背景也能學！我現在做簡報、畫 wireframe 都順手多了，還能跟設計師更好溝通。

業務專員

魔法師@ Yui

UI Kit、設計規範、提案展示一次搞定，這課根本接案神器！值得 repeat 學習。

自由接案設計師

魔法師@ Wendy

這門課幫我把設計流程重新整理，特別是在規劃設計那塊，的重要性，觀念變清楚很多！

UIUX 設計師

魔法師@ 小智設計練功中

從完全沒設計背景，老師講得超清楚！連我這種新手也可以做出自己的介面設計，很有成就感！

商管系大學生

魔法師@ Momo_

以前只會做 Banner，現在我能自己畫 UI！這堂課真的很適合想轉職又怕難的設計師。

平面設計師

魔法師@ Amy Lin

不是設計背景也能學！我現在做簡報、畫 wireframe 都順手多了，還能跟設計師更好溝通。

業務專員

魔法師@ Yui

UI Kit、設計規範、提案展示一次搞定，這課根本接案神器！值得 repeat 學習。

自由接案設計師

100+ 魔法師學員好評

FAQ

回答

此課程適合什麼人學習？

剛起步、但對設計好奇的新鮮人／學生

你可能還在念書，或剛開始接觸設計，不知道從哪開始學 UI/UX？這堂課會從「設計是什麼」開始講，手把手教你：・怎麼觀察介面設計的細節・怎麼用 Figma 畫出你的第一個設計畫面・怎麼從需求到流程，自己規劃出一個 App 頁面你會從一開始「看不懂」變成「做得出來」？就算你不會畫畫、不會寫程式，也完全沒關係

平面設計師，想轉型成 UI/UX 設計師

你有設計美感，熟悉 Photoshop／Illustrator／Canva，但你可能：・不熟 UIUX 思維、流程設計・沒用過 Figma，或只會畫靜態圖・不知道怎麼從美感轉成產品邏輯這堂課會帶你：・學會用設計「解決問題」而不只是「做好看」・從 wireframe 到 prototype，一步步建立產品邏輯・練習產品常見頁面（像是登入、會員中心、購物車等）・最後輸出成「可投履歷的作品集」內容幫你從「設計感」走向「使用者思維」

想轉職成為 UI/UX 設計師（無論文科或理工背景）

你可能本來不是設計科系，但對數位產品有熱情？可能是學習力很強的斜槓人、轉職者、也可能是喜歡畫畫或架網站的人這堂課可以幫你：・打下 UI/UX 的完整架構知識（流程、用戶研究、互動邏輯・學會 Figma 的實戰技巧，從零打造你的第一份 UI 作品・練習面試會考的 UI 頁面，幫你做出一份能拿出去比稿的作品集・掌握作品輸出、講解邏輯，為轉職面試打好基礎重點是——你會真的做完一個「能代表你風格與能力」的 UI 專案

想自學 Figma、做 prototype 的設計新手／工程師

你可能不是設計師，但常常要畫 wireframe、做簡報、溝通產品畫面？這堂課會幫你快速掌握 Figma 的核心操作，包括：・頁面設計工具、元件組件、文字規劃・Prototype 設計互動、頁面連結、互動展示・常見畫面模版與套件使用方式讓你不只「做出畫面」，還能「做出可操作、有互動感的原型畫面」

PM／業務／企劃，想學 UI/UX 的非設計背景者

你不是畫圖的人，但你常常要與設計師或工程師合作你想要更懂設計思維，學會怎麼「用設計邏輯說服人」這堂課會幫助你：・理解設計師思考流程與介面安排邏輯・學會規劃頁面流程，掌握使用者行為的節奏・協助你更有效地寫 brief、審稿與參與討論讓你在產品與設計溝通上，不再只是「有感覺」，而是「有邏輯」

學完這堂課，你會收穫

・一整套 UIUX 流程（從需求規劃、資訊架構到視覺設計）・熟練使用 Figma 完成整體頁面與 Prototype 互動・一份完整設計作品，能放進作品集、或與人討論展示・持續更新的獨家設計檔案更重要的是，你會開始用「設計師的大腦」思考問題設計不是裝飾，而是一種思考的方式你會學會如何「用畫面說話」，用設計說服使用者這堂課適合任何一位——想踏入 UIUX 世界的你

選擇首要任務

免費轉職諮詢

免費資源下載

illustration

Design

Training

Figma

C4D

Blander

Sketch

Rive

lottie

Photoshop

illustration

Design

Training

Figma

C4D

Blander

Sketch

Rive

lottie

Photoshop