UI 設計師技能——履歷上的技術與軟技能
BLS 報告指出網頁與數位介面設計師（UI 設計師最接近的聯邦分類）年薪中位數為 98,540 美元，預估至 2034 年就業成長 7%，每年約 14,500 個空缺 [1]。但 2026 年 UI 設計師招聘的定義性轉變是：純粹「像素移動者」的時代已結束。Designlab 報告指出，目前版圖更偏向既能勝任 UX 與 UI、又能規劃產品設計、進行簡易研究並交出精緻視覺介面的通才 [2]。本指南指出讓 UI 設計師獲錄取、而非作品集無人看的具體技術技能、設計品味與新興能力。
關鍵要點
- Figma 已鞏固其主導設計工具的地位，熟練 Figma 進階功能（auto layout、variables、component properties、Dev Mode）現已成為基本要求，而非差異化因素 [3]。
- 理解設計系統——不只使用，還能建置與維護——是與資深 UI 設計師薪酬最相關的技術技能 [4]。
- AI 輔助設計工具、設計 token 管理與動態／互動設計，是 UI 設計師職缺中成長最快的三項技能要求 [2]。
- Nielsen Norman Group 與 Google UX Design Professional Certificate 仍是最受認可的證照，但作品集品質在招聘決策中一貫超越證照 [5]。
技術技能（硬技能）
-
Figma（進階熟練度）——超越基本 frame 與圖層管理：精通 auto layout 做響應式設計、component variants 與 properties 打造可擴展系統、variables 切換主題、具條件邏輯的互動原型，以及 Dev Mode 做開發交接。Figma 是多數產品公司的主要交付工具 [3]。
-
設計系統架構——建置、維護與治理設計系統：原子設計方法論（atoms、molecules、organisms、templates、pages）、token 管理、元件文件、版本策略與跨平台一致性。理解設計系統決策如何影響工程實作 [4]。
-
字體設計——有意圖地選擇、配對與實作字體。理解字級、行高比、字寬（行長）、垂直韻律、響應式字體，以及字體渲染在各平台與瀏覽器間的差異。字體是多數 UI 表面最大的單一組件 [3]。
-
色彩理論與色彩系統——建立系統性色彩調色盤：主色、次色、語意（success、warning、error）與中性尺度。理解色彩對比度（WCAG AA：內文 4.5:1，AAA：7:1）、色盲考量（8% 男性有色覺缺陷），以及深色模式色彩適配 [4]。
-
版面與間距系統——以網格系統（4px/8px 基本單位）設計、理解空間關係、實作一致的間距尺度，並創造在各斷點間優雅適應的版面。精通 CSS Grid 與 Flexbox 心智模型，設計可實作的版面 [3]。
-
互動設計與微互動——設計狀態轉換（hover、active、focus、disabled、loading、empty、error）、進度指示器、toast 通知、modal 互動與行動裝置手勢模式。理解緩動曲線（ease-in、ease-out、spring），並辨識動畫何時助益、何時妨礙可用性 [4]。
-
響應式與適應性設計——設計跨桌機、平板與行動裝置斷點的介面。理解流動版面、斷點策略、觸控目標尺寸（依 Apple HIG 最小 44×44px，依 Material Design 最小 48×48dp），以及內容如何在各視窗尺寸重新排列 [3]。
-
無障礙（WCAG 2.1/2.2）——設計符合 WCAG AA 合規的介面：足夠的色彩對比、鍵盤可導覽、焦點指示器、螢幕閱讀器相容性、圖片替代文字與語意結構。無障礙在許多司法管轄區是法律要求，不僅是品質追求 [4]。
-
原型製作——在 Figma、Framer 或 ProtoPie 中建置互動原型，向利害關係人與開發者傳達設計意圖。理解何時低保真點擊穿越就足夠、何時需要高保真動畫原型來驗證設計決策 [3]。
-
圖示設計與插畫——製作在產品中維持視覺一致的客製圖示學。理解圖示網格、視覺對齊、線條對填充樣式，以及以適當格式（網頁用 SVG、iOS 用 PDF、Android 用 XML）匯出圖示 [4]。
-
HTML 與 CSS 基礎——理解設計如何轉換為程式碼：盒模型、CSS specificity、Flexbox、Grid、媒體查詢與 CSS 自訂屬性（variables）。理解實作限制的 UI 設計師能設計出更可建置的介面，並更有效與開發者溝通 [3]。
-
設計交接與文件——為開發者實作準備設計規格：加註模擬圖、互動規格、元件文件、響應式行為描述與邊界案例涵蓋。使用 Figma Dev Mode、Zeplin 或類似工具架設計到開發的溝通橋樑 [4]。
軟技能
-
視覺溝通——將抽象需求（「讓入門體驗感覺受歡迎」）翻譯成達成可衡量成果的具體視覺方案。理解視覺層級如何引導注意、留白如何創造呼吸空間，以及視覺重量如何引導使用者行為 [3]。
-
利害關係人簡報——向產品經理、工程師與高階主管簡報設計工作。以證據（使用者研究、啟發式原則、競品分析）而非個人偏好，闡述設計理由——為什麼這個版面、為什麼這個字體、為什麼這個互動模式 [5]。
-
設計評審參與——在設計工作上給予並接受建設性回饋。將個人美學偏好與基於證據的設計決策區分，提問以揭露潛在問題而非開立解方，並基於回饋迭代而不帶防衛心 [4]。
-
跨職能協作——與產品經理（需求與優先順序）、工程師（可行性與實作）、UX 研究員（使用者需求與驗證）與內容設計師（文案與用語）有效合作。理解鄰近學科的 UI 設計師能產出更好的作品 [3]。
-
對使用者的同理——為真實使用者而非理想化的角色設計。理解認知負載、動作限制、低識字率、網路不穩與情緒狀態如何影響人與介面的互動。同理心產出適用於全光譜使用者的設計，而不只是設計師的同儕 [5]。
-
注重細節——察覺 1 像素錯位、不一致的邊框圓角、未設計的 hover 狀態，或使用者姓名溢出容器的邊界案例。專業的 UI 設計需要像素級精度結合系統性一致 [4]。
-
時間管理與範疇協商——在衝刺時程內交出設計工作同時維持品質標準。當時程不切實際時協商範疇：提出先交核心功能、後做精修的分階段方法 [3]。
-
設計系統倡議——在組織中倡議設計系統投資、治理與採用。向工程領導階層解釋為何設計系統能減少技術債、加速開發並改善一致——用指標而非僅用設計原則 [4]。
高需求新興技能
-
AI 輔助設計——使用 AI 工具（Galileo AI、Figma AI 功能、Uizard）進行快速概念生成、版面建議與設計變化探索。理解如何將 AI 當作加速器，同時維持設計判斷與品牌一致性 [2]。
-
設計 Token 管理——將設計 token（色彩、間距、字體、陰影值）定義並管理為在設計工具與程式碼間同步的平台無關變數。使用 Tokens Studio（Figma 外掛）、Style Dictionary 或 Specify 等工具建立單一真相來源 [4]。
-
UI 動態設計——設計傳達狀態變化、提供回饋並引導注意的有目的動畫。使用 Lottie、Rive 或 Framer Motion 等工具製作增強可用性而不降低效能的輕量動畫 [2]。
-
可變字體與響應式字體——實作可依據視窗或情境調整字重、字寬與光學尺寸的可變字體。理解可變字體軸如何運作，並設計利用這些能力提升跨裝置可讀性的字體系統 [4]。
-
空間設計（AR/VR/XR 介面）——為 Apple Vision Pro、Meta Quest 與其他空間運算平台設計介面。理解深度、空間音訊整合、注視互動，以及 3D 介面設計的獨特限制。這是 UI 設計師的新興前沿 [2]。
如何在履歷上呈現技能
- 以作品集 URL 領頭。 沒有作品集連結的 UI 設計師履歷是不完整的。放在姓名正下方的標題區。
- 描述成果，而非交付物。 不要寫「設計儀表板介面」，改寫「重新設計分析儀表板，將取得洞察時間減少 40%，日活躍使用率提升 25%（經 Amplitude 量測）」。
- 寫出具體的設計系統貢獻。 「在 Figma 中建置並維護 200+ 元件的設計系統，服務 8 個產品團隊」展現系統層級思考。
- 將無障礙作為技能，而非事後考量。 「設計符合 WCAG AA 的介面，所有使用者畫面達到 100% 色彩對比合規」傳達專業成熟度。
- 提及開發者協作方法。 「主持每週設計—工程同步會議，透過完整設計文件將實作問題減少 60%」展現跨職能有效性。
依職涯等級分的技能
入門級（0-2 年）
- Figma 基礎：frames、圖層、元件、auto layout
- 基本字體與色彩理論應用
- 行動與響應式設計原則
- 簡單的使用者流程原型
- 理解無障礙指引（WCAG AA 基礎）
- 展示流程與成果的 3-5 個案例研究作品集
中階（3-5 年）
- 進階 Figma：variables、component properties、互動原型
- 設計系統貢獻與元件製作
- 關注狀態管理與微互動的互動設計
- 跨平台設計（web、iOS、Android 設計模式）
- 設計交接與開發者協作流程
- 利害關係人簡報與設計理由闡述
- 指導資淺設計師的工藝品質
資深級（6+ 年）
- 設計系統架構、治理與跨團隊採用
- 設計策略：將商業目標轉化為設計方向
- 設計領導：招聘、作品集審查、團隊文化發展
- 設計營運（DesignOps）：工作流程、工具標準化、品質流程
- 產業思想領導力：會議演講、發表文章、開源貢獻
- 高階主管溝通：將設計決策與商業指標連結
- 新興平台設計（空間運算、語音、對話式 UI）
驗證技能的證照
-
Google UX Design Professional Certificate——Google 透過 Coursera 發證。七課程計畫涵蓋設計思考、線框、於 Figma 原型、可用性測試與作品集發展。產出三個端到端專案案例 [5]。
-
Nielsen Norman Group UX Certification——NN/g 發證。需完成 5 天全天課程，涵蓋互動設計、視覺設計、UX 研究與資訊架構。來自首屈一指可用性研究組織的最受尊重 UX/UI 證照 [5]。
-
IBM UI/UX Designer Professional Certificate——IBM 透過 Coursera 發證。4 個月計畫涵蓋設計思考、Figma、使用者研究與作品集發展。無先修條件 [5]。
-
Microsoft UX Design Professional Certificate——Microsoft 透過 Coursera 發證。涵蓋設計流程、原型與利害關係人管理。對鎖定企業產品角色的設計師特別有價值 [5]。
-
Interaction Design Foundation（IxDF）認證——Interaction Design Foundation 發證。提供 UI 設計、互動設計、設計思考與無障礙的專精課程。可自行安排進度，終身使用 [5]。
-
IAAP Certified Professional in Accessibility Core Competencies（CPACC）——International Association of Accessibility Professionals 發證。驗證對無障礙原則、標準與包容設計實務的理解。隨著無障礙成為法規要求而越來越受重視 [4]。
-
Figma Professional Certificate——Figma 發證。驗證進階 Figma 熟練度，包括設計系統、原型與協作功能。來自主導設計工具平台的直接證照 [3]。
常見問題
Q：UI 設計與 UX 設計的差別是什麼？ A：UI 設計聚焦介面的視覺與互動元素：字體、色彩、版面、元件設計與互動模式。UX 設計涵蓋更廣的使用者體驗：研究、資訊架構、使用者流程與可用性測試。實務上，許多角色結合兩者。Designlab 2025 趨勢報告指出業界越來越偏好兩者兼備的通才 [2]。
Q：要成為 UI 設計師需要學位嗎？ A：不需要學位，雖然許多 UI 設計師持有平面設計、視覺傳達或 HCI 的學士學位。作品集品質與可展示技能在招聘決策中一貫勝過正式證書。證書計畫（Google UX、NN/g）與訓練營（Designlab、Springboard）為轉職者提供結構化學習路徑 [5]。
Q：該學哪個設計工具——Figma、Sketch 或 Adobe XD？ A：Figma。它在市場上占主導地位，是多數產品公司的主要工具。Adobe XD 已停止開發。Sketch 在部分組織仍保有存在，但 Figma 的協作功能與跨平台可用性使其成為業界標準 [3]。
Q：身為 UI 設計師能預期什麼薪資？ A：BLS 對網頁與數位介面設計師的中位數為 98,540 美元（2024 年 5 月）[1]。主要科技公司的資深 UI 設計師總薪酬達 140,000-180,000 美元。產品設計主管與設計經理可超過 200,000 美元。地理位置、公司規模與產業類別顯著影響薪酬。
Q：程式設計對 UI 設計師有多重要？ A：理解 HTML、CSS 與基本 JavaScript 越來越有價值——不是為了寫生產程式碼，而是為了理解實作限制、設計可建置的介面，並有效與工程師溝通。CSS 知識直接改善版面、間距與響應式行為的設計決策 [3]。
Q：應專精行動或網頁設計？ A：兩者都學。多數產品角色需要跨平台設計。也就是說，理解平台專屬指引（Apple Human Interface Guidelines、Material Design）很重要。若必須選擇，網頁設計提供更廣的應用，而行動專精在以 App 為核心的公司可獲溢價薪酬。
Q：UI 設計師最大的作品集錯誤是什麼？ A：只展示最終模擬圖而沒有流程。招聘經理想看你如何思考：你識別的問題、告知決策的研究、你探索並拒絕的替代方案，以及你的設計改善可衡量成果的證據。沒有脈絡的精緻 Dribbble shot 對招聘經理透露不出任何關於你設計判斷的訊息。
以 Resume Geni 建立符合 ATS 最佳化的 UI 設計師履歷——免費開始。
引用來源： [1] U.S. Bureau of Labor Statistics，"Web Developers and Digital Designers"，Occupational Outlook Handbook，https://www.bls.gov/ooh/computer-and-information-technology/web-developers.htm [2] Designlab，"The 11 Best UX Design Certificates (2026)"，https://designlab.com/blog/best-ux-certificates [3] Coursera / Google，"Google UX Design Professional Certificate"，https://www.coursera.org/professional-certificates/google-ux-design [4] Uxcel，"Top 13 Certificates in UX Design Programs in 2026"，https://uxcel.com/blog/best-certificates-ux-design [5] Coursera / IBM，"IBM UI/UX Designer Professional Certificate"，https://www.coursera.org/professional-certificates/ibm-ui-ux-designer [6] U.S. Bureau of Labor Statistics，"Web and Digital Interface Designers (OES)"，https://www.bls.gov/oes/2023/may/oes151255.htm [7] Noble Desktop，"UI Designer Job Outlook"，https://www.nobledesktop.com/careers/ui-designer/job-outlook [8] CPO Club，"18 Best UX Design Certifications in 2026"，https://cpoclub.com/career/best-ux-design-certifications/
