視覺競品分析作為設(shè)計師重要的基礎(chǔ)技能之一，能讓設(shè)計師了解自身產(chǎn)品在同競爭對手中所處的位置，一方面是取長補短，明確自己的短板；另一方面是通過分析達到相應(yīng)的設(shè)計目的。今天這篇好文從5個緯度出發(fā)，幫你做出一份合格的視覺競品分析。

這篇提供了不少視覺競品分析的技巧：《魅族干貨！如何從視覺設(shè)計師的角度做競品分析？》

歡迎關(guān)注點融設(shè)計中心DDC微信公眾號（微信ID：DR_DDC）

為什么要做競品分析？

在產(chǎn)品公司我們大部分時間用來和產(chǎn)品經(jīng)理溝通需求，來做設(shè)計實現(xiàn)，與開發(fā)對接。而在視覺設(shè)計上往往大部分時候都在follow之前的設(shè)計。當團隊缺少視覺設(shè)計思考和理論沉淀、不明確與其他競爭對手的差別的時候，競品分析是團隊成員積累方法論、輸出設(shè)計觀點的有效工具之一。

△ 篩選競品

競品分析的作用是什么？

視覺競品分析作為設(shè)計師重要的基礎(chǔ)技能之一，讓設(shè)計師了解自身產(chǎn)品在同競爭對手中所處的位置，一方面是取長補短，明確自己的短板；另一方面是通過分析達到相應(yīng)的設(shè)計目的。而做分析的目的往往有很多，先想想這個分析價值是什么，再來想想聽眾是誰，你和聽眾的關(guān)系是什么？透過這個分析，你和你的團隊要得到的是一致的共識呢？一個有用的總結(jié)？還是驗證？或是啟發(fā)設(shè)計的點？

△ 了解自身產(chǎn)品現(xiàn)狀及分析目的

撰寫的時候需要注意點什么？

跳出“視覺”來做分析

作為產(chǎn)品設(shè)計的最后一個環(huán)節(jié)，如果我們只盯著界面美觀與否來做分析，我們很難得出有說服力的結(jié)果。無法得出競品為什么這樣設(shè)計的？這樣設(shè)計解決什么問題？無法用理性的思維來衡量自身產(chǎn)品與競品之間的差距在哪。視覺設(shè)計是產(chǎn)品與交互的最終呈現(xiàn)，而脫離產(chǎn)品和交互來談視覺是沒有意義的。

輸出觀點而非“介紹”

在做競品分析之前，我們要清楚其目的是什么。通常來說競品分析是為了給我們產(chǎn)品的迭代帶來一點新的思路。要避免乏味的陳述和介紹，競品分析貴在分析。

設(shè)定衡量緯度而非憑喜好

在做競品分析的時候最忌諱的就是憑個人喜好來評判設(shè)計：“我覺得這個挺好看的…那個不好看”。這些話語不應(yīng)該出現(xiàn)在一個專業(yè)設(shè)計師的嘴中。視覺設(shè)計一部分是感性的，但我們需要用理性的思維來看待分析這件事情。

可以通過哪些緯度來做分析？

△ 視覺風(fēng)格情感定位

1. 品牌個性&傳播途徑?

氣質(zhì)：產(chǎn)品的“氣質(zhì)”與產(chǎn)品定位息息相關(guān)，它們之間可以說有著直接必然的聯(lián)系。我們可以用“情感定位”來理解氣質(zhì)，例如：嚴肅商務(wù)，年輕運動等。

布局：結(jié)合信息本身的層級及視覺傳達的原則，對界面元素的分布進行重組并形成規(guī)則。

顏色定義：拆分出由品牌元素中的顏色來對界面中的信息進行功能性的顏色定義或者劃分。例如：在設(shè)計手機Launcher icon 前期定義的時候，我們會從功能性以及用戶情感等角度對不同的icon顏色進行劃分。

icon：根據(jù)品牌元素對icon從形狀、顏色、材質(zhì)、角度進行設(shè)計解剖，分析其一致性與設(shè)計風(fēng)格。

動效：動態(tài)設(shè)計就像一個人的肢體語言，少了顯得這個人很死板，多了則像神經(jīng)病。而如何恰到好處的拿捏產(chǎn)品中什么地方需要設(shè)計動效、怎么設(shè)計動效。這需要對產(chǎn)品前期的概念故事有這深入理解以及理性的對控件及界面從用戶的角度進行感性的劃分，例如：需要讓用戶等待的、需要讓用戶快速通過的、需要讓用戶感覺享受的…等等。合理的規(guī)則劃分常產(chǎn)品的“節(jié)奏感”更好。

傳播途徑：我們知道如今對品牌的傳達不僅限于一個企業(yè)的logo、vi。它體現(xiàn)在方方面面，比如音效設(shè)計、吉祥物設(shè)計、一個產(chǎn)品的開屏、一句sologan等等。

2. 信息結(jié)構(gòu)合理性?

