騰訊、阿里等大廠設(shè)計(jì)師做設(shè)計(jì)的10個(gè)細(xì)節(jié),全網(wǎng)揭秘

2 評(píng)論 1826 瀏覽 7 收藏 12 分鐘

隨著工作年限的增長,我們或多或少都會(huì)陷入一些固化的思維,認(rèn)為有的東西只能這么做,或者只能那么表達(dá),常常會(huì)陷入一種固化的思維僵局中,經(jīng)常會(huì)產(chǎn)生靈感枯竭、無法產(chǎn)出的感覺,但當(dāng)我們跳出當(dāng)前的工作內(nèi)容,多去看看別的產(chǎn)品別的平臺(tái),甚至跟工作無關(guān)的事物和項(xiàng)目時(shí),我們常常會(huì)找到新的思考方式,找到更多更好的表達(dá)方式和方法論。

之前看過一句話講的非常好,如果你一直在看新的東西、學(xué)新的東西、經(jīng)歷新的東西,你的世界永遠(yuǎn)是新鮮的,于是我們做的東西也是新鮮的、有創(chuàng)意的,哪有什么靈感枯竭,只是自己輸入不夠、見識(shí)不廣而已。

一、文字的表達(dá)力

作為設(shè)計(jì)師很容易迷念畫面的表達(dá),喜歡用圖案,殊不知其實(shí)文字也是很有表達(dá)力的,在特定的場景它有時(shí)更直接。

以下是釘釘打卡的下班提示頁,沒有用非??犰诺漠嬅妫陀昧藥讉€(gè)簡單的文字,然后配了一個(gè)酷酷的表情,表情頭部上面還帶了一個(gè)龍頭帽,祝福大家萬事興龍,感覺表達(dá)挺到位,形式也比較新穎,有眼前一亮的感覺。

運(yùn)用文字表達(dá)還有一個(gè)優(yōu)點(diǎn),它特別方便迭代,可以根據(jù)不同的時(shí)間節(jié)點(diǎn)和節(jié)日,放置不同的文案來表達(dá)當(dāng)前的一個(gè)節(jié)日氣息,既考慮了用戶,讓用戶感受到產(chǎn)品是在不斷的更新和迭代,同時(shí)也縮短了產(chǎn)品呈現(xiàn)的一個(gè)時(shí)間成本。

二、古風(fēng)的另一種表達(dá)

用一些古代家具的邊框細(xì)節(jié)樣式也能表達(dá)出濃濃的古風(fēng)韻味,技法用了圖片合成的方式,效果非常的亮眼,主題表達(dá)很清晰。

以下是安徽建設(shè)銀行的一個(gè)活動(dòng)頁面,它就是大量借鑒古代家具、門窗、畫軸和珠寶飾品的的樣式,它把家裝設(shè)計(jì)、建筑設(shè)計(jì)會(huì)運(yùn)用的手法和樣式引入到了UI設(shè)計(jì)當(dāng)中,很好的表達(dá)了徽派文化、古城文化,這個(gè)新思路很值得學(xué)習(xí)。

三、注重細(xì)節(jié)帶來的微妙變化

圖標(biāo)是UI設(shè)計(jì)中經(jīng)常會(huì)運(yùn)用到的元素,注重在細(xì)節(jié)上的變化和重組,可以產(chǎn)生多樣的視覺效果,豐富頁面的多樣性。

唯品會(huì)的這兩組圖標(biāo),他們分別放置在不同的頁面設(shè)計(jì)中,但是設(shè)計(jì)師善于運(yùn)用細(xì)節(jié)的微妙變化,讓產(chǎn)品產(chǎn)生了多樣豐富的感覺,但是他們又具有一定的統(tǒng)一性,因?yàn)檫@兩組圖標(biāo)都是基于在一個(gè)圓角正方形內(nèi)做的變化和創(chuàng)作。

四、用水墨風(fēng)來表達(dá)具有古風(fēng)品牌的產(chǎn)品

