設計師適用的視覺向競品分析

2021-04-20

8013

本期來聊聊競品分析，我和身邊的小伙伴在遇到相關問題時，就經常打開競品，對比自己的產品交流討論。

比如某頁面布局方式，查看競品選擇了什么布局，使用感受如何，可以上手體驗一番；比如某功能圖標不好表達，也可以看看競品的圖標使用什么元素，表達的是否準確，能否有更好的發散……

大家是否也有這樣的經歷呢？

不論是剛接到需求或是中途出現疑問，體驗競品都是一個不錯的了解和驗證設計的方式。不僅可以發現和修正出現的問題，也能借鑒競品的優勢，為自己的設計帶來靈感。

不過平時我們更多的是針對性地看一些具體的問題，看完當即就用上，不需要特意做記錄。所以當面對一些需要整體體驗并完成競品分析報告的情景時（比如新產品的探索、產品中期的改版），總是不太好下手，且容易出現問題。

網上雖然資料多，但很多是從產品角度來展開，于設計的適配度不高，真正使用的時候不好落地。

從設計角度該如何完成一個相對完整且有效易懂的競品分析呢？

下文是我結合項目經驗以及相關資料整理的一些方法，因為產品在做改版最近做了不少相關工作，可能對設計師來說相對實用。

當然源于個人經驗所限，存在不足，也希望在這里與大家一起交流討論。針對容易出現的問題，可將競品分析的流程分為了3步：

1.明確目標，選擇競品

首先是明確目標和選擇相應的競品，若沒有明確目標則容易在體驗中迷失。

目標可以是具體的、針對某功能的，比如：“優化當前繪本閱讀體驗，提高閱讀舒適度”；也可以是整體的，比如“分析兒童產品的視覺風格特點”。

明確的目標能保持方向的正確，讓分析更有針對性。然后根據制定的目標選擇相應的競品，一般分為：直接競品、間接競品、相關競品等。

以兒童繪本產品為例：

直接競品– 直接競爭關系的產品，比如其他兒童繪本產品。

間接競品– 使用場景和用戶群體比較接近的產品，比如其它兒童學習類產品。

相關競品– 部分交互、流程有關聯，能從中獲得啟發的產品，比如受兒童喜愛的產品，好用的閱讀產品等。

根據目標與項目時長，選擇2-5個競品進行分析。選擇時可與產品的同學交流，聽取他們的意見，幫助我們選出合適的競品。

2.信息收集，建立競品檔案

確定目標選出競品后，接下來就是信息的收集，可分為視覺與非視覺部分。

· 視覺部分-頁面截圖包

視覺部分主要是體驗過程中的頁面截屏、動效的錄屏等，收集產品頁面資料。

不同競品分文件夾整理，過程中可以為一些沒有標題、不方便識別的頁面截圖命名標注，減少混亂，以方便下一步的分析使用，這些通常由設計師完成。

· 非視覺部分-其他信息資料包

非視覺部分則包括產品的基本信息、市場定位、功能的思維導圖、流程圖、用戶反饋、App Store用戶評價、評分等。這部分不與視覺直接相關，有時候由交互或產品的同學完成。

用戶體驗的5要素——戰略層、范圍層、結構層、框架層、視覺層，雖然視覺向的競品分析，主要關注的是視覺層，但其他的4個要素往往影響和決定著最后的視覺呈現，是后續分析過程中需要的資料，能夠幫助我們更全面地了解競品，所以可以咨詢相關同學一起收集整合。將上述信息收集完成后，分別命名保存留底。

· 競品概括卡片

我的習慣是在完成信息收集后，為每個競品建立一個概況卡片，比起資料包，概括卡片更適合記錄至wiki等辦公文檔，也能讓自己更熟悉競品，后續對比分析中更方便使用。在同步項目時，也能讓相關同事快速瀏覽和掌握概括，若需要匯報也可以用于匯報展示~

卡片內容大體分為基本信息、頁面概覽、風格總結、設計亮點及細節記錄，可根據每次目標不同，進行調整。

基本信息：名稱、版本等
頁面概覽：代表頁面的貼圖，給觀者直觀的視覺感受
風格總結：對風格的簡單概述（如扁平、微漸變色彩、彌散投影等）
設計亮點：記錄使用過程中發現的新穎、可供參考的設計亮點（沒有則不記）
細節記錄：色彩、字體、字號、圓角、邊距等（可根據設計目標的不同進行增減）