2019-8-20 ui設計分享達人
1.競品分析的定義
從專業的角度來講，競品分析是通過系統的分析方法去全面了解市場上位于前列的競爭對手的產品，能夠讓設計師快速了解自家產品所處的位置，從而來針對性的改進自身產品的一個方法。簡而言之，就是要站在巨人的肩膀上去思考，以競品分析的形式去學習其他優秀的產品，從而解決自身產品所存在的問題。
2.為什么要去做競品分析
做一件事情之前一定要思考做這件事的價值和意義，只有你明白其重要和必要性，你才會知道該怎樣去做這件事情，而不是一提起競品分析就找一大堆專業框架和術語然后去填內容，這樣雖然產出了很多，但是關鍵性的內容點其實還是不清楚。
說直白點，你需要通過這篇競品分析去解決你工作或者創作中遇到的什么問題，帶著疑惑和目的去分析在我看來是更有效率的。因此特分為以下幾種情況：
因此我們要學會根據自己的不同需求，去制定不同的競品分析方案，讓分析的內容更聚焦。作為UI設計師來講，通過競品分析為自己的設計方案提供科學的理論依據，為自己贏得話語權，能夠更好地科學產出內容。
3. 如何尋找競品：
競品的選擇非常重要，如果找到錯誤的競品，那么你所分析的一切結論可能都引向了一個錯誤的方向。從而讓自己的努力都白費。那么怎樣才能找到合適的競品呢？分為以下三類情況
A.核心服務與目標用戶相同的產品（直接競品）：
這一點是廣大設計師都能想到的范疇，也稱為直接競品。即提供的核心服務、市場目標方向、客戶群體等與我們的產品基本一致，產品功能和用戶需求相似度極高的產品 。往往是通過業務關鍵詞就能直接搜索到的競品，比如音樂類產品，那么直接在應用商店，或者通過專業網站（易觀千帆等）搜索關鍵詞“音樂”即可搜索出排行前列的競品。
B.目標人群不同，但功能模塊和服務接近的產品（間接競品）：
這類競品可以找起來并不那么直接，可以通過對應功能去逆推擁有此功能的產品，并進行相關搜索。
如果想不到，可以通過“人人都是產品經理” “36氪“等關于產品資訊的網站進行查詢，甚至可以通過百度指數來進行發散思維，看一下跟你關鍵功能相接近的都有哪些。比如你研究外賣產品，除去餓了么和美團等直接競品，你還可以在分析用戶下單和購買流程中，去分析淘寶和京東等購物產品，也能得到一定的幫助。
C.目標人群和服務都不同，但交互或者視覺有可以參考的產品（關聯競品）：
這里所選擇的產品，定位和領域可以都完全不同，但是你要從這款產品中得到啟發，從而讓你的產品能夠擁有其他競品不同的特點或者功能模塊。有一個很典型也熟知的的案例，就是衛龍辣條的設計案例，在衛龍推出之前，可以說是沒人會想到辣條會和高端扯上關系，但是衛龍就是借鑒與其領域完全不同的蘋果設計去做，從而在包裝上獨樹一幟，從而吸引人們注意取得成功。因此通過不同領域跨行業的產品有時候也可以找到不錯的思維方向。
4.如何進行商業分析：
進行商業分析，這里只提及到三個基本選項：商業背景、產品盈利模式以及用戶人群。通過這三個基本要素，你能對所研究的競品有一個大概的了解。當然深入了解還需要其他平臺（官網網站、36Kr等)來查閱更多的相關性資料，下列是對QQ音樂商業背景的簡要分析。
5. 如何進行交互分析：
我們在做交互分析時，我們需要進行必要的兩點分析：用戶路徑和交互維度。
用戶路徑：指用戶從某個開始行為事件直到結束事件的行為路徑，即用戶在使用某個功能的完整流程稱之為用戶路徑。我們需要去觀察和體驗在這一個完整路徑中涉及到的頁面、動效、視覺到底是怎樣的。就拿登錄頁來說，我們看看排行前列的競品是怎么做的。通過相應的體驗和對比分析，我們就可以找出這其中符合我們產品性質的最優解，從而提高我們的登錄注冊效率。
交互維度：交互維度和用戶路徑有所區別。這一層需要弄清楚產品的核心路徑，從而能夠更好的解析產品各個層面的邏輯關系，這就需要我們以用戶的角度去逐個體驗，整體聯系，隨后記錄下來。使用過程中我們也要去觀察APP中的交互小細節，怎樣分享的，怎樣展示的，比如音樂軟件進行截屏后和點擊喜歡按鈕后的反饋是怎樣的。
6. 如何進行視覺設計：
在進行視覺分析時，有一點需要注意，如果你需要詳細分析某一模塊，請用手機尺寸截圖后拿到設計軟件中進行測量，不要光靠眼睛觀察，很多時候的小細節我們只有在手動測量后才能感受到，比如控件的尺寸大小，間距的大小，以及顏色的取值，都需要精準測量后才能得出靠譜的結論。
怎樣進行視覺分析呢，我比較推薦從一個app 視覺語言最基本的五個維度去分析，即“形色字構質”
最近以音樂APP進行了一次競品分析，以QQ音樂APP來舉例進行分析（當然競品分析并不能只分析一個，而應該根據你需要的功能找多個競品進行對比分析，才能看到更多的維度，這里只拿一個舉例）：
6.1 圖形元素的分析
首先我們以形進行分析，形即圖形元素，具體來講即LOGO和圖標。LOGO的更新在2018年10月以后已完成更新。新版的主要圖標整理歸納如下：
可以看到整體的圖標色調更加清新，造型設計更加圓潤，未選中狀態的線形圖標則采用4px的描邊，粗線形描邊讓整體界面風格顯得更加穩重的同時對用戶的干擾也較小。新版的圖標界面讓界面保持穩重的同時又富有活力。
6.2 色彩體系的分析
其次則是對色這一類別進行分析，顏色其實是對于品牌調性有很大的影響，比如一想起QQ音樂就知道主色是綠，一想起網易云音樂就知道主色是紅，對用戶的記憶點更深刻。通過截屏測量進行分析，得出整體的顏色如下（由于手機屏幕的色差原因，不可避免會有些許誤差）
從局部來看，分析顏色最重要的一點就是能夠弄清楚一個頁面中哪些元素用的是同一種顏色，觀察成熟的產品是怎樣用顏色（和字重）去區分層級關系的。
可以看到，用主色和三種輔色即可區分界面的整個層級關系，由此思考我們在制作自己的界面時也避免用太多的顏色，造成界面太過花哨。（顏色的具體色值可能有些許誤差，更重要的是看顏色層級關系）
6.3 字體體系的分析
接下來是字的分析，字即字體體系，可具體到字體和字號。設計中字體一般來講是蘋方，字號則根據設計師的定義來進行相應的規范。通過頁面的測量分析，可以拿到其具體的字號大小層級分析。（以下定義基于750的設計尺寸）
對于單個界面的分析，個人覺得要帶有思考的眼光去看待，比如在首頁中字號其實分配過多，像“更多”這種按鈕就不應該再分一個字號，字號太多整體就顯得有一點點亂了。雖然大廠的設計能在一定程度上給予我們參考，但并不是說他的每一個設計都是正確的，我們要學會用審視的眼光去看待出現在身邊的設計。
6.4 界面構成分析
界面構成即界面的元素大小以及他們的布局，例如有時候我們不知道一個標準的搜索框的長寬具體多少才是合適的，這就需要我們去分析其他成熟的商業產品，通過測量來知道具體的數值，從而督促自己進行正確的設計。這里選取了一個默認的首頁進行分析。
將一個頁面用右邊的形式進行原型化，去掉干擾可以把結構看得更清楚。間距之類的也可以通過軟件進行測量。可以看到QQ9.0版本的去線化設計，利用大間距來區分各個模塊，去掉了其他的干擾元素，整體的界面模塊看起來非常整潔輕盈以及富有呼吸感。統一的圓角化設計也讓整體設計符合流行趨勢，顯得更活潑。
6.5 質感與風格分析
關于界面的質感則是不同于扁平化的一個設計，即有的頁面在你看來細節會更豐富，層級會更深。界面質感通過漸變，疊加，透明度等不同方式來呈現，比如在QQ音樂中的會員界面卡片，則體現了微質感：
上方的會員卡片就加入了漸變和圖案疊加的方式來為卡片增加質感，讓整個界面顯得更精致。當然，疊加的圖案都是與內容相關的，不能為了疊加而疊加。包括下方的權益圖標，也采用了漸變的方式來讓整個圖標顯得更精致和有質感。我們再處理質感的時候也可以用這種方式來進行。
以上通過“形色字構質”來分析是屬于單個分析，相當于去拆解一個成熟產品中的每一個細節點，從而去學習和吸收。我們還要學會進行對比分析。把單獨某一個功能模塊拎出來，通過不同類型的對比從而歸納出這一類的設計方法和樣式，進而總結相應規律。
比如某一天你需要設計一個歌單列表，你此時就需要分析所有TOP排行的歌單列表，看看分別都有什么，從而總結歸納出結構來，再進行分類。
通過分析提煉，形成以下結論并進行相應的概念風格展示設計：
這樣，我們最后制作出來的方案才能涵蓋比較全的解決方案，從而能夠更好的助力設計產出。上圖的產出可能稍顯簡陋，但只是做一個簡單的示例，真正的產出應該更加有細節和落地，也要結合自己的工作需求做相應調整。
7.關注競品的版本迭代和用戶評價：
關注版本更迭，閱讀競品版本更新的詳細說明，你可以從中得出版解決了什么問題，提升了哪些體驗，添加了哪些功能，融合了什么流行的設計趨勢。產品迭代就是團隊通過用戶需求對某個產品不斷完善的一個過程。迭代對于一個產品來說是至關重要的，一個產品如果不想被對手超越，就必須不斷的對版本進行更新迭代。
除了關注具體的內容，你還可以觀察版本更新的提示信息，例如夸克瀏覽器在每次更新時總會用富有趣味的文案來打動你，從而讓你更加情愿去更新，提升新版的使用率。
用戶評價則更不用說，產品的最終服務對象就是用戶，用戶評價的重要性自然不言而言。不過我們要客觀辯證地去看待用戶的評價，吸收好的建議，屏蔽無腦的意見，從而能夠正確地迭代版本。用戶評價的查看可以使用App Store或者用戶評價網站（https://appbot.co/）去查詢。
總結
以上的篇幅較長，看下來可能會有一些累，那么此篇文章提及到的點在這里回顧一次：
1.競品分析的定義-站在巨人的肩膀上去學習；
2.為什么做-基于自己的目的去進行對應的競品分析，分析的最終目的是解決自己在設計過程中遇到的問題；
3.競品分析分為三個層面：視覺分析、交互分析以及商業分析；
4.怎樣進行商業分析（商業背景、盈利模式、用戶人群）；
5.怎樣進行交互分析 （用戶路徑、核心路徑、交互細節）；
6.怎樣進行視覺分析 （從“形色字構質”五個維度去分析以及如何對比分析應用）；
7.競品的迭代和用戶評價的重要性。
自己有一個小習慣，看完每一篇文章，總會告訴自己一定要在腦海里回顧一遍，思考一下這一篇文章到底有什么觀點是自己之前沒有想到的，哪怕只有一點是沒觸及到的知識盲區，那么這篇文章之于自己就是有意義的。所以希望大家看完能有些許收獲那便是最好的了。
寫這篇文章的目的是給自己的競品練習做一個總結，以輸出倒逼輸入是一種比較有效的學習方法。但基于自己的水平有限，在某些分析的地方仍然存在不足和疏漏之處，希望大家諒解并及時交流。感謝大家看到這里，希望大家每天都進步～
轉自：站酷-進擊的M
藍藍設計( m.paul-jarrel.com )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務。