當(dāng)今國潮風(fēng)、水墨風(fēng)比較盛行,甚至在逛大街的時(shí)候都能看到有少男少女穿著具有古風(fēng)韻味的衣著,成為大街上一道靚麗的風(fēng)景,如果這種水墨風(fēng)表達(dá)在UI產(chǎn)品設(shè)計(jì)中會(huì)是怎樣的風(fēng)景呢?

以下就是長沙茶顏悅色的小程序首頁,整個(gè)產(chǎn)品從插畫、圖標(biāo)、彈窗都運(yùn)用的水墨的表達(dá)方式,甚至連字體都沿用了具有古色的襯線體和毛筆體,把茶顏悅色的品牌文化表達(dá)的淋漓盡致,因此它也成為了眾多APP設(shè)計(jì)中一道吸睛的產(chǎn)品,風(fēng)格比較別致,與眾不同。

五、品牌名稱/slogan在金剛區(qū)的應(yīng)用

在金剛區(qū)加入企業(yè)想要傳播的信息,他可以是品牌名稱,也可以是一段slogan,這樣傳播更有效、更直接。

中國電信一改之前的風(fēng)格,直接在APP首頁中把企業(yè)的名稱融入到了金剛區(qū)的圖標(biāo)中,有種眼前一亮,風(fēng)格新穎的感覺,也是一個(gè)很好的品牌傳遞的策略。

安徽聯(lián)通,他想在新的一年里表達(dá)企業(yè)的一個(gè)完美愿望,他把“完美好生活”諧音成了“皖美好生活”既表達(dá)了愿望,同時(shí)也標(biāo)榜了地域文化,可謂一舉兩得。

六、閃電圖形在促銷活動(dòng)中的應(yīng)用

閃電圖形給人一種快且迅速的感覺,能在心理上加速人的緊迫感,同時(shí)也能給人一種很強(qiáng)烈的提示感,易引起人們的注意。

拼多多在產(chǎn)品的促銷活動(dòng)中運(yùn)用了一個(gè)閃電的負(fù)形,讓人一眼就看到九折的促銷活動(dòng),成功的吸引了用戶的關(guān)注,是一個(gè)很好的設(shè)計(jì)處理方法,顏色也采用了讓人有購買欲的紅、黃色。

京東在促銷活動(dòng)入口處也運(yùn)用了閃電圖形,同時(shí)也是用的紅橙色,確實(shí)這兩種顏色的提示力比較強(qiáng),在很多的電商平臺(tái)都有運(yùn)用。

淘寶在限時(shí)優(yōu)惠活動(dòng)中也運(yùn)用了閃電圖形,給人制造一種緊張的心理,引導(dǎo)用戶快速購買。

七、局部打破能帶來不一樣的效果

打破的卡片式設(shè)計(jì)看著更加的靈動(dòng),卡片的空間感、設(shè)計(jì)感會(huì)更強(qiáng)。

中國聯(lián)通在卡片的右上角向內(nèi)破了一個(gè)角,然后把角內(nèi)陷留出來的空間放置一個(gè)圖標(biāo),并且圖標(biāo)是疊加在下面的,這樣圖標(biāo)并沒有成為主角,依然還是內(nèi)容為王,但是整個(gè)頁面的美感提升了很多,空間感也強(qiáng)了很多。

叫叫閱讀也運(yùn)用了卡片右上角打破的手法,只不過這次他的目的不一樣,他是為了讓孩子每天堅(jiān)持打卡,所以它把右上角放置動(dòng)態(tài)的叫叫IP ,起到了一個(gè)強(qiáng)化和提醒的作用,業(yè)務(wù)目的不一樣,所呈現(xiàn)的方式也會(huì)略有不同。

八、卡片設(shè)計(jì)的更多可能

在卡片的底色上添加與文案話題相符的底紋,增加了卡片的氛圍感,起到突出和強(qiáng)調(diào)的作用。

