前言

5W1H 分析法是一種思考方式，一種原理，也是一種工具，通過對 6 個方面提出問題，思考分析并進行解答。

往期推薦：

將 5W1H 分析法運用到工作流程中，通過這種科學的分析方式，在執行前可以幫助我們從各個方面去了解產品和需求，也可以更好的規劃工作順序與步驟，使工作更高效的執行和完成。

一、What 要做什么需求

設計需求可能是一個 0-1 的新產品，一個迭代版本，又或是針對需要解決的問題出解決方案等等。

1. 當面對新產品時

需要先對產品的定位和類型有一個大概的了解，產品的定位和類型在一定程度上會影響著產品的視覺風格。

舉例，當需要做一個萌寵資訊類的產品，以下視覺類型怎么選擇：

當產品換成時事新聞資訊，再選一次，結果是否會不同。

當我們根據產品的定位和類型在腦海中有初步的視覺風格歸類時，再根據產品定位去尋找和對標主流競品。對產品的主流競品進行設計層面的分析：

對競品的設計結果進行分析既可以快速的幫助我們了解市場的現狀，進一步確定視覺風格，同時也可以根據對競品進行反推得出的結果來打造差異和創新。

2. 當面對迭代產品時

需要在出圖前，參考產品的風格和根據以往的設計規范來保持設計風格的統一。

3. 當針對需要解決的問題出解決方案

先思考在什么情況下會出現這種問題，然后找到關鍵原因，參考競品，構思可行的優化方案。初步與開發討論技術實現可能性，最后提出解決方案。

二、why 為什么做/實現什么目標

1. 當任務是設計層面的“解決方案”

每個需求都有它產生的原因，有時我們接到的任務就已經是一個詳細的需求或者交互稿，并不清楚為什么這么做。這時預防改 N 稿的關鍵就是在埋頭執行前多問為什么，了解清楚需求產生的原因和要實現的目標。

然后根據需求目標從用戶體驗、交互上的拓展性和兼容性、按照需求完成設計是否有可能會引發別的問題等等，去思考和設想是否有更好的解決方案。

在一次次的了解、思考和學習的過程中可以為我們積累許多經驗、問題的解決方式。當工作內容不僅僅只是執行的時候，這些積累的經驗都能讓我們更好的完成任務。

2. 當可以介入需求評審時

在了解需求產生的原因和產品目標的過程中，需要我們站在設計表現層面的立場上去思考和發現可能產生的問題，早一些將這些問題在需求階段暴露出來，可以更好的避免在執行的過程中反復調整和修改。

3. 當需求比較模糊時

有時需求來源于老板、甲方或者產品，他們可以很直接的表達戰略層面的問題、產品的目標。但作為設計表達層面，很難直接告訴我們應該怎么做，也可能沒想好要怎么做。當我們不確定他們的想法時，根據產品的目標參考競品，再提交高保真的產品頁面，不需要精細到可以直接交付給開發的程度，甚至有可用的截圖也可直接拼湊，用最快的方式來完成方案，最好多出一版風格作為比較。

當一個具體的內容展現在他們面前時，就可以根據這些參考，一步步的明確自己的想法。

三、Who 主要的用戶群體

每個產品都有自己的主要用戶群體，比如常見的用戶畫像、情緒板都是為了能夠精確的去分析產品的主要用戶群體的行為習慣、用戶特征等方面。在當前階段就簡單的從兩個方面去分析產品主要用戶群體：

1. 用戶性別占比

有時候用戶性別占比也會影響著產品的視覺風格。如美圖秀秀、唯品會、美柚的女性用戶群體占比比男性更多，所以在整體產品的視覺風格都會偏向女性化一些，色調更多為暖色調的粉色、紫色鮮艷的色彩，形狀也更為柔和。

2. 用戶年齡范圍

相比較年長的用戶群體來說，年輕的用戶更樂意更容易去嘗試、使用和接受新鮮事物。一些運營推廣、頁面視覺風格可以考慮是否進行大膽的風格嘗試，用新鮮感來吸引年輕的用戶群體。

如果主要的目標用戶群體就是大齡用戶，那么在設定一些字體大小、按鈕大小、整體布局的時候就需要為照顧大齡用戶的文字的可讀性、產品易用性去思考和設計。可以參考淘寶的適老化設計 6 個原則：

四、Where 用戶的使用場景

分析和模擬用戶在不同場景下使用產品，以及在使用產品的過程中可能遇到的問題，可以幫助我們更一步的明確界面元素的設定、頁面的交互方式和效果。一些例子：

1. 高德地圖

駕車導航功能的用戶使用場景是“駕駛過程中”，針對這個場景，高德添加了語音導航、智能語音助手等易用的輔助交互方式。

界面顏色的對比度、文字大小的使用都需要考慮在 20cm 左右的閱讀距離和 1-2s 的閱讀時間內能夠看清重要的指引信息。放大按鈕、功能入口的點擊區域可以方便用戶在駕駛過程中進行點擊操作。并且保證在橫屏下更好的展示信息，對橫屏進行適配。

