Chapter 5. Make 動人呈現，包含 6 個小節：
- 5–1. 常見的互動設計準則
- 5–2. 如何制定資訊架構
- 5–3. 視覺設計佈局
- 5–4. 原型設計
- 5–5. 交付開發文件
- 5–6. 如何日常練習 UX 設計
✨ 策略的起手式是選擇，你不可能迎合所有人的需求 — Michael Porter
三個設計準則
- 為任務而設計：找尋資訊
- 為理解而設計：空間氛圍、呈現內容
- 為永續而設計：支持商業增長
設計師共同的疑惑：我真的能帶給商業增長嗎？
好奇因為沒資源做研究，沒辦法知道這樣做到底有沒有帶給商業增長的話，只能靠經驗？或是靠厲害的業務嗎？
✨ 資訊架構三元素、四步驟、六大心法
資訊架構設計三元素：
- Context 商業脈絡
- User 使用者
- Content 內容
設計資訊架構四步驟：
- STEP1. 了解產品目標
- STEP2. 找到關鍵影格
- STEP3. 製作關鍵影格
- STEP4. 確立階級關係
設計資訊架構六大心法：
- 譬喻：善用譬喻降低學習曲線
- 思考使用情境：考慮市場使用情況及習慣
- 設計語言體系：一致性使經驗連續，模組化可讓開發更有效率、更心更迅速
- 品牌風格：產品代表了品牌風格
- 語意：溝通方式＝氣質
- 動畫設計： 動態觸及淺意識
這裡提到擬真，過去是擬真到平面，感覺又要回到擬真
這裡跟 WEI 討論，我們習慣都是分三層，好奇為什麼往下滑會設為 Tier2 的原因?
✨好用的視覺設計佈局：競品分析、moodboard 情緒版
- 競品分析
收集案例、分析亮點、收斂共同點
- moodboard情緒版
收集元素
這邊我好奇，大家都會使用 GRID 進行排版嗎？ 有時候使用 GRID，會被說沒變化 XD
WEI 分享了，應該看資訊內容量、使用者要看什麼，盡可能的變化，或是元件上也可以做變化。
✨ 原型設計能更有效的溝通
平常沒有很常做 Prototype，藉由這次又複習了一次
mouse hovering ⭢ 滑鼠移開，回到原樣
mouse entering ⭢ 滑鼠移開，不會回到原樣(停在原地)
WEI 不知道大家作原型是分功能，還是A做完B的直接疊上呢
✨ 設計交付是一個過程，而非終點
課程中提到的整理 page，以加速檔案載入及找尋位置，以及 changelog、追蹤表格等等內容，目前都有實作中，不過仍免不了遇到做了沒人看的問題。
這裡分享跟幾位設計師聊聊後，他們的做法：
- QA 時狂開 Ticket，開久他們就會被轟炸，就會看了
- 跟課程中一樣，做設計稿跟實際的對照，讓他們清楚知道哪裡長不一樣，並建立追蹤表 (但還是不一定會改呦!)
當然，我們也有問工程師為什麼不看呢？他們其實就是看時程，很趕就不會做細節。
另外，也延伸討論了目前使用 figma 的情況，其實還是滿多工程師是看免費版的內容。
因此我們也好奇，如果有 Dev Mode 可以直接看到細節變化，會更願意看以及做嗎？
而 WEI 也分享了他們是在 Figma 做訊息總表，在 Airtable 做追蹤表。
另外，WEI 目前正在找一個如何提供更清楚文件的方式，因為 SA 反應全部做在一張圖，太多內容，很難找在哪。
之前 WEI 也分享做自己在做追蹤表的內容，有興趣可以參考 【設計雜記】四步驟完成 UX/UI 設計師可以準備的測試案例文件！
✨日常練習 UX 設計：了解趨勢、大量使用案例產品、累積創意、善用工具
- 了解趨勢：走紅原因、實際案例、內容限制
範例 ➊ 圓角：可以讓視覺更集中
範例 ➋ Bento Box 設計風格：可更快速的適應各種尺寸裝置
如果對 Bento Grid 有興趣，可以閱讀 2023 網頁設計趨勢：Bento Grid。
範例 ➌ 漸層顏色：由於今年 AI 興起，需要呈現許多純文字內容，漸層本身能讓畫面有流動感
- 大量使用案例產品
當拿到專案沒想法時，就是大量玩手機就對了！
好奇如果是金融產品，是否就是要投入自己的錢去嘗試呢？
- 累積垃圾桶中的創意
提案被丟掉的 idea、workshop 產出的各種方案，將這些分門別類建立自己的創意資料庫，未來提到時，就能快速產出概念。
- 善用工具，不停止學習新軟體
製作更快，就能體驗更多人生。
很多 AI 工具，通常會導因唯果，還是要了解設計原理、目標、準則，再來選擇 AI 工具。
✨ 天下武功，唯快不破
思緒夠快的設計師，才能夠四面八方的把資訊彙整成洞察；手腳要夠快的設計師，得夠快速勾勒框架，贏得時間來精進細節。
Lydia 最後提到加薪的訣竅是先有架構後精修，並且可以精確計算自己的工時與產值，就能夠與老闆談薪！
以上就是我們針對 Chapter5 的閒聊討論，如果你有其他想法，歡迎一起交流！
我們下次見！👋
謝謝你的閱讀！
如果喜歡這次的分享，請跳起來 👏👏 吧！
