總監(jiān)級的思考!視覺設(shè)計該如何賦予產(chǎn)品個性?
最近經(jīng)常被問到“設(shè)計如何賦予產(chǎn)品性格”,“如何通過分析確定哪種視覺風(fēng)格更合適”等問題。遇到這些問題我很高興,因為這說明越來越多的人開始重視更高層次的設(shè)計問題,而不是局限于設(shè)計技巧、審美等表層問題。
恰巧過去的半年,我也在研究品牌設(shè)計相關(guān)的方法。一是因為發(fā)現(xiàn)行業(yè)對品牌設(shè)計的研究有了長足的進(jìn)展,但設(shè)計結(jié)果卻沒有太大的改善(行業(yè)內(nèi)有個怪象: 會使用方法論的設(shè)計師作品質(zhì)量不見得好;設(shè)計質(zhì)量好的又不見得會正確使用方法論。很多設(shè)計師因此排斥方法論);二是因為我們在做的是B端的產(chǎn)品,這方面的 設(shè)計研究基本上是空白。
從流行的設(shè)計風(fēng)格到符合產(chǎn)品定位的設(shè)計風(fēng)格,再到充滿品牌個性的設(shè)計風(fēng)格,我和設(shè)計師在這中間經(jīng)歷了很多挫折。索性我們一直沒有放棄,期間不斷探索試錯、沉淀方法,歷經(jīng)將近一年時間最后終于找到了答案(在傳統(tǒng)方法上的突破和創(chuàng)新)。
在這里把總結(jié)的經(jīng)驗分享給大家,希望更多的設(shè)計師可以通過它塑造出符合產(chǎn)品定位且充滿品牌個性的設(shè)計,為企業(yè)的品牌建設(shè)添磚加瓦。
△ 品牌設(shè)計推導(dǎo)過程
目前來看,即使是在BAT這樣的公司,有“個性”、“出彩”的設(shè)計也并不多見。問題出在哪里,對照上圖,我認(rèn)為“投石問路”、“個性關(guān)鍵詞提煉”、“設(shè)計主題設(shè)定”是關(guān)鍵,而這幾點是目前行業(yè)欠缺的。
一、制作競品圖譜
這個過程有點類似競品分析,尋找同行業(yè)(產(chǎn)品經(jīng)理推薦、網(wǎng)上查找)產(chǎn)品,從中挑選設(shè)計質(zhì)量較好的,把頁面存成圖片,把logo分類整理等。在這個過程中我們自己也會對網(wǎng)站進(jìn)行一些分析。
二、探訪品牌感覺
做到“知彼”還不夠,還要“知己”。很多設(shè)計師都有這樣的煩惱,辛辛苦苦做出來的設(shè)計稿,在領(lǐng)導(dǎo)眼里卻是各種問題,甚至要推翻重來。除了視覺表現(xiàn)能力外,大部分的情況是因為對產(chǎn)品的理解和認(rèn)知與他人不一致造成的。怎樣既能充分了解對方高屋建瓴的產(chǎn)品理念,又能避免被對方不專業(yè)的設(shè)計意見牽著走呢?這里我們使用一種“預(yù)訪談”的方式(我們給這種方法起了個名字叫“投石問路”)。
召集產(chǎn)品owner、產(chǎn)品leader等重要角色,拿出之前準(zhǔn)備好的競品圖譜,詢問五個問題:
- 您覺得目前的網(wǎng)站界面有哪些問題?期望本次改版達(dá)到什么效果?(從0到1的產(chǎn)品可跳過這個問題);
- 請整體評價競品logo/界面,有沒有哪些點符合咱們產(chǎn)品的氣質(zhì)?
- 您認(rèn)為咱們的產(chǎn)品應(yīng)該體現(xiàn)出什么感覺/氣質(zhì)?
- 如果把咱們的產(chǎn)品比作一個人,他應(yīng)該是什么樣的人?
- 哪些logo/網(wǎng)站整體最貼近咱們產(chǎn)品的感覺,為什么?
△ “投石問路”法
這樣既能深刻理解產(chǎn)品定位、氣質(zhì),又能了解到使用什么設(shè)計形式最貼近這種氣質(zhì),還能知曉最終的設(shè)計拍板者對各種設(shè)計形式的看法,避免設(shè)計師做很多無用功,同時還能在正確的方向上充分發(fā)揮?!巴妒瘑柭贰钡姆椒ㄔ谖覀兊脑O(shè)計過程中起到了至關(guān)重要的作用。
三、“個性”關(guān)鍵詞提煉
目前我們已經(jīng)做到”知己知彼“,相當(dāng)于掌握了豐富、正確的原料,接下來就要進(jìn)行加工創(chuàng)作了。
關(guān)鍵詞提煉的方法相信大家都不會陌生,我們之前也使用了這種方法,但是效果并不理想。因為我們最后設(shè)計出了“正確”但不“出彩”、缺乏“個性”的產(chǎn) 品。以前我們做過一個保健品類的項目,通過情緒板的方法提煉出了關(guān)鍵詞”自然、健康、可靠“,最后設(shè)計出了毫無驚喜感的界面,還被人質(zhì)疑抄襲了一個三流健 康類網(wǎng)站(確實很相像,我們看完都驚呆了)。設(shè)計師也對這種方法頗有微詞,認(rèn)為效果不好(不用情緒板的方法也能想到這些詞,也知道該用綠色)還在一定程度 上限制了發(fā)揮。
問題出在哪里呢?是對設(shè)計的認(rèn)知出現(xiàn)了問題:設(shè)計不僅包含對產(chǎn)品理性客觀的理解,對產(chǎn)品感性主觀的認(rèn)知,更要有對產(chǎn)品個性塑造的升華。而之前錯就錯 在僅通過理性或感性的方式來推導(dǎo)關(guān)鍵詞,卻缺少了重要的藝術(shù)加工的過程,結(jié)果自然就不會有驚喜。我們都知道藝術(shù)創(chuàng)作是”源于生活,高于生活“,品牌設(shè)計也 是一樣,它源于對產(chǎn)品的理解,同時又高于這種理解。如果我們只是按照普通的方式去提煉關(guān)鍵詞,勢必得到普通的設(shè)計。類似”潮、簡單、科技、溫馨、可靠”等 關(guān)鍵詞,是不是可以套用在無數(shù)產(chǎn)品上?那據(jù)此而設(shè)計的界面又怎么賦予產(chǎn)品獨特的個性呢?那看似無懈可擊的推導(dǎo),最后卻又產(chǎn)出平庸的設(shè)計也就不足為奇了。
△ 品牌設(shè)計模型
順著這個思路,我們再提煉關(guān)鍵詞(以我們目前在做的一款大數(shù)據(jù)產(chǎn)品為例):
我們和一線的產(chǎn)品經(jīng)理一起頭腦風(fēng)暴,從理性角度(產(chǎn)品定位)及感性角度(大家分別說說產(chǎn)品給他的感覺)提煉了一些關(guān)鍵詞,再通過“投石問路”的結(jié)果 (根據(jù)我個人經(jīng)驗,一線產(chǎn)品經(jīng)理比較務(wù)實;owner及l(fā)eader的想法比較縹緲)及設(shè)計師的大膽創(chuàng)意,想象出如上圖的個性關(guān)鍵詞。從圖中可以看出,這 里的個性關(guān)鍵詞是非常抽象的,它給人很大的想象空間,并且源于理性和感性詞?,F(xiàn)在有沒有感覺產(chǎn)品已經(jīng)有一些個性出來了呢?
四、映射個性風(fēng)格
有了這些詞,我們就開始找相關(guān)的圖片制作情緒板了。和傳統(tǒng)的情緒板(關(guān)于情緒板的方法網(wǎng)上有很多文章,這里就不介紹了)方法不一樣的是,我們并不一定要從情緒板里提煉出什么然后嚴(yán)格遵守。因為情緒板就是一個工具,是幫助設(shè)計師找感覺的,而不是限制住設(shè)計師思維的。
情緒板的作用是幫助設(shè)計師把關(guān)鍵詞圖形化,同時思考它是否合適?比如玄幻這個詞應(yīng)該是一種什么樣的視覺表現(xiàn)?這種視覺表現(xiàn)體現(xiàn)在界面上好處理嗎?太 極用作logo的話,能夠有哪些表現(xiàn)形式?一方面要通過情緒板找感覺,一方面在界面上反復(fù)嘗試(試稿),然后通過權(quán)衡找到合適的風(fēng)格,這是一個反復(fù)迭代的 過程。
五、設(shè)計主題設(shè)定
經(jīng)過多次試稿以及大家的意見,設(shè)計師決定通過行云流水的整體感覺打造既有中國特色,又有B端產(chǎn)品感覺的獨特風(fēng)格(由于視覺稿還未上線,所以這里不多 說了,僅用于說明方法)。logo融入了太極+水滴+水晶球的元素,界面主題為海洋(數(shù)據(jù)可比作大海,同時海波也是常見的古代傳統(tǒng)花紋元素),界面元素多 考慮曲線以及傳統(tǒng)紋樣,整體強調(diào)對比(太極)及留白(中國畫),突出意境……
設(shè)計主題非常的重要,沒有主題的設(shè)計會顯得單薄、平淡,缺少靈魂。
六、設(shè)計方案推演
其實設(shè)計師并不是一開始就決定用行云流水的感覺貫穿界面始終。最開始他想從“陰陽”、“太極”、“海波”等感覺入手(來自個性關(guān)鍵詞),但是大家覺 得效果并不是很好;后來我們決定更落地一點,找找“中國風(fēng)”的感覺,在這個過程中通過情緒板了解了很多中國傳統(tǒng)的紋樣,改進(jìn)后發(fā)現(xiàn)風(fēng)格確實明顯了,但整體 比較零散,缺乏主線;大家不斷在界面上找問題,給建議,設(shè)計師也做了很多功課,沒事就上網(wǎng)搜各種中國畫找靈感,最終確定了“行云流水”作為貫穿界面整體風(fēng) 格的主線,界面主題、元素、風(fēng)格均圍繞這種感覺,最終設(shè)計出風(fēng)格獨樹一幟、個性十足又不失B端產(chǎn)品行業(yè)共性的作品。我們與眾不同的品牌基調(diào)也就此確定下 來。
所以五、六步并不是一個完全線性的過程,它們是一個不斷迭代的過程:先通過第四步情緒板映射個性關(guān)鍵詞,然后試稿(設(shè)計師個人嘗試),在這個過程中 有了大致的設(shè)計主題(比如第一個版本就有海洋元素),在此基礎(chǔ)上通過設(shè)計方案推演(大家給建議)不斷改善,在這個過程中設(shè)計主題越來越清晰,再通過不斷的 推演達(dá)到最終效果。
所以如果你看到某個設(shè)計師講述自己的設(shè)計推導(dǎo)過程是按照步驟順序完成的,那基本是不可能的。不管是做產(chǎn)品、做交互設(shè)計還是視覺設(shè)計,都充滿了無數(shù)的迭代過程。再優(yōu)秀的設(shè)計師也要通過不斷的修改完善自己的作品。我相信好的設(shè)計都是改出來的。
最終我們的設(shè)計稿在挑剔的老板面前一次通過,大家都感到很興奮,貌似這是第一次這么順利。
寫在最后
在互聯(lián)網(wǎng)2.0時代,設(shè)計師沒有什么章法,更多的是隨心所欲的做設(shè)計,設(shè)計好壞靠的是設(shè)計師的個人能力。
在互聯(lián)網(wǎng)3.0時代,各種優(yōu)秀的互聯(lián)網(wǎng)產(chǎn)品層出不窮,對設(shè)計師的要求也越來越高,優(yōu)秀的設(shè)計師不僅要有基本的審美能力和設(shè)計技法,還要懂產(chǎn)品、懂用 戶,懂怎么通過UI設(shè)計正確的引導(dǎo)用戶。對于行業(yè)巨頭來說,如果只憑設(shè)計師的個人能力,整體設(shè)計水平將變得極不可控,所以開始重視方法論、重視設(shè)計師的推 導(dǎo)能力。這樣可以很好的提升設(shè)計師的理論能力及產(chǎn)品能力,讓更多設(shè)計師認(rèn)真的思考如何做正確的設(shè)計;但同時帶來的反面效果是設(shè)計師的創(chuàng)意能力受到限制。最 近幾年,國內(nèi)的設(shè)計呈現(xiàn)流水線般的感覺,優(yōu)質(zhì)而有創(chuàng)意的設(shè)計越來越少見,與之不對稱的是設(shè)計師的自我包裝能力越來越強了(否則通過作品沒辦法拉開差距)。
在逐步發(fā)展的“互聯(lián)網(wǎng)+”時代,互聯(lián)網(wǎng)會滲透到各行各業(yè),這對設(shè)計師也會有不一樣的要求。每個行業(yè)的情況都完全不同,這要求設(shè)計師既要根據(jù)行業(yè)、產(chǎn) 品特點做出正確的設(shè)計,又要通過獨特的設(shè)計語言賦予產(chǎn)品不一樣的個性。未來注定是一個在設(shè)計上百花齊放的時代,隨著設(shè)計行業(yè)的不斷成熟,同質(zhì)化的設(shè)計會越 來越少,在某些獨特的行業(yè),設(shè)計師甚至?xí)o競品可借鑒,只能通過扎實的基本功確定設(shè)計方向。
我希望這一天可以盡快到來!
#專欄作家#
劉津,個人博客:blog.sina.com.cn/legene。人人都是產(chǎn)品經(jīng)理專欄作家,暢銷書《破繭成蝶——用戶體驗設(shè)計師的成長之路》作者,阿里巴巴交互設(shè)計專家。畢業(yè)于北京大學(xué)數(shù)字藝術(shù)系,先后就職于網(wǎng)易、阿里巴巴,積累了豐富的互聯(lián)網(wǎng)設(shè)計經(jīng)驗。
本文系作者授權(quán)發(fā)布,未經(jīng)許可,不得轉(zhuǎn)載。
標(biāo)題有點大。單純從視覺和交互體驗上來說,首設(shè)或者高級設(shè)計師就可以著手了。難點其實在于后續(xù)的個性保持、品牌概念建立。需要長期的延續(xù)性,這個就不是單單一個首設(shè)或者產(chǎn)品經(jīng)理能搞定的了。當(dāng)然了,沒有話語權(quán),沒有工程師配合,啥也白說。
沒錯,話語權(quán)很核心,沒有話語權(quán)真就什么都沒有