直屏下彈層展開高度不覆蓋重要的指引信息上，點擊“順路搜”出現預設選項，并可根據用戶搜索歷史和偏好智能推薦可能感興趣地點，形成快捷入口。圖標的設計考慮了用戶的視覺習慣，使用戶在短時間內可以快速識別并理解含義。這些都是在分析和模擬用戶的使用場景不停的優化和改進去更好的滿足用戶需求和期望。

2. 強光弱光的使用場景

在戶外強光下，文本樣式（大小、顏色、粗細）的設置是否仍然具有可讀性，文本顏色和背景顏色盡量使用高對比度的顏色組合，這些在執行的過程可以不停的模擬和調整，避免產品上線后發現問題再做改動。

文本顏色和背景顏色對比度可以參考「WCAG2.1(Web Content Accessibility Guidelines / 網頁內容無障礙指南」中的用色建議：

理論存在，實踐開始：

顏色對比度查詢網站推薦：https://gradients.app/zh/newlegibility

當用戶在晚上、弱光場景下長時間使用產品時，又或者需要閱讀長篇文章和觀看視頻時，增加暗黑模式可以讓用戶更加專注、沉浸在當前內容里（比如在電影院觀看電影的時候會將其它的燈光關閉，線上觀看視頻時使視頻畫面外部分變暗的功能）也很大程度的提高了用戶在弱光場景下使用產品的舒適度。

3. 當用戶首次使用功能、產品

需要考慮是否添加引導，幫助用戶快速的了解產品的主要功能和交互的操作方式等等。

4. 異常的處理場景

我們也需要考慮當用戶在使用產品的過程中，可能會發生在弱網情況下打開頁面、斷網、后臺數據拉取失敗、loading 時間過長等異常情況，針對這些異常情況需要提供對應的提示和引導。

五、When 時間節點

當需要我們開始評估設計時間的時候，需要綜合的考慮多個方面，可以確保在有限的時間里更好的完成工作。

1. 項目的整體時間限制

明確項目的開始時間和結束時間，以及一些關鍵的時間節點，比如開發開始寫頁面的時間、頁面可交付驗收時間等，并且根據這些時間節點來規劃設計工作的進度，確保設計的時間安排和項目整體計劃匹配。

2. 設計需求的復雜程度

評估頁面設計的數量、交互復雜性、視覺元素數量較多等因素來確定設計工作的復雜程度來合理安排時間，確保在規定時間內可以完成任務。

3. 協同工作與設計評審

為了保證設計更好的落地和提高合作效率，需要輸出設計規范（包括色彩規范、字體規范、交互說明等）和備注，可以幫助開發更好的理解設計，并在實現過程中遵循設計要求。安排設計評審會議，討論設計的可行性、可實現性和設計是否符合需求內容和用戶期望，然后根據反饋分析討論是否進行調整設計方案。

養成對工作內容和工作內容使用時間的記錄習慣，可以在新需求排期的時候利用歷史數據作為參考，根據過去的經驗來預測新需求的所需時間。并且對歷史數據進行復盤，總結經驗找出可以改進的地方來調整工作流程，有助于提高我們工作的效率。

六、How 如何驗證設計效果

為了確保設計內容準確實現，并且避免開發背著我們即興發揮，本人真實經歷：

在開發交付落地效果的時候進行：

1. 視覺走查

文本、顏色、間距等元素和設計圖是否貼合，在不同設備或者瀏覽器上的顯示效果是否一致等等。

2. 交互走查

頁面和功能的交互邏輯是否正確，按鈕組件等元素的交互效果是否符合設計預期，用戶體驗是否可以等等。

當發現開發未按照設計圖和設計規范進行開發，及時提出問題并跟進。經常也會在這時發現一些設計上存在問題或者不足，可以及時的改進，避免上線后問題暴露在線上。

很有可能開發在改其它問題的時候會引發新的 bug，所以在上線前需要進行最終的視覺和交互走查，確保所有頁面和功能都符合設計要求。

3. 數據分析

上線之后，可以進行新舊版的一些數據對比，跟蹤和分析用戶在使用產品時候的數據，比如用戶行為、頁面停留時間、點擊率、留存率、流失率等等。

尤其需要關注產品核心業務流程的轉化率，在每一個步驟，用戶都有可能離開，找出用戶可能離開的關鍵點去優化。比如在瀏覽商品時有 1000 人，到加入購物車有 500 人，再到最后完成支付只有 10 個人，那么從瀏覽商品到完成支付的轉化率就是 1%，通過這個數據結果可能意味著購物車設計、支付流程或者價格策略方面存在一些問題。

還有其它的一些 A/B 測試、用戶訪談等等都可以作為驗證和優化設計的有效手段。

歡迎關注作者微信公眾號：「檸檬設計筆記」