在工作中很多人認為視覺設(shè)計是把灰白的wireframe弄的好看一點而已，這才會出現(xiàn)很多情況例如：“某某某主管評價一個視覺界面的時候說：’我覺得這個界面太素了…要不加點顏色豐富一下’ 然后設(shè)計師灰溜溜的拼湊了一堆形式感的元素在界面中為滿足老板的需求”。視覺設(shè)計的本質(zhì)是“信息重組”，同時又要兼顧功能性。這些不僅僅是視覺本身的問題，和交互和產(chǎn)品和文案有這直接的必然的聯(lián)系。所以我們必須摒棄形式優(yōu)先的思維，從整個產(chǎn)品的角度、從用戶的角度思考。

我覺得一個界面設(shè)計衡量的標準是 : 功能 > 信息 > 形式,這里面的關(guān)系并非互斥，也就是好看的界面不一定就是難用的，好用的界面也不一定就是丑的。產(chǎn)品的平衡，設(shè)計更是平衡。

3. 視覺語言的一致性

一方面是看單個競品視覺語言的貫穿性，另一方面是看競品多平臺產(chǎn)品之間的設(shè)計的聯(lián)系性。

4. 設(shè)計亮點

任何產(chǎn)品為了在市場中脫穎而出，或多或少會在產(chǎn)品及設(shè)計中做些差異化的東西。這里的差異化是以用戶場景為導(dǎo)向的，而非形式上的差異。例如：音樂app中為了讓用戶有更沉浸享受的體驗而設(shè)計動態(tài)的唱片封面及無邊框全屏模式等。

5. 設(shè)計趨勢

設(shè)計趨勢不局限于視覺風(fēng)格趨勢，產(chǎn)品定位有時候會決定設(shè)計的風(fēng)格。而個人理解風(fēng)格沒有“過時”這一說，只有合適不合適。而當一個競品定位模糊的時候，我們可以試著用“趨勢”來衡量它，但這是個附加項。

這些評判緯度其實都是靈活的，我們需要的是根據(jù)產(chǎn)品類型的不同設(shè)定不同的緯度。例如: 一個基于iOS默認控件設(shè)計的app，是否符合平臺規(guī)范的標準就可以加入評判緯度之中。而不同邏輯的設(shè)計師可以重新梳理一份競品分析的結(jié)構(gòu)。上述所例的評判緯度也可以加上評分機制，來讓觀看者更加直觀的了解這份分析所輸出的觀點。甚至可以通過講故事的方式去把你的觀點用很有意思的方式表達給他人。而確定分析形式之前，我們再一次來想想這個分析的目的與價值是什么，再來想想聽眾是誰，你和聽眾的關(guān)系是什么？透過這個分析，你和你的團隊要得到的是一致的共識呢？一個有用的總結(jié)？還是驗證？或是啟發(fā)設(shè)計的點？我們要通過這些思考和內(nèi)部溝通來避免“套用模板”的做法，從而培養(yǎng)設(shè)計師獨立分析及思考設(shè)計的能力。

△ 如果采用權(quán)重評分機制，可參考的模板

總結(jié)

過去的一段時間，圈子內(nèi)某總監(jiān)的新聞風(fēng)風(fēng)火火。其實我個人關(guān)注的不是當事人的專業(yè)水平如何，而是通過這個事件把一些大公司“一切以BOSS喜好說了算”的工作方式揭露了出來。而且我相信這不是個例。當一個設(shè)計團隊不講求設(shè)計理由、沒有方法論沉淀時候。設(shè)計自然沒有話語權(quán)，設(shè)計師們關(guān)注的肯定都是專業(yè)以外的事情，而做好一份競品分析、輸出優(yōu)秀的設(shè)計觀點，可能是衡量一個團隊專業(yè)與否的第一步。

歡迎關(guān)注點融設(shè)計中心DDC微信公眾號（微信ID：DR_DDC）：

「本月最值得閱讀收藏的完美像素使用手冊」

1. 《值得每個設(shè)計師收藏的《完美像素使用手冊》之原理篇》
2. 《中文版來了！值得每個設(shè)計師收藏的《完美像素使用手冊》之細節(jié)篇》
3. 《第三集！值得每個設(shè)計師收藏的《完美像素使用手冊》之易用性篇》
4. 《第四集！值得每個設(shè)計師收藏的《完美像素使用手冊》之軟件技巧篇》
5. 《最終版！值得每個設(shè)計師收藏的《完美像素使用手冊》之軟件技巧篇》

【優(yōu)設(shè)網(wǎng) 原創(chuàng)文章 投稿郵箱：yuan@uisdc.com】

================關(guān)于優(yōu)設(shè)網(wǎng)================
"優(yōu)設(shè)網(wǎng)uisdc.com"是國內(nèi)人氣最高的網(wǎng)頁設(shè)計師學(xué)習(xí)平臺，專注分享網(wǎng)頁設(shè)計、無線端設(shè)計以及PS教程。
【特色推薦】
設(shè)計師需要讀的100本書：史上最全的設(shè)計師圖書導(dǎo)航：http://hao.uisdc.com/book/。
設(shè)計微博：擁有粉絲量160萬的人氣微博@優(yōu)秀網(wǎng)頁設(shè)計 ，歡迎關(guān)注獲取網(wǎng)頁設(shè)計資源、下載頂尖設(shè)計素材。
設(shè)計導(dǎo)航：全球頂尖設(shè)計網(wǎng)站推薦，設(shè)計師必備導(dǎo)航：http://hao.uisdc.com