# UX 設計現況與職涯觀 * UX 產業規模 114 億美元,預計 2030 年翻倍 * UX 設計仍有入行門檻低、薪資高、創意與影響力兼具優勢 * 不需程式、不像產品經理有無限會議 * 職涯發展非短期速成,證書或大公司認證非必要 # 心態與身份認同 * 必須先相信自己是設計師,不依賴外部認可 * 不要過度依賴「UX Designer」職稱 * 職稱各公司不同,例如 Apple: Human Interface Designer、Google: Interaction Designer * 應接受 Product Designer 身份,擁抱 UI、UX、產品思維、商業思維與程式概念 # UI 設計練習步驟 * 先練習 UI 而非 UX,UI 是求職時的第一印象 * 選擇 Figma 作為唯一工具 * 從重建喜愛 App 的 Wireframe 開始 * Wireframe 是數位簡易草圖,表示設計的高層概念與版面權重 * 只需矩形與文字兩種工具 * 練習不同 App 或網站,每天重複 # 建立學習系統 * 單靠努力不足,需系統、網絡、創意、心態與時機 * 找兩位志同道合者,週會設定目標、共同工作並互評 * 可加快回饋、擴大人脈、培養團隊經驗 # 高保真設計與追蹤練習 * 練習將截圖轉為高保真設計(Mockup) * Pixel-to-pixel tracing,掌握 UI 細節 * 練習顏色組合、字體、邊距、間距 * 建立 UI 的直覺能力,避免被 AI 超越 * 每天截圖並追蹤設計 # 原型與流程設計 ![image](https://hackmd.io/_uploads/B1yBhdlNbx.png) ![messageImage_1767046272015](https://hackmd.io/_uploads/HJy53_gVbx.jpg) * 進入原型設計,將靜態設計變為可互動流程 * 學習將多個頁面連結,模擬真實產品操作 ![image](https://hackmd.io/_uploads/HJr6n_gN-e.png) * 學習 Auto Layout 自動對齊元件 ![image](https://hackmd.io/_uploads/BJoa2ul4Wl.png) * 建立元件與設計系統,方便多頁維護與系統化設計 ![image](https://hackmd.io/_uploads/ByURhug4Zx.png) * 學會管理多個版本與標註設計 # 進階 UX 設計學習 ![image](https://hackmd.io/_uploads/rkC0ndx4Wl.png) * 技術能力建立後,進入 UX 設計學習 * 可選擇課程(如 Google UX Certificate)或自學(如 ChatGPT) ![image](https://hackmd.io/_uploads/ryLe6_lEZl.png) ![image](https://hackmd.io/_uploads/rkbf6OeNbe.png) * 主要流程包含 Double Diamond 與 Design Thinking * 學習工具與概念:Persona、Empathy Map、用戶訪談、可用性測試、Gestalt 原則 * 模板僅供參考,設計無標準答案,需靈活運用 * 實務中常需妥協,持續更新知識庫 --- # 設計需要兼顧商業價值 * 當公司支付你 $150K/年,他們希望投資有回報 * 設計決策不僅改善使用者體驗,也需對業務有幫助 # 快速提升商業敏感度的方法 * 修商業課程 * 參加專業培訓計畫 * 自學(例如使用 ChatGPT 或 Gemini) * 實際參與業務工作 # 設計師應具備的商業能力 * 理解基本商業術語,能夠進行商業對話 * 在專案中知道使用哪些關鍵指標衡量成功(如轉換率、留存率) * 估算專案可帶來的年度營收 * 了解設計成本與可行性 * 熟悉合作角色:PM、工程師、內容設計師、設計經理、資料分析師、法務、行銷、VP 等 * 能快速理解產品背後的商業模式 # 商業模式與關鍵指標示例 * YouTube 的商業模式:廣告(Ads) * 關鍵指標:觀看時長(Watch Time) * 專案目標應與增加觀看時長相關 # 建議職涯策略 * 先創業,再申請設計職位 * 目標應是中高階或設計主管職位,而非初級職位 * 創業初期可先建立品牌概念、名稱、Logo、字體,作為履歷經驗 * 可在美國或其他成熟國家以個人經營者身份開立發票,不必立即成立 LLC * 對於發展中國家,建議在成熟國家註冊以節省成本、時間與麻煩 # 創業心態與優勢 ![messageImage_1767046564203](https://hackmd.io/_uploads/ByGh6_xVbe.jpg) * 身份轉變為創業者或產品設計主管,提高自信與耐心 * 以實際付費客戶為目標,而非僅完成作品集 * 更重視作品品質和商業價值 # 首個專案建議:Web App * 在專案前先市場驗證,確認使用者是否真的有問題,以及願意支付多少 * 建立營收模型,確保產品可持續運作 * 使用無程式碼工具(No Code)建立可運作的產品連結 * 執行行銷與銷售,至少建立等待名單與電子郵件收集 * 分享作品以獲取反饋,提升專案影響力 * 利用現有 No Code 工具快速實現產品原型,降低成本與時間 --- # 建立作品集的時機與方式 * 第一個專案完成約 80% 時開始思考作品集 * 先做 10 頁 PDF Pitch Deck,不建議立即建立網頁作品集 * 避免論文式作品集,專注說明為何別人該找你幫助成長 # Pitch Deck 建議 * 先做 Wireframe,聚焦整體架構而非細節 * 先寫好文字與 pitch 內容,再加視覺元素 * 可使用 AI 協助,如 ChatGPT 或 Gemini * 早期請真實人給回饋,尤其是企業主或目標受眾 * 下載 PDF 或上傳至雲端產生作品集連結 # 找第一位付費客戶 * 優先順序:認識的企業主 → 二度人脈 → 面對面社交 → 線上社交或冷郵件 * 信任建立需要時間 * 優先安排面對面或視訊會議 * 了解客戶產品比單純排練 Pitch Deck 更重要 # 專案過程與學習 * 第一個客戶專案通常混亂、遇到不熟悉的需求或限制 * 在混亂中學會快速取捨與協作 * 記錄專案演進,如從版本 1.0 到 4.4 的過程 # 建立網頁作品集 * 專案完成約 80% 時開始建立網頁作品集 * 先在 Figma 設計,後導出至 Framer 建立網頁 * 作品集仍是 Pitch,先做 Wireframe,再做高保真 * 建議展示 3–4 個案例研究 # 擴展人脈與求職策略 * 持續建立並擴大網路圈 * 如果可行,考慮搬遷以拓展科技人脈 * 求職策略:優先取得推薦,再申請大公司職缺 * 同時大量申請所有 UX/UI/Product/Growth Design 職位 * 透過人才中介或招募者獲得隱藏高階職缺 # 求職心態與目標設定 * 首次求職可能遇到挫折,但每次經驗都累積資歷 * 將大目標拆分為可控小目標,例如每天追蹤截圖設計 * 與其他專業領域比較,保持耐心與動力 * 慶祝每個階段成就,認知自己的進步 --- # Terminology * 使用者體驗設計(User Experience Design, UX):設計產品以提升使用者滿意度與效率 * 產品設計(Product Design):綜合 UX、UI、商業與技術思維設計產品 * 人機介面設計(Human Interface Design, HCI):專注於使用者與系統交互的界面設計 * 互動設計(Interaction Design, IxD):設計使用者與產品之間的互動行為 * 成長設計(Growth Design):以用戶增長及產品成效為導向的設計方法 * 設計工程師(Design Engineer):同時掌握設計與技術實現的職位 * 使用者介面設計(User Interface Design, UI):設計產品視覺元素與操作介面 * 線框圖(Wireframe):產品低保真結構圖,用於規劃界面與資訊層級 * 高保真設計(High-Fidelity Design):精細設計,接近最終產品的外觀與互動 * 原型(Prototype):可互動展示的產品設計模型 * Figma:主流 UI/UX 設計與原型工具 * 元件(Component):可重用的設計元素 * 設計系統(Design System):統一的設計規範與元件集合 * 自動佈局(Auto Layout):自動排列元素以保持間距與對齊 * 像素精準追蹤(Pixel-Perfect Tracing):精確模仿現有產品的設計 * 使用者研究(User Research):收集使用者需求與行為資訊 * 人物誌(Persona):代表目標使用者的虛擬角色 * 同理心地圖(Empathy Map):理解使用者心理、需求與痛點 * 使用者訪談(User Interviews):直接向使用者收集意見的方法 * 可用性測試(Usability Testing):檢驗產品是否易於使用的方法 * 格式塔原則(Gestalt Principles):視覺設計中整體感知規律 * 設計思維(Design Thinking):以使用者為中心的創新流程 * 雙鑽石設計流程(Double Diamond Process):探索與定義問題,再創造與交付解決方案 * 原型互動(Prototype Interaction):設計中模擬使用者操作的互動行為 * 覆蓋層(Overlay):可疊加於現有畫面之互動元素 * 垂直滾動(Vertical Scroll):頁面上下滾動功能 * 水平滾動(Horizontal Scroll):區域或元件左右滾動功能 * 跨頁跳轉(Cross-Page Navigation):從一頁到另一頁的互動設計 * 固定元素(Fixed Element):滾動時保持位置不變的 UI 元素 * 版面規劃(Layout Planning):安排頁面元素的位置與結構 * 視覺層級(Visual Hierarchy):元素的重要性排序與呈現方式 * 間距(Spacing):元素之間的距離或留白 * 對齊(Alignment):元素在版面上的整齊排列 * 字體排版(Typography):文字樣式、字距、行距的設計 * 配色(Color Palette):設計中使用的顏色組合 * 商業思維(Business Thinking):設計決策需考量產品獲利與成效 * 轉換率(Conversion Rate):衡量使用者完成特定目標的比例 * 留存率(Retention Rate):衡量使用者持續使用產品的比例 * 成本估算(Cost Estimation):預測實現設計的時間與資源需求 * 職能協作(Cross-Functional Collaboration):與 PM、工程師、內容設計等協作 * 商業模式(Business Model):產品如何創造收入的方式 * 廣告收入(Ad Revenue):透過廣告獲利的商業模式 * 訂閱收入(Subscription Revenue):透過訂閱獲利的商業模式 * 產品迭代(Product Iteration):產品設計與功能的反覆優化 * 個人品牌(Personal Branding):打造自身專業形象與價值 * 創業實踐(Entrepreneurial Practice):以創業方式建立設計經驗 * 作品集(Portfolio):展示設計能力與案例的集合 * Pitch Deck:向客戶或投資人展示專案價值的簡報 * 市場測試(Market Validation):驗證目標用戶是否願意付費 * 無程式碼工具(No-Code Tool):不用寫程式即可建立產品的工具 * 業務拓展(Business Development):尋找客戶與建立收入來源 * 網路拓展(Networking):建立專業人脈以獲取機會 * 推薦(Referral):透過人脈引薦取得工作或專案機會 * 高級職位(Senior Role):中高階設計職位,需求量大於初級職位 * 合同職位(Contractor Role):以承包形式完成公司的設計任務 * 職涯規劃(Career Planning):設計師長期發展與職位選擇策略