如何找到改版的切入點(diǎn)？我用「品牌探索」這個(gè)方法！

@菜心設(shè)計(jì)鋪 ：前幾天做了《暴風(fēng)影音 App 重設(shè)計(jì)》，不過(guò)還沒(méi)做完，所以今天主要講講我尋找改版切入點(diǎn)的方法——品牌探索。

到底品牌探索能給我們帶來(lái)什么？真的能指導(dǎo)我們做設(shè)計(jì)嗎？看完這篇文章估計(jì)你就能略懂一二了。

先來(lái)看下我尋找改版切入點(diǎn)的大綱吧：

• 體驗(yàn)產(chǎn)品和競(jìng)品來(lái)發(fā)現(xiàn)問(wèn)題
• 品牌探索尋找切入點(diǎn)
• 結(jié)合切入點(diǎn)進(jìn)行優(yōu)化
• 突破自己做點(diǎn)不一樣的

1. 體驗(yàn)產(chǎn)品和競(jìng)品來(lái)發(fā)現(xiàn)問(wèn)題

做改版一定是基于某些問(wèn)題的，而發(fā)現(xiàn)問(wèn)題的方式有很多種，例如用戶(hù)反饋數(shù)據(jù)，產(chǎn)品的發(fā)展戰(zhàn)略、競(jìng)品分析、流行趨勢(shì)等等。

我這里用到的方法就是通過(guò)體驗(yàn)產(chǎn)品和競(jìng)品來(lái)發(fā)現(xiàn)問(wèn)題，今天拿圖標(biāo)來(lái)舉例。

上圖是暴風(fēng)影音 APP 原版圖標(biāo)，問(wèn)題如下：

• 圖標(biāo)無(wú)明顯性格，同質(zhì)化嚴(yán)重，沒(méi)有體現(xiàn)暴風(fēng)影音的情感訴求。
• 直角、圓角不統(tǒng)一。
• 圖標(biāo)的漸變?nèi)岷隙炔粔蜃匀弧?/li>

以上就是我發(fā)現(xiàn)的關(guān)于圖標(biāo)部分的問(wèn)題。

2. 品牌探索尋找切入點(diǎn)

有些人可能會(huì)疑惑，到底品牌探索是做什么啊？其實(shí)就是看看企業(yè)的歷史、理念、產(chǎn)品、官網(wǎng)、最近的動(dòng)態(tài)，只要你用心去尋找，一定能發(fā)現(xiàn)一些指導(dǎo)你設(shè)計(jì)方向的內(nèi)容。

比如，我在搜索資料的時(shí)候就發(fā)現(xiàn)，2017年，暴風(fēng)集團(tuán)的 logo 改版了：

從 logo 的改版上，我發(fā)現(xiàn)了幾個(gè)小細(xì)節(jié)：

• 簡(jiǎn)約，logo 去掉了部分細(xì)節(jié)，使其更加簡(jiǎn)約。
• 尖角，某些圓角變成尖角，雖然不是純尖角，但整體看起來(lái)感覺(jué)更加方正、干練。

官方文章的說(shuō)法是使 logo 更有科技感，時(shí)尚感。

原來(lái)的圖標(biāo)沒(méi)有調(diào)性，而企業(yè) logo 的改版已經(jīng)給了我們明確的調(diào)性和方向，我們可以順著方向提取一些關(guān)鍵詞：

這不就是很好的切入點(diǎn)嘛。

3. 結(jié)合切入點(diǎn)進(jìn)行優(yōu)化

結(jié)合上面提煉的幾個(gè)關(guān)鍵詞和原版圖標(biāo)的問(wèn)題，把之前的圖標(biāo)變得方正（科技）、簡(jiǎn)約（時(shí)尚）、漸變?nèi)岷停ㄟ@是基本要求）一些。

改版前：

改版后：

這里只能給大家提供一個(gè)思路方法，至于執(zhí)行力，并不是看幾篇文章就能解決的，只能靠我們自己多多練習(xí)了。

4. 突破自己做點(diǎn)不一樣的

做到這里，雖然圖標(biāo)有些調(diào)性了，但還不夠特別，這里就是難點(diǎn)了，突破自己的關(guān)鍵也在這里。如何能做出點(diǎn)不一樣的感覺(jué)呢？這時(shí)候我們還是要從品牌出發(fā)，繼續(xù)探索。我發(fā)現(xiàn)企業(yè)的 VI 系統(tǒng)中有這樣一個(gè)輔助圖形：

于是我提取出關(guān)鍵詞——直線。

可是怎么能融入到圖標(biāo)設(shè)計(jì)當(dāng)中呢？經(jīng)過(guò)多次嘗試后，最后以角度漸變的這種方式來(lái)融入剛剛提取的「直線」概念。

最終效果如下：

最后

尋找改版切入點(diǎn)的方式有很多種，這里僅僅只是介紹了一種，希望能對(duì)大家的思路有所啟發(fā)。

記住，剛才提取的方向、元素、性格都是可以貫穿整個(gè)改版設(shè)計(jì)的。例如那個(gè) VI 的輔助圖形，是不是就可以用到標(biāo)簽按鈕的背景上，增加一些獨(dú)特性，而這些獨(dú)特性都是根據(jù)品牌而來(lái)，不是憑空捏造，如下圖：

還有提取矩形的元素是不是可以貫穿整個(gè) app 設(shè)計(jì)，例如上圖和下圖，你都可以看到矩形的元素。

可以用到的地方還有很多，后面等我把其他界面優(yōu)化完，繼續(xù)和大家分享。

歡迎關(guān)注作者的微信公眾號(hào)：「菜心設(shè)計(jì)鋪」

「用品牌基因法做設(shè)計(jì)」

• 《用品牌基因法，三步幫你搞定圖標(biāo)設(shè)計(jì)！》
• 《用品牌基因法做圖標(biāo)設(shè)計(jì)，這是高級(jí)UI設(shè)計(jì)師才會(huì)的手法！》
• 《用品牌基因法做圖標(biāo)設(shè)計(jì)，高級(jí)UI設(shè)計(jì)師才會(huì)的手法！（升級(jí)篇）》
• 《用品牌基因法做圖標(biāo)設(shè)計(jì)，高級(jí)UI設(shè)計(jì)師才會(huì)的手法！（實(shí)戰(zhàn)篇）》
• 《網(wǎng)易資深設(shè)計(jì)師：視覺(jué)設(shè)計(jì)如何繼承品牌基因？》

================明星欄目推薦================

優(yōu)優(yōu)教程網(wǎng)： UiiiUiii.com 是優(yōu)設(shè)旗下優(yōu)質(zhì)中文教程網(wǎng)站，分享了大量PS、AE、AI、C4D等中文教程，為零基礎(chǔ)設(shè)計(jì)愛(ài)好者也準(zhǔn)備了貼心的知識(shí)樹(shù)專(zhuān)欄。開(kāi)啟免費(fèi)自學(xué)新篇章，按照我們的專(zhuān)欄一步步學(xué)習(xí)，一定可以迅速上手并制作出酷炫的視覺(jué)效果。

設(shè)計(jì)導(dǎo)航：國(guó)內(nèi)人氣最高的設(shè)計(jì)網(wǎng)址導(dǎo)航，設(shè)計(jì)師必備： http://hao.uisdc.com