微博中,它根據(jù)不同的熱點(diǎn),不同的主題,在每個(gè)卡片的右上角都配置了與當(dāng)前博主相符的圖形底紋,讓整個(gè)卡片的氛圍感爆棚,是一個(gè)很好的設(shè)計(jì)借鑒點(diǎn)。

九、通過添加紋理增加按鈕的趣味性

小小細(xì)節(jié),大大的思考,多一點(diǎn)點(diǎn)的用戶體驗(yàn)思考,會(huì)帶來更多不一樣的設(shè)計(jì)。

手機(jī)公積金的這款按鈕設(shè)計(jì)非常的有趣,通過增加用戶使用場景下的指紋和表情大大增加的產(chǎn)品的情感化設(shè)計(jì),雖然按鈕上的這個(gè)指紋繪畫起來并不難,按鈕上對(duì)應(yīng)的表情其技術(shù)實(shí)施難度也不大,可是這種切合用戶情緒和使用場景的設(shè)計(jì),卻非常的遭用戶喜歡,設(shè)計(jì)者的思維方式值得學(xué)習(xí)。

鐵路12306的冬季酒店活動(dòng)推廣中,在按鈕設(shè)計(jì)中加入了雪花、融雪的元素,營造出了滿滿的冬季氣息,氛圍營造的非常到位,跟周圍的活動(dòng)插畫也融為一體,整體感也很強(qiáng)。

錢包APP卡片中的文字沒有使用常規(guī)的按鈕表達(dá)方式,而是在需要用戶點(diǎn)擊的地方添加了一個(gè)精致的漸變底色,這種新穎的按鈕表達(dá)方式起到了一個(gè)提醒人們注意的作用,增加了用戶點(diǎn)擊的欲望和概率。

十、上頂?shù)慕换?dòng)效提升頁面的利用率

當(dāng)首頁需要展示的信息太多時(shí),上頂?shù)慕换シ绞绞且粋€(gè)不錯(cuò)的選擇。

飛豬旅行的首頁需要展示 的信息特別多,當(dāng)人們點(diǎn)擊下面的面包屑按鈕時(shí),對(duì)應(yīng)的模塊信息會(huì)上滑全屏顯示,大大增加了頁面的利用率,同時(shí)也給用戶帶來了沉浸式的感官體驗(yàn)。

產(chǎn)品體驗(yàn)總結(jié):

生活中到處都是師者,做一個(gè)有心人,每天去觀察身邊產(chǎn)品中的小細(xì)節(jié)小心思,積累到一定的量的時(shí)候,關(guān)鍵時(shí)刻也能給我們?nèi)粘TO(shè)計(jì)工作中帶來很多的靈感和啟發(fā),為自己的設(shè)計(jì)工作賦能。

本文觀點(diǎn)都為個(gè)人理解和總結(jié),不足之處也歡迎大家留言區(qū)多多點(diǎn)評(píng)指正,大家共同進(jìn)步!

作者:姝斐suphie,公眾號(hào):姝斐

本文由 @姝斐suphie 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)作者許可,禁止轉(zhuǎn)載

題圖來自 Unsplash,基于CC0協(xié)議

該文觀點(diǎn)僅代表作者本人,人人都是產(chǎn)品經(jīng)理平臺(tái)僅提供信息存儲(chǔ)空間服務(wù)。

更多精彩內(nèi)容,請關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號(hào)或下載App
評(píng)論
評(píng)論請登錄
  1. 非常好的文章,設(shè)計(jì)常常是被人們忽略的細(xì)節(jié),但實(shí)際上是產(chǎn)品得以致勝的秘訣,希望每位產(chǎn)品人都能回歸初心,匠心出良品

    來自中國 回復(fù)
  2. 哇,大廠設(shè)計(jì)師的秘密武器被揭秘了,這10個(gè)設(shè)計(jì)細(xì)節(jié)得學(xué)起來,提升技能必備!

    來自遼寧 回復(fù)