UX設計 是做什麼的?
致謝:由 Peter Bamuhigire 分享,techguypeter.com,+256 784 464178。
將已核准的網站策略與體驗證據轉化為獨特且可實作的高級UX方向。
使用時機
- 潛在客戶開發、電子商務、高價商品或公信力網站需要高級UX閘控時
- 視覺方向必須與實作限制連結時。
不應使用時機
- 一般視覺原則應使用
chwezi-design-engine,或由design-system擁有的代幣實作。
必要輸入
| 產出物 | 來源或提供者 | 必要? | 目的 | 若缺失時 | |---|---:|---|---| | 已核准的策略、體驗地圖、內容階層、品牌證據、參考分析及技術限制 | 上游網站技能與外部設計原則 | 是 | 定義可實作的體驗方向 | 當策略或內容階層缺失時停止 |
工作流程
- 載入外部設計原則並驗證上游策略
- 選擇階層、互動、字體方向、狀態及響應式行為
- 測試獨特性、可及性、多語言擴充及低頻寬限制
- 遇到禁止的預設或不受支援的模式時停止,修正方向,然後將決策交接給設計系統與頁面建置器。
產出
| 產出物 | 消費者 | 接受條件 |
|---|---|---|
| 高級UX方向與實作摘要 | 設計系統與頁面建置器 | 說明字體選擇理由、階層、元件、狀態、斷點、動畫限制及品質風險 |
產生的證據
| 證據 | 消費者 | 接受條件 |
|---|---|---|
| 決策與審查紀錄 | 設計與發佈負責人 | 將每個主要視覺選擇連結至品牌、行為、可及性、或效能證據 |
能力合約
需要具備讀取、搜尋及視覺檢查能力。規劃預設為唯讀;編輯設計產出物或程式碼需要實作授權。資產授權、外部發佈、支出及生產異動需要明確授權。
降級模式
若缺乏渲染、字體、資產或外部原則,則返回最狹義的合格方向,將視覺檢查標記為 not assessed,且不認證高級品質。
決策規則
| 選擇 | 動作 | 避免的失敗或風險 |
|---|---|---|
| 品牌與內容證明應使用獨特的展示字體 | 指定字體並提供效能後備方案 | 產生一般AI預設字體 |
| 互動未增加任務價值或損害3G使用體驗 | 移除或簡化互動 | 造成裝飾性的摩擦 |
品質標準
- 在視覺製作前說明所選字體及其理由;涵蓋錯誤、空值、載入、聚焦、停用狀態;滿足可及性及非洲效能限制。
反模式
- 使用 Inter 或裸系統字體堆疊作為主要字體。修正:選擇符合品牌的允許字體並記錄原因。
- 使用紫色漸層作為高級的速成象徵。修正:從品牌證據中推導色彩與對比。
- 只設計首頁。修正:為每個範本系列定義共用模式。
- 忽略非快樂路徑狀態。修正:指定錯誤、空值、載入、聚焦、停用行為。
- 未經渲染即認證品質。修正:將視覺評估標記為
not assessed並要求視覺品質保證。
工作範例
針對坎帕拉的顧問公司,選擇符合其權威定位的授權編輯襯線字體,搭配輕盈無襯線字體用於行動裝置實用性,並在3G字體預算下測試後才交接。
參考資料
- ux-strategy-differentiation-and-meaning.md — 在制定UX策略、差異化及未經測試不得發佈的證據規則時閱讀。
- lean-design-cycle-and-deliverable-selection.md — 在選擇精實設計週期與合適交付物時閱讀。
- enterprise-internal-tools-and-portal-ux.md — 在設計內部工具或客戶入口網站時閱讀。
- ai-feature-discovery-and-risk-framing.md — 在決定是否及如何加入AI功能時閱讀。
- ai-interface-trust-and-control-spec.md — 在指定AI介面的信任、控制與修正時閱讀。
- ux-discovery-and-wireframe-procedure.md — 在執行UX探索、旅程地圖、網站地圖與線框圖時閱讀。
- 網站技能撰寫標準
保留領域使用指引
- 網站必須呈現足夠的高級感,以證明高價定價、信任或嚴肅商業關注的合理性。
- 建置潛在客戶開發、電子商務、產品、作品集、SaaS行銷、飯店、教育、醫療保健、非營利或企業網站。
- 網站有看起來過於一般、套版、過度裝飾、緩慢、難以掃讀或視覺廉價的風險。
- 網站必須讓業主的提案感覺更具價值,同時也作為開發者高級工藝的證明。
保留領域輸入
- 網站策略簡報、目標受眾、提案、品牌定位、內容清單、照片/資產及轉換目標。
- 任何現有設計系統、螢幕截圖、競爭者基準及效能/可及性限制。
保留領域工作流程
- 定義網站的商業任務:信任、轉換、銷售支援、申請、預訂、捐款、產品教育或權威建立。
- 選擇符合買家與提案的視覺語調:營運型、編輯型、奢華極簡、消費者精緻、機構型或本地高級型。
- 當簡報需要高級定位、內容、SEO、技術堆疊或代理證明時,載入
premium-website-product。 - 在設計樣式部分之前,根據轉換路徑建立階層。
- 使用高級手冊建立設計系統:視覺原則、色彩、字體、間距、圖像、動畫、圖表/表格及生產潤飾。
- 在頁面製作前及視覺品質保證後套用高級網站閘控。
- 在專案計分卡與設計品質報告中記錄證據。
保留領域品質指引
- 第一個視窗應立即傳達品牌/類別、提案、公信力及主要行動。
- 版面在主要範本中具備響應式、快速、可及且視覺一致。
- 只要可能,圖像應顯示真實產品、地點、人物、證明、介面或結果。
- 色彩、字體、間距及動畫應使用代幣化且商業上合適。
- 表單、定價、服務頁面、產品頁面及聯絡流程應減少焦慮並使下一步驟明確。
- 數據、推薦、案例研究、統計數據及比較應以準確且可讀的視覺階層呈現。
- 簡約被視為高級:導覽、表單、內容區塊、狀態變更及行動流程應減少買家負擔,但不隱藏必要的證明。
- 每個主要範本在高級UI/UX閘控及設計品質評分標準中至少獲得8/10分。
保留領域反模式
- 登陸頁面感覺像一般AI輸出:模糊漸層、雲朵背景、裝飾性卡片堆疊、劣質庫存照片及未經證實的主張。
- 美觀的頁面卻未解釋提案或引導使用者朝向商業成果。
- 單一色調的調色板、擁擠的行動裝置版面、緩慢的首頁媒體及不可及的覆蓋層。
- 在需要證明、清晰度及信任的地方使用視覺新穎性。
保留領域產出
- 高級網站UX摘要、視覺方向、代幣方案、頁面層級品質備註、轉換路徑指引或閘控報告。
保留領域參考資料
references/premium-website-ui-ux-playbook.md- 書籍衍生的網站設計規則。references/enterprise-website-ux-playbook.md- 企業網站利害關係人、證明、導覽、信任及非洲校準UX規則。references/mobile-dashboard-website-patterns.md- 行動導覽、首次訪問指引、儀表板/證明呈現及行動品質檢查。references/premium-website-gate.md- 評分與封鎖缺陷。../premium-website-product/references/premium-website-market-asset-gate.md- 網站作為高級產品、內容、SEO、發佈、技術堆疊及代理證明閘控。references/source-register.md- 來源歸屬與權利閘控;不主張任何活躍來源路徑。
世界級UX基礎(書籍衍生)
在啟動高級專案前必須閱讀:
references/levy-four-tenets.md— 四大原則框架(商業策略 + 價值創新 + 驗證使用者研究 + 殺手級UX設計);客戶簡報中應拒絕的前10大反模式。references/enterprise-five-outcomes.md— 五項強制成果(有用 / 簡單 / 高效 / 愉悅 / 可及)作為發佈前閘控。任何一項為「否」即不得發佈。references/pm-collaboration-rules.md— Fekeshazi 5+1(5-10分鐘內能解釋、設計為持續過程等)及「不要將重要功能藏在選單中」規則。
如果簡報未通過Levy前10大檢查或遺漏五項成果中的任何一項,請在範圍界定前退回。