為什么你做的設(shè)計(jì)不耐看?不合理?
本文作者將給大家分析幾個(gè)電商設(shè)計(jì)作品,并且會(huì)從排版、配色、用戶體驗(yàn)、定位、用戶心理等各個(gè)角度給大家講解分析指出問(wèn)題所在,enjoy~
這些年找我點(diǎn)評(píng)作品的人不少,但我發(fā)現(xiàn)一個(gè)現(xiàn)象,很多人做的設(shè)計(jì)也許從視覺(jué)上看是挺好的,但是卻很難有讓人過(guò)目不忘的感覺(jué),總感覺(jué)缺少一些靈魂,所以假設(shè)用戶看到這些設(shè)計(jì)的時(shí)候呢?那么他們是無(wú)法在最短的時(shí)間內(nèi)明白你這個(gè)設(shè)計(jì)要表達(dá)什么的。
尤其是電商設(shè)計(jì),是一定不能夠僅僅以視覺(jué)層面,比如排版/配色啊好不好看的為主要設(shè)計(jì)方向的,而是要通過(guò)合理的設(shè)計(jì)手段把老板或運(yùn)營(yíng)要展現(xiàn)給用戶的訴求表達(dá)清楚才最重要的,要權(quán)衡他們之間的訴求。
所以接下來(lái)我繼續(xù)給大家分析幾個(gè)電商設(shè)計(jì)作品,并且會(huì)從排版、配色、用戶體驗(yàn)、定位、用戶心理等各個(gè)角度給大家講解分析指出問(wèn)題所在,這樣大家可以有針對(duì)性地去學(xué)習(xí)。
嗯,下面我們就開(kāi)始進(jìn)入正式的點(diǎn)評(píng)環(huán)節(jié)好了,以下所有的作品都是由我的面粉們提供的,感謝。
點(diǎn)評(píng)一:Banner圖
面條點(diǎn)評(píng):上面這張Banner圖大家看第一眼,嗯,整體綠色系配色很舒服,給人清新自然的感覺(jué);再看第二眼,整體左右排版的形式也還行,周圍的氛圍點(diǎn)綴也不突兀,左邊一點(diǎn)右邊一點(diǎn)相呼應(yīng);再看第三眼,文案特地用顏色和背景色塊區(qū)分,強(qiáng)調(diào)了“母乳”,嗯,沒(méi)毛病。
但是回頭一想,總感覺(jué)這張Banner缺少眼前一亮過(guò)目不忘的感覺(jué),那么問(wèn)題出在哪呢?我想問(wèn)題就出在這個(gè)Banner設(shè)計(jì)的定位錯(cuò)了。
之前我就給大家講過(guò)一個(gè)設(shè)計(jì)的順序:策劃活動(dòng)的目的決定了文案要怎么去寫(xiě),而文案的內(nèi)容又決定了設(shè)計(jì)的畫(huà)面應(yīng)該怎么去把握,這個(gè)是一環(huán)扣一環(huán)的才對(duì),順序別搞反了。
所以一般我們通過(guò)文案就最容易明白這個(gè)活動(dòng)的目的是什么了,并且通過(guò)文案就可以去檢驗(yàn)這個(gè)設(shè)計(jì)合不合適。
那我們看一下這個(gè)Banner的文案“母乳般濕潤(rùn)呵護(hù)”,母乳般意味著安心、健康、天然、柔滑之類的,濕潤(rùn)呵護(hù)意味著保濕滋潤(rùn)呵護(hù)寶寶的肌膚,總而言之就是要表達(dá)這款沐浴露用了可以給寶寶安全舒適感,媽媽買了放心。
這是一種情緒上的感受,你得通過(guò)設(shè)計(jì)去傳達(dá)出來(lái)才對(duì),但是這個(gè)Banner設(shè)計(jì)除了顏色是綠色可以給人健康純天然的感覺(jué)以外,其他情緒是完全感受不到的,是干癟癟的,就像一些缺少氣質(zhì)或內(nèi)涵的美女,好看是好看,但就是讓人愛(ài)不起來(lái)。
并且如果我將這里產(chǎn)品替換成任何其他東西,只要顏色類似,好像都是可以的,你會(huì)發(fā)現(xiàn)它就像個(gè)模版一樣的存在。
我給大家舉幾個(gè)例子,看看什么叫通過(guò)設(shè)計(jì)畫(huà)面一眼就可以讓人感受到那種情緒和靈魂,足以波動(dòng)用戶的心弦~
比如在畫(huà)面加入模特笑容:因?yàn)槿魏稳硕嫉挚共涣嗣匀说男θ莸奈Φ?,你針?duì)的是什么人群的用戶,你就用那個(gè)人群的迷人笑容,我這里找的圖只是給大家舉例哈~
天喏,這笑起來(lái),我作為妹子都完全把把持不住啊。。。。(其實(shí)很多母嬰產(chǎn)品喜歡用媽媽或?qū)殞毜男θ?,不是沒(méi)有道理的,非常有感染力)
比如構(gòu)建一個(gè)有趣的或者讓人快樂(lè)舒適的場(chǎng)景:一般都是在畫(huà)面融入一些手繪元素是比較省事的做法。
可以是全手繪~
可以是半手繪~
比如讓產(chǎn)品噴灑出來(lái)活躍下氣氛:這里一般也會(huì)加入一些手繪和合成的手法,不管你的產(chǎn)品是液態(tài)、固態(tài)還是粉末煙霧,其實(shí)都是適用的。
啊,如果我們?cè)诶锩嫒谌胍恍┬⌒〉氖掷L元素,那就更打動(dòng)人了,感覺(jué)特別無(wú)害系列~寶寶產(chǎn)品、生活百貨品類都適用~
其實(shí)我之前設(shè)計(jì)的幾張手機(jī)照片海報(bào)系列作品,也是同樣的道理啊,這樣的設(shè)計(jì)很容易打動(dòng)人,總可以給人會(huì)心一笑的感覺(jué):
那么,我們?cè)倩仡^看看這張Banner,你可以跟上面那些富有情感的有親和力的設(shè)計(jì)對(duì)比一下,哪個(gè)讓你更有購(gòu)買的欲望?
因?yàn)檫@個(gè)定位的方向本就應(yīng)該是親和力+安全方向的,所以對(duì)于這種路線的Banner設(shè)計(jì)來(lái)說(shuō),我想大部分人都應(yīng)該會(huì)被那種可以讓人會(huì)心一笑的設(shè)計(jì)而打動(dòng)而吸引吧。
做合適的設(shè)計(jì),而不要局限于只是玩玩排版就夠啊同志們。
點(diǎn)評(píng)二:海報(bào)
面條點(diǎn)評(píng):我們分析作品之前,可以先有個(gè)大概的概念,確立他是什么風(fēng)格的,然后再對(duì)比看看他的文案,就可以知道這是不是一個(gè)合適的設(shè)計(jì)了。
在這里我們可以看到,這個(gè)海報(bào)的文案是“潮流X強(qiáng)調(diào)”,嗯這個(gè)海報(bào)要走潮流個(gè)性有情調(diào)的路線,那么大家看,這個(gè)設(shè)計(jì)合適嘛?
我的感覺(jué)是,這里模特是合適的,設(shè)計(jì)師要走的設(shè)計(jì)方向也是合適的,但就是設(shè)計(jì)師的思維有點(diǎn)局限,然后執(zhí)行起來(lái)有點(diǎn)不到位罷了,主要是排版、配色、細(xì)節(jié)方面的問(wèn)題,比如配色和那些字體陰影和浮雕都感覺(jué)有點(diǎn)臟,右上角的模特切割的位置不合適,模特完全可以破出這個(gè)框架的等問(wèn)題。
那么針對(duì)這種情況和設(shè)計(jì)問(wèn)題,當(dāng)然就是應(yīng)該多看多練習(xí)啊,我也是可以給大家一些參考方向,你可以看看人家的表現(xiàn)形式和排版配色等等,總之就是到潮、high、帶感就對(duì)了~
說(shuō)到潮這方面,有貨yoho和淘寶可都是一把好手~
比如有貨潮流新品節(jié)的潮:
我給大家總結(jié)了一下,大家抓住這些規(guī)律:
英文要夠?yàn)t灑,
顏色要夠亮瞎,
文字要夠大大….大,
大小粗細(xì)對(duì)比都用起來(lái),
粗糙的黑色描邊是潮流設(shè)計(jì)師最愛(ài),
看他模特夸張或玩世不恭的表情,
再整點(diǎn)復(fù)古玩意兒做裝飾品,
什么拼接風(fēng)或達(dá)達(dá)主義一樣都來(lái)點(diǎn)兒,
有什么不敢造的呢?
就怕你玩的不夠嗨?。 ?/p>
好了,我總結(jié)完了,大家嗨了嗎?
再比如2018年淘寶新勢(shì)力的潮:
不過(guò)關(guān)于這個(gè)新勢(shì)力周的設(shè)計(jì)分析我之前寫(xiě)過(guò)了,我就不繼續(xù)分析了,想看的請(qǐng)點(diǎn)擊這篇:搞定頁(yè)面視覺(jué)風(fēng)格統(tǒng)一性,看這篇文章就夠了!~
當(dāng)然了,在我看來(lái)潮并不是一個(gè)固定的設(shè)計(jì)形式,因?yàn)槊總€(gè)人對(duì)于潮的理解不一樣,但潮的人一定是都是敢于表現(xiàn)真我,愿意展現(xiàn)自己的那一類人,并且不喜歡一些條條框框束縛住自己,所以你的設(shè)計(jì)如果想要潮起來(lái),就最好是能打破常規(guī),千萬(wàn)不要呆板小氣吧啦的~
關(guān)鍵詞:打破規(guī)則、文字或模特要大、模特穿著或表情要酷
啊,就寫(xiě)這么多吧~
點(diǎn)評(píng)三:中秋海報(bào)
面條點(diǎn)評(píng):這2張海報(bào)如果非要讓我選的話,我肯定會(huì)選第一張,至少畫(huà)面看起來(lái)干凈一點(diǎn),構(gòu)圖也還行,但是也可以看出來(lái)設(shè)計(jì)師的執(zhí)行力差了點(diǎn),比如中間的月球處理的比較粗糙,居然使用了木質(zhì)紋理代替月球表面的紋理細(xì)節(jié),但因?yàn)榭粘瞿敲创笠粔K,這些粗糙的質(zhì)感就會(huì)特別顯眼,然后旁邊的月餅感覺(jué)懸浮了,其他元素之間也感覺(jué)銜接的不是很自然,這都是細(xì)節(jié)問(wèn)題執(zhí)行力方面的問(wèn)題。
執(zhí)行方面的問(wèn)題反應(yīng)的都是基本功不扎實(shí)和練習(xí)太少看的太少的問(wèn)題,自己私下需要多花時(shí)間去提升,沒(méi)有別的法子,這里我就不做過(guò)多解釋了。
另外,我們既然提到了中秋節(jié),中秋節(jié)也馬上就來(lái)了,我們干脆就講一講中秋節(jié)主題的設(shè)計(jì)可以怎么去玩。
關(guān)于中秋節(jié)相關(guān)的設(shè)計(jì),目前大家最常用的方法就是聯(lián)想法,所聯(lián)想法就是發(fā)散思維,去想與中秋相關(guān)的關(guān)鍵詞,比如中秋節(jié)我們會(huì)想到:玉兔、月球、月亮、嫦娥等等,然后中秋按習(xí)俗我們一般會(huì)吃月餅,并且這時(shí)候很多人會(huì)選擇送禮,送螃蟹等等。
那么關(guān)于中秋節(jié)的設(shè)計(jì)其實(shí)跟平時(shí)的設(shè)計(jì)沒(méi)啥大的差別,唯一就是要體現(xiàn)這是中秋節(jié)相關(guān)的設(shè)計(jì),所以需要通過(guò)中秋相關(guān)的配色、中秋相關(guān)的元素、中秋相關(guān)的場(chǎng)景搭建等形式,來(lái)營(yíng)造中秋的感覺(jué)。
大家可以自己去花瓣搜索“中秋節(jié)海報(bào)”找參考咯~
點(diǎn)評(píng)四:開(kāi)學(xué)季專題頁(yè)
面條解答:這個(gè)開(kāi)學(xué)季的頁(yè)面細(xì)節(jié)非常豐富,可以看得出來(lái)是花了些心思的,但同時(shí)也存在著一些問(wèn)題,我給大家捋一捋這些問(wèn)題分別在哪里。
我們從上往下看,首先是頭圖部分:
因?yàn)槭情_(kāi)學(xué)季主題的頁(yè)面,所以設(shè)計(jì)師打造了一個(gè)教師的場(chǎng)景,其實(shí)是可以的,但是整個(gè)教室的比例和構(gòu)圖卻感覺(jué)不太合適,因?yàn)楦杏X(jué)是站在很遠(yuǎn)的地方去看一樣,距離太遠(yuǎn)了,所有的商品、文案全都堆積在了一起,小小的,這就給人的感覺(jué)不太好了。
你說(shuō)我買個(gè)東西,還要隔那么遠(yuǎn)去買?望成莫及的感覺(jué),我難受啊。
所以這里的視線距離和商品比例肯定是需要調(diào)整的,我找了個(gè)構(gòu)圖和比例更合適的設(shè)計(jì)參考給大家看看:
這里參考頁(yè)面有樓層作前景、中間商品作中景,后面黑板報(bào)做遠(yuǎn)景,信息層級(jí)分明用戶看著就不累,商品和文案都很顯眼,然后整個(gè)教室場(chǎng)景很真實(shí)的感覺(jué),再加點(diǎn)手繪人物和元素做氛圍點(diǎn)綴,整體的反映出來(lái)的氣質(zhì)是適合開(kāi)學(xué)季這個(gè)主題的的。
再往下看,看樓層部分:這里設(shè)計(jì)師將每個(gè)標(biāo)題部分加入了尺子元素,但是這里太擬物化了,你會(huì)發(fā)現(xiàn)尺子作為點(diǎn)綴元素居然比樓層標(biāo)題和要售賣的商品還要突出顯眼,這個(gè)重要順序是不合理的,標(biāo)題應(yīng)該是主角才對(duì),所以要么弱化尺子,要么突出標(biāo)題文字。
當(dāng)然尺子最好也不要擬物化的手繪形式,統(tǒng)一用簡(jiǎn)筆畫(huà)的手繪形式更合適。
這個(gè)頁(yè)面其他方面的問(wèn)題倒還好,不過(guò)多看幾眼會(huì)感覺(jué)頁(yè)面細(xì)節(jié)過(guò)多了,頁(yè)面略空,思維局限了,其實(shí)有很多其他形式的開(kāi)學(xué)季啊,大家可以看看。
比如視角可以是俯視不一定是正視:
比如配色也可以多彩一些啊:
比如可以完全拋棄黑板報(bào)這種元素和教室這種場(chǎng)景啊:
好了,時(shí)間不早了,就點(diǎn)評(píng)到這里吧。
另外,我第一眼看這個(gè)頁(yè)面就感覺(jué)有我工作第2年的影子,然后和這位設(shè)計(jì)師聊了一下,發(fā)現(xiàn)其實(shí)他是半路轉(zhuǎn)行的,做設(shè)計(jì)果然已經(jīng)是2年了,巧了,這說(shuō)明大家其實(shí)都是這樣過(guò)來(lái)的。
下面這個(gè)頁(yè)面就是我在2012年的時(shí)候設(shè)計(jì)的,那時(shí)候是我剛剛從UI設(shè)計(jì)轉(zhuǎn)型做了電商設(shè)計(jì),是我工作的第2個(gè)年頭,那會(huì)兒我也是喜歡用這種手繪簡(jiǎn)筆畫(huà)+虛線做背景氛圍點(diǎn)綴……現(xiàn)在看這種虛線的運(yùn)用其實(shí)是感覺(jué)有點(diǎn)過(guò)時(shí)了。
寫(xiě)在最后
因?yàn)槲医?jīng)?;卮鸫蠹业膯?wèn)題,經(jīng)常點(diǎn)評(píng)設(shè)計(jì)的緣故,所以當(dāng)我看到一個(gè)人的設(shè)計(jì)稿我就差不多可以看出ta的性格、工作時(shí)長(zhǎng)、基礎(chǔ)扎不扎實(shí)了,比如上面那位面粉,我可以看出她思維比較局限,然后果然她性格也是這樣的,做很多事情都是畏畏縮縮的,不敢放開(kāi)步子大膽去干。
所以如果你也感覺(jué)自己的設(shè)計(jì)遇到瓶頸了,沒(méi)有想法了,或者做出來(lái)的設(shè)計(jì)總感覺(jué)特別小家子氣,那很有可能你是需要改變一下自己的內(nèi)心了,放開(kāi)一點(diǎn),大膽去嘗試新鮮的事物(非違法的就行),你可能會(huì)有意想不到的收獲。
因?yàn)橛腥さ娜俗龀鰜?lái)的設(shè)計(jì)往往也會(huì)是有趣的,但你很難讓一個(gè)無(wú)趣的人做出有趣的設(shè)計(jì),因?yàn)樗芸赡芾斫獠涣耸裁唇杏腥ぐ ?/p>
作家一般為了寫(xiě)作需要會(huì)去體驗(yàn)很多種生活尋找靈感,設(shè)計(jì)師何嘗不是呢?多出去走走看看,不要局限了自己啊。
高不高于生活我不知道,反正我是深深地感受到設(shè)計(jì)是來(lái)源于生活的。
#專欄作家#
做設(shè)計(jì)的面條,公眾號(hào):做設(shè)計(jì)的面條,人人都是產(chǎn)品經(jīng)理專欄作家。一位擅長(zhǎng)將電商及banner設(shè)計(jì)講得最透徹易懂的妹子,有趣有料會(huì)拍照,歡迎互相交流。
本文由作者@做設(shè)計(jì)的面條 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理
題圖來(lái)自 Pexels,基于 CC0 協(xié)議
學(xué)到了
面條妹妹:好久不見(jiàn)!每次選的案例都好有美感!
為何從ui轉(zhuǎn)電商哇
我也是第一反應(yīng)這個(gè)感覺(jué)是在倒著走..