首頁(yè)

160種常用的配色方案,把設(shè)計(jì)調(diào)性拿捏得死死的

seo達(dá)人

一、高端

圖片

視覺(jué)調(diào)性高端的色彩,通常具有明度低、飽和度低、顏色數(shù)量少等特點(diǎn),所以很多高端的設(shè)計(jì)都會(huì)以深色作為背景色,因?yàn)樯钌@低調(diào)、更具神秘感,所以給人的感覺(jué)更高貴。然后以亞金色、銀色、桔紅色、白色等作為輔助色。

圖片

 

二、科技

圖片

想要表現(xiàn)科技感,色彩的整體調(diào)性通常會(huì)偏冷色系,明暗對(duì)比要強(qiáng),且通常會(huì)使用漸變色。比如以深藍(lán)色到藍(lán)色的漸變作為背景色,然后用高飽和度、高亮度的青色和紫色作為輔助色,這時(shí)這些輔助色就會(huì)非常的跳躍,具有一種發(fā)光的效果。

圖片

 

三、時(shí)尚

圖片

其實(shí)所有調(diào)性的配色都應(yīng)該要盡量時(shí)尚一點(diǎn),即使是想表現(xiàn)復(fù)古,也不能太土,所以這里所說(shuō)的時(shí)尚特指偏向年輕、潮流的時(shí)尚。這種色彩通常具有飽和度高、明度適中、色相對(duì)比較大等特點(diǎn)。蔥爺這里概括了兩類,一類是以純色作為背景,這種色彩比較適合于品牌設(shè)計(jì)、網(wǎng)頁(yè)設(shè)計(jì)、畫(huà)冊(cè)設(shè)計(jì)等;一類是以漸變色作為背景,這種色彩比較適合于電商設(shè)計(jì)、廣告設(shè)計(jì)等。

圖片

圖片

 

四、酷炫

圖片

酷炫是指那種視覺(jué)效果特別張揚(yáng)、甚至是極具個(gè)性的色彩搭配,比如近幾年比較火的蒸汽波風(fēng)格、酸性風(fēng)格、賽博朋克風(fēng)格、故障風(fēng)格,其色彩就屬于酷炫類的。該類設(shè)計(jì)通常也是以深色作為背景,圖片元素會(huì)使用高飽和度且對(duì)比很強(qiáng)的漸變色,色彩相對(duì)較多。

圖片

 

五、好吃

圖片

即讓人感覺(jué)很有食欲的色彩搭配,這種色彩通常以暖色為主,比如紅色、橙色、黃色。飽和度較高、明度較低的組合方式通常用于餐飲行業(yè);而飽和度較低、明度較高的色彩組合通常用于甜點(diǎn)、飲料等行業(yè)。

圖片

 

六、夏天

圖片

目前正值火熱的夏季,所以蔥爺專門(mén)整理了一些適合表現(xiàn)夏季的好看色彩,該類色彩通常會(huì)以藍(lán)色、青色、綠色這種冷色系最為主要顏色,然后以黃色或紅色、白色作為輔助色,這種色彩組合會(huì)給人清涼、快樂(lè)的感覺(jué)。

圖片

 

七、清新

圖片

小清新的視覺(jué)感受為輕松、柔和、淡雅,要達(dá)到這樣的效果,顏色的明度通常是比較高的,飽和度偏低,常用的顏色有淺青色、淺綠色、淺黃色、粉紅色等,在奶茶、女性護(hù)膚品的相關(guān)設(shè)計(jì)中比較常見(jiàn)。

圖片

 

八、快樂(lè)

圖片

快樂(lè)是張揚(yáng)的、是活潑的,所以快樂(lè)的色彩飽和度較高、明度不會(huì)太低、色彩的種類會(huì)比較多,通常也是以暖色為主,但是會(huì)搭配冷色一起使用。黃色具有很強(qiáng)的快樂(lè)、陽(yáng)光屬性,所以想要表達(dá)快樂(lè),黃色通常是少不了的。

圖片

 

九、可愛(ài)

圖片

跟兒童、年輕女性相關(guān)的設(shè)計(jì),通常需要表現(xiàn)出可愛(ài)的調(diào)性,這類色彩通常是用冷色和暖色相互組合,顏色的明度同樣不會(huì)太低,否則會(huì)有壓抑的感覺(jué),另外飽和度也不要過(guò)高,飽和度稍低一點(diǎn)效果會(huì)更柔和一些。

圖片

 

十、健康

圖片

想到健康我們立馬就會(huì)想藍(lán)天白云、青山、綠色的草地和樹(shù)葉,還有黃色的小野花等等,所以藍(lán)色、綠色、青色、黃色、白色都是常用于表現(xiàn)健康的色彩,紅色也可以偶爾作為點(diǎn)綴色加進(jìn)來(lái)。由于健康的調(diào)性也是要給人一種舒適、輕松的感覺(jué),所以整體的顏色明度不要太低。

圖片

 

十一、運(yùn)動(dòng)

圖片

要想讓色彩動(dòng)起來(lái),對(duì)比一定要強(qiáng),可以是色相對(duì)比、也可以是明度對(duì)比和飽和度對(duì)比。橙色和黃色是兩個(gè)很具活力的的顏色,所以常用于表現(xiàn)運(yùn)動(dòng)的設(shè)計(jì)里。

圖片

 

十二、科幻

圖片

這是一些科幻電影、機(jī)動(dòng)游戲的海報(bào)設(shè)計(jì)常用的色彩搭配組合,給人的視覺(jué)感受是穩(wěn)重而大氣,科技感和神秘感并存,所以背景色通常也比較暗,喜歡用青色和黃色這種比較亮的顏色作為點(diǎn)綴。

圖片

 

十三、喜慶

圖片

在設(shè)計(jì)節(jié)日海報(bào)或促銷海報(bào)時(shí),通常需要表現(xiàn)出喜慶的調(diào)性,有些設(shè)計(jì)師會(huì)局限在大紅色、黃色、和橙色里,這樣搭配出來(lái)的色彩容易土,而想要解決這個(gè)問(wèn)題,一方面可以加入冷色搭配使用,另一方面顏色的飽和度和亮度也不要過(guò)高。

圖片

 

十四、復(fù)古

圖片

這類色彩的特點(diǎn)是顏色的飽和度會(huì)相對(duì)低一點(diǎn),而且大多數(shù)情況下,整體的明度通常也不會(huì)太高,常用類比色搭配和對(duì)比色搭配。

圖片

 

十五、中國(guó)風(fēng)

圖片

具有中國(guó)風(fēng)特色的顏色和色彩組合有很多,蔥爺這里僅列舉了8個(gè)組合。這類色彩同樣飽和度不會(huì)達(dá)到最高,有點(diǎn)復(fù)古和充滿文化氣息的感覺(jué)。胭脂(暗紅色)、緗色(中黃)、紺青(深藍(lán)色)、黛(褐色)等是中國(guó)風(fēng)常用的顏色。

圖片

 

十六、夢(mèng)幻

圖片

夢(mèng)幻具有奇妙和神秘的感覺(jué),好像在黑暗中找到了一點(diǎn)曙光,奇遇了驚喜一般,所以大多數(shù)情況下,背景色會(huì)使用從深色到亮色的漸變。顏色相對(duì)會(huì)比較豐富,而且以漸變色居多。

圖片

 

十七、女性

圖片

女性是溫柔的,是感性的,所以該類色彩組合通常為類比色,偶爾會(huì)用一點(diǎn)對(duì)比色作為點(diǎn)綴,以增加畫(huà)面的活潑氣息,顏色的明度和飽和度都不能太低,當(dāng)然飽和度最好也不要過(guò)高,粉色、紫色是常用于表現(xiàn)女性的色彩。

圖片

 

十八、優(yōu)雅

圖片

優(yōu)雅可以理解為低調(diào)、高級(jí)、溫和、安靜,所以這類色彩的對(duì)比通常不會(huì)太強(qiáng),飽和度也會(huì)比較低,整體的色彩調(diào)性會(huì)偏中性,常用卡其色、麻色,還有單色組合及類比色組合。

圖片

 

十九、經(jīng)典色彩組合

圖片

除了以上十八大調(diào)性,蔥爺還給大家推薦一些經(jīng)典的配色,很難把它們具體歸為哪一類,但是我們?cè)谧龊芏嘣O(shè)計(jì)時(shí),用上這種配色總能得到不錯(cuò)的效果,比如紅黃黑、紅白藍(lán)、黃綠黑、等等,在很多平面海報(bào)設(shè)計(jì)中經(jīng)常能看到。

圖片

 

 

圖片

以上所列舉的色彩組合,矩形色塊為背景色,圓形色塊為畫(huà)面中圖片元素或文字使用的顏色。根據(jù)需要可以把其中的某些純色轉(zhuǎn)變?yōu)閱紊珴u變,或者也可以把某些單色漸變轉(zhuǎn)化為純色。另外,在不包含黑白灰的色彩組合里,仍可以根據(jù)需要自行加入黑白灰,比如用于填充文字的顏色。
當(dāng)然,能體現(xiàn)以上這些調(diào)性的顏色還有很多,大家可以自行補(bǔ)充,建立起自己的色庫(kù)。 

作者:蔥爺

轉(zhuǎn)載請(qǐng)注明:學(xué)UI網(wǎng)》160種常用的配色方案,把設(shè)計(jì)調(diào)性拿捏得死死的

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國(guó)內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長(zhǎng)學(xué)習(xí),請(qǐng)加藍(lán)小助,微信號(hào):ben_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。


分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。


藍(lán)藍(lán)設(shè)計(jì)www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)、UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司



這個(gè)效果原來(lái)是這樣做出來(lái)的

seo達(dá)人


圖片

 

正文

經(jīng)常使用愛(ài)奇藝刷劇的同學(xué),有沒(méi)有發(fā)現(xiàn)愛(ài)奇藝的應(yīng)用圖標(biāo)又變了。前段時(shí)間愛(ài)奇藝針對(duì)品牌設(shè)計(jì)進(jìn)行了較大的調(diào)整,最近又悄悄地將應(yīng)用圖標(biāo)的背景色換成了這種多彩色混合漸變的形式。

圖片

針對(duì)這個(gè)視覺(jué)效果估計(jì)大家各有看法,我們就不討論這個(gè)話題了,今天黑馬哥是來(lái)出教程的~O(∩_∩)O~。

這個(gè)類似于極光/彌散漸變的風(fēng)格最近也比較流行,在 UI 場(chǎng)景中的運(yùn)用也是比較普及的,被運(yùn)用到應(yīng)用圖標(biāo)的案例中相對(duì)較少。大概的回憶了一下,也有一些產(chǎn)品會(huì)使用,特別是比較知名的 Instagram 很早之前就使用了,也成為了流行趨勢(shì)中的優(yōu)秀案例之一。

圖片

通過(guò)極光/彌散漸變(混合漸變)的形式強(qiáng)化應(yīng)用圖標(biāo)外輪廓背景,不僅可以提高視覺(jué)感,也是體現(xiàn)年輕化趨勢(shì)的一種色彩表現(xiàn)形式。不過(guò)漸變中的色彩本身也是關(guān)鍵性的因素,如果色彩不夠年輕活潑,帶來(lái)的效果也是千差萬(wàn)別的。

圖片

 

一、漸變的表現(xiàn)形式

漸變色在我們的設(shè)計(jì)中是非常普及的,漸變色分為線性漸變、徑向漸變、角度漸變、混合漸變、流體漸變等形式。不同的漸變形式可以營(yíng)造不一樣的視覺(jué)體驗(yàn),可以豐富色彩環(huán)境、強(qiáng)化光影質(zhì)感、增強(qiáng)層次感和空間感等。

1、線性漸變

這是最常見(jiàn)的一種漸變方式,具備明確的方向性,由兩種或者多種顏色組合形成。相較于單色來(lái)說(shuō),線性漸變可以使得畫(huà)面更加豐富,色彩營(yíng)造出的層次感更強(qiáng)。

圖片

2、徑向漸變

徑向漸變是以中心向外擴(kuò)散而形成的圓形漸變,可以作為立體感的表現(xiàn),也可以營(yíng)造向中心聚攏的光影效果。

圖片

3、角度漸變

角度漸變形成類似于雷達(dá)掃描的效果,屬于運(yùn)用相對(duì)較少的漸變形式。在一些應(yīng)用圖標(biāo)的外輪廓背景中會(huì)被使用,也可以作為營(yíng)造產(chǎn)品的光影變化。

圖片

4、混合漸變

混合漸變就是多種顏色隨機(jī)混合,色彩形成不均勻的自然彌散開(kāi),也可以成為彌散漸變或者極光漸變。是最近比較流行的視覺(jué)風(fēng)格,可以呈現(xiàn)出豐富的色彩變化和隨性自然的年輕化趨勢(shì),被廣泛應(yīng)用到平面設(shè)計(jì)、UI 設(shè)計(jì)、電商設(shè)計(jì)等眾多視覺(jué)設(shè)計(jì)領(lǐng)域。

圖片

5、流體漸變

流體漸變就是多種顏色漸變組合,形成帶有流動(dòng)感的視覺(jué)效果,通常作為背景來(lái)豐富設(shè)計(jì)的視覺(jué)感。也有動(dòng)態(tài)形式的流體漸變,在 APP 和一些屏幕壁紙中出現(xiàn),帶來(lái)的感官體驗(yàn)也是非常不錯(cuò)的。

圖片

隨著視覺(jué)感官體驗(yàn)的不斷追求,設(shè)計(jì)師已經(jīng)不滿足于趨于平面化的漸變形式,探索出造型多變、色彩豐富、刺激感官的視覺(jué)體驗(yàn),以更加豐富的表現(xiàn)形式來(lái)探索漸變方式。

 

二、漸變小教程

線性漸變、徑向漸變和角度漸變實(shí)現(xiàn)起來(lái)比較簡(jiǎn)單,軟件自帶的漸變屬性即可滿足。下面重點(diǎn)給大家分享如何實(shí)現(xiàn)混合漸變的效果,以后再單獨(dú)給大家分享關(guān)于流體漸變的技巧。

混合漸變顧名思義就是將多種顏色進(jìn)行混合,形成色彩豐富的過(guò)度效果,需要把控的是顏色之間的自然過(guò)渡。

方法一:

通過(guò)繪制幾個(gè)不同顏色的形狀圖形,然后執(zhí)行高斯模糊形成混合漸變,模糊的參數(shù)值要適當(dāng)大一些,一直到顏色自然過(guò)渡為止。

圖片

方法二:

如果想要隨機(jī)性大一些,可以通過(guò)畫(huà)筆工具隨意涂抹顏色,這樣形成的效果更加隨機(jī)性。然后再執(zhí)行高斯模糊將顏色融合,帶來(lái)自然隨性的視覺(jué)體驗(yàn)。

圖片

 

三、分享幾個(gè)案例

不能只是紙上談兵,只有反復(fù)磨練和嘗試才會(huì)熟能生巧。根據(jù)以上的方式黑馬哥完成了以下的作品案例,大家也一起來(lái)動(dòng)動(dòng)手吧!

1、鄰近色系易把控

混合漸變技法層面來(lái)說(shuō)并不難,配色是相對(duì)具備難度的,很多同學(xué)都會(huì)因?yàn)榕渖坏轿欢霾怀鰞?yōu)秀的作品。針對(duì)應(yīng)用圖標(biāo)設(shè)計(jì)中的配色來(lái)說(shuō),鄰近色系的搭配是最容易把控的。選擇色相范圍在 60° 以內(nèi)的色值,混合出來(lái)的色彩排斥感都是比較低的,融合度比較高,能夠呈現(xiàn)出比較舒適自然的視覺(jué)感官體驗(yàn)。

如果選擇了色相角度大于 60° 的色值,只要數(shù)值的增減關(guān)系控制在 30° 以內(nèi)都屬于可控范圍,這時(shí)候如果出現(xiàn)較大的色彩排斥感,可以通過(guò)降低不透明度來(lái)進(jìn)行視覺(jué)平衡。

圖片

2、強(qiáng)視覺(jué)感還得對(duì)比色

雖然鄰近色的處理比較容易把控,但是帶來(lái)的視覺(jué)感也是與顏色對(duì)比關(guān)系成正比的,想要達(dá)到強(qiáng)視覺(jué)感還得選對(duì)比色。色相選擇范圍在 120°~180° 之間的色值,容易形成較強(qiáng)的視覺(jué)張力,通過(guò)增加高斯模糊的值才能稍微過(guò)度相互之間的色彩排斥感。

圖片

3、學(xué)會(huì)舉一反三

今天分享的經(jīng)驗(yàn)不局限于應(yīng)用圖標(biāo)的設(shè)計(jì)范疇,我們要學(xué)會(huì)將這個(gè)技法舉一反三,運(yùn)用到更多的設(shè)計(jì)場(chǎng)景中。比如在下面作品中的一組信息卡片的設(shè)計(jì)中,通過(guò)混合漸變形成的卡片背景提高了局部的視覺(jué)感,配合磨砂玻璃質(zhì)感的運(yùn)用,提高了該部分的視覺(jué)感官體驗(yàn)。

圖片

4、其他作品欣賞

為了輔助大家理解和開(kāi)拓思維,為大家選擇了幾個(gè)類似的案例作品,希望可以帶給大家更多設(shè)計(jì)靈感。(以下作品版權(quán)歸屬原作者,僅作為學(xué)習(xí)交流)

 

 

四、布置一個(gè)小作業(yè)

通過(guò)對(duì)混合漸變實(shí)現(xiàn)技巧的學(xué)習(xí)和案例欣賞,相信大家對(duì)于混合漸變有了比較全面的認(rèn)知。學(xué)以致用的目的,下面為大家準(zhǔn)備了一個(gè)小作業(yè),希望以此來(lái)強(qiáng)化大家的理解。

圖片

根據(jù)以上示意圖提供的高保真原型圖,以混合漸變的形式增強(qiáng)其作品的視覺(jué)感。

以下方案為黑馬哥完成的一個(gè)示意,大家可以轉(zhuǎn)換思維和調(diào)整新的配色方案,輸出不一樣的全新作品。

圖片


作者:黑馬青年

轉(zhuǎn)載請(qǐng)注明:學(xué)UI網(wǎng)》這個(gè)效果原來(lái)是這樣做出來(lái)的

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國(guó)內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長(zhǎng)學(xué)習(xí),請(qǐng)加藍(lán)小助,微信號(hào):ben_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。


分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。


藍(lán)藍(lán)設(shè)計(jì)www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)、UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司




百度直播丨塑造親和力的直播間虛擬助理形象

seo達(dá)人

業(yè)務(wù)背景 

首先,我們一起解讀業(yè)務(wù)場(chǎng)景、身份、及功能;業(yè)務(wù)場(chǎng)景是全品類綜合電商直播間,身份是主播的虛擬助理,直播間的功能是為用戶答疑解惑;基于這三個(gè)背景,初步勾勒了角色標(biāo)簽,目標(biāo)是創(chuàng)造一個(gè)富含親和力的虛擬助理形象,來(lái)呼應(yīng)全品類綜合直播場(chǎng)景和虛擬助理身份。圖片 

 

行業(yè)洞察

其次,洞察行業(yè)虛擬數(shù)字人,從外形上分為卡通和寫(xiě)實(shí),風(fēng)格上劃分為二次元?jiǎng)勇?D卡通、3D超寫(xiě)實(shí)、真人形象四種類型,渲染效果分為虛擬和現(xiàn)實(shí);而3D卡通風(fēng)格的受眾群體大,接近現(xiàn)實(shí)的渲染效果,更平易近人,親和感更強(qiáng)。 
探究形象美學(xué),代入「巴卡羅九風(fēng)格坐標(biāo)圖」的“曲直+量感”兩大風(fēng)格要素,定位到人物輪廓圓潤(rùn)曲直偏曲,與柔和自然的小量感「柔和型風(fēng)格」是親和的,和用戶交流時(shí)無(wú)攻擊性,符合親和的帶貨助理身份所需的特質(zhì)。 

 

設(shè)定架構(gòu)

最后,結(jié)合形象的“內(nèi)在+外在”的體現(xiàn),與巴卡羅兩大風(fēng)格要素“曲直+量感”,來(lái)塑造親和力的直播間虛擬助理形象;拆解內(nèi)在圍繞性格/氣質(zhì)/眼神特征,外在圍繞形象(體型/面貌/穿搭)、舉止與表情三大框架設(shè)定形象,共同塑造親和力和感染力的形象。

圖片

01 內(nèi)在心與神 

解析內(nèi)在形象對(duì)應(yīng)的兩大風(fēng)格要素-曲直+量感,細(xì)分量感的指標(biāo)是成熟/青春、外向/內(nèi)向、開(kāi)朗/穩(wěn)重的綜合值,曲直的指標(biāo)是熱情/冷漠、柔和/剛烈、感性/理性的綜合值。而親和力的內(nèi)在形象,量感偏小—開(kāi)朗的性格、青春樂(lè)觀的心態(tài)、以及外向的性格;曲直偏曲—需具備大方熱情的氣質(zhì)、柔和的眼神、感性的情感表達(dá),拉近和溝通者的距離,在直播間為用戶答疑解惑時(shí),第一次見(jiàn)面也能給所有人留下親切、可信任的印象。

圖片

02 外在形與貌

解析外在形象對(duì)應(yīng)的兩大風(fēng)格要素-曲直+量感,細(xì)分量感的指標(biāo)是大小、輕重、粗細(xì)、深淺、寬窄、薄厚、濃淡的綜合值,曲直的指標(biāo)是直曲、冷暖、方圓、硬軟的綜合值;量感偏小—特征是窄細(xì)淺小短薄淡,帶來(lái)柔和自然;曲直偏曲—特征是圓暖曲軟,和用戶溝通時(shí)圓潤(rùn)舒適,以此來(lái)指引親和形象的設(shè)定。  a)形象親和接下來(lái),外在形象圍繞體型/面貌/穿搭三步走框架,搭建親和力的決策框架。體型

第一步,體型選擇胖瘦適中(曲直適中);肩腰臀比例協(xié)調(diào)/凹凸有致的X型(量感適中),理想型身材穿什么衣服都好看。

面貌五官

第二步,五官的起點(diǎn)是臉型,選擇曲直適中,長(zhǎng)短適中的鵝蛋臉(額頭與顴骨等距),不挑發(fā)型。

圖片

確定臉型后,是五官的決策,我們通過(guò)洞察發(fā)現(xiàn),許多保持高熱度的卡通形象最顯著的共同特征就是擁有一雙甜美可愛(ài)的大眼睛,表情生動(dòng)親切,無(wú)攻擊性。在五官比例上,三庭中的中庭稍長(zhǎng),五眼中兩側(cè)較短,注重眼睛神情的表達(dá)。因此,在設(shè)計(jì)初始,我們先以眼睛為中心,再逐一展開(kāi)眼睛/眉毛/嘴巴/鼻子的設(shè)定。

圖片

眼睛:定位生動(dòng)的大眼(量感大)獲得生動(dòng)的神情;眼型結(jié)合圓眼+桃花眼(偏曲),上眼皮弧度圓潤(rùn)飽滿,自帶月牙般微笑感。

眉毛:定位粗細(xì)適中(量感適中),眉峰圓潤(rùn)/眉尾自然向下的小挑眉(曲直適中)。

嘴巴:定位小嘴唇(量感?。?,唇型選擇微笑唇,嘴角上揚(yáng)提升友好度(曲直適中)。

鼻子:定位鼻翼窄小的小鼻(量感?。槐切瓦x擇鼻頭上翹的小翹鼻(曲直適中),搭配鵝蛋臉臉型。

圖片

妝容

在妝容上,嘗試融入電商熱賣(mài)元素-火苗,來(lái)進(jìn)行面部彩繪,呼應(yīng)電商直播間虛擬助理的身份。

圖片

頭發(fā)

五官和妝容確定后,開(kāi)始做她的頭發(fā),長(zhǎng)短適中的中長(zhǎng)發(fā)(量感適中)、發(fā)尾微微外卷俏皮柔美(曲直適中)、高顱頂發(fā)型蓬松透氣。

圖片

到這里,咱們面貌的部分就告一段落了,親和力的五官,并不是說(shuō)每一個(gè)五官都要量感小、曲度適中;咱們圍繞業(yè)務(wù)場(chǎng)景、身份與功能,科學(xué)的創(chuàng)造虛擬形象,需注重五官與臉型的比例,和五官之間的相互搭配。

穿搭

第三步,是穿搭的設(shè)定,以上體型和面貌量感/曲直的設(shè)定,與穿衣風(fēng)格有著密不可分的關(guān)系。我們以修身得體為方向,嘗試了優(yōu)雅的輕熟風(fēng)、服務(wù)型身份的職業(yè)裝、以及休閑百搭的休閑裝-T恤和牛仔褲;因輕熟風(fēng)的連衣裙便利性差,職業(yè)裝略過(guò)正式有距離感,最終選擇休閑裝即適用于多品類直播間場(chǎng)景,又給人親和感拉近距離。

圖片

b)舉止優(yōu)雅

根據(jù)虛擬助理的六大服務(wù)場(chǎng)景,定義優(yōu)雅的肢體語(yǔ)言,在與和用戶交流時(shí),從肢體語(yǔ)言(站姿、手勢(shì)、頭部、眼神、面部表情….)中流露出周到的禮節(jié)、細(xì)致的行為,給予用戶友好的指引與反饋。

圖片

c)表情生動(dòng)

咱們按照?qǐng)鼍鞍鸦厩榫w劃分為快樂(lè)、傷感兩類;歡迎/引導(dǎo)/收到贊的正向行為,表現(xiàn)為快樂(lè)的微笑;答不上來(lái)問(wèn)題和收到踩的負(fù)向行為,表現(xiàn)為傷感的噘嘴/皺眉,避免使用帶有攻擊性的(悲痛、憤怒、憎恨)。

圖片圖片

 

寫(xiě)在最后

美國(guó)心理學(xué)教授艾伯特·馬伯藍(lán)比提出73855定律:人們對(duì)一個(gè)人的印象,有7%來(lái)自于說(shuō)話的內(nèi)容,38%來(lái)自于說(shuō)話的語(yǔ)調(diào),55%來(lái)自外型與肢體語(yǔ)言;虛擬形象想要擁有豐富的表現(xiàn)力,既要注重形象、舉止、表情的雕琢,也要注重聲音的音色/語(yǔ)調(diào)/語(yǔ)速、語(yǔ)言的話術(shù)的呈現(xiàn)。彼時(shí),虛擬數(shù)字人來(lái)到了聚光燈下,窺見(jiàn)巨大的商業(yè)潛力;MEUX將持續(xù)探索屬于自身的“造人”之路。
 

作者: 富媒體用戶體驗(yàn) 

轉(zhuǎn)載請(qǐng)注明:學(xué)UI網(wǎng)》百度直播丨塑造親和力的直播間虛擬助理形象

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國(guó)內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長(zhǎng)學(xué)習(xí),請(qǐng)加藍(lán)小助,微信號(hào):ben_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。


分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。


藍(lán)藍(lán)設(shè)計(jì)www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)、UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司



快來(lái)看看這些小功能里面的設(shè)計(jì)驚喜

seo達(dá)人

一、【抖音】點(diǎn)贊功能情感化設(shè)計(jì)

在七夕期間使用抖音APP點(diǎn)贊時(shí),圖標(biāo)會(huì)變成玫瑰花符號(hào),多次點(diǎn)擊會(huì)出現(xiàn)滿屏的玫瑰花,讓點(diǎn)贊設(shè)計(jì)變得更加趣味化。并且與同類競(jìng)品在點(diǎn)贊的交互設(shè)計(jì)細(xì)節(jié)上產(chǎn)生差異化,給用戶帶來(lái)與節(jié)日相關(guān)聯(lián)的,更加豐富的視覺(jué)和感官的觸動(dòng)。該設(shè)計(jì)方案不僅提高產(chǎn)品的調(diào)性與用戶體驗(yàn),并且與用戶在節(jié)日情感上產(chǎn)生更深的共鳴。

圖片

 

二、【飛書(shū)】左側(cè)聊天框交互設(shè)計(jì)探索

飛書(shū)作為一個(gè)辦公協(xié)作平臺(tái),在解決團(tuán)隊(duì)溝通效率方面下足了功夫。鑒于人們?cè)谡J(rèn)真閱讀某些信息時(shí),通常是從左到右、從上到下的瀏覽習(xí)慣,飛書(shū)的聊天信息全都靠左排列也正好印證了這一點(diǎn),一改往常閑聊時(shí)較為隨意的習(xí)慣,不僅能潛移默化的暗示用戶在交流過(guò)程中該有的工作態(tài)度,還能提高其專注度、以及團(tuán)隊(duì)之間的溝通效率。

在使用場(chǎng)景中,用戶可以把工作的聊天記錄當(dāng)成文檔來(lái)看待,減少與工作無(wú)關(guān)的聊天內(nèi)容,使得聊天記錄就是會(huì)議紀(jì)要。

用戶也可以通過(guò)飛書(shū)的設(shè)置,自由地更改聊天消息的左右排布。使不習(xí)慣于左側(cè)聊天排布的用戶調(diào)整的自由,減少這類型用戶的排斥心理反應(yīng)。

圖片

 

三、【閑魚(yú)】賣(mài)閑置圖標(biāo)場(chǎng)景設(shè)計(jì)

閑魚(yú)將“賣(mài)閑置”的駝峰標(biāo)簽欄設(shè)計(jì)成“電風(fēng)扇”的動(dòng)態(tài)圖標(biāo)形式,結(jié)合近期高溫天氣,給用戶帶來(lái)心理上涼爽的使用體驗(yàn)。

圖片

 

四、【每平每屋】加入話題圈卡片動(dòng)效設(shè)計(jì)

每平每屋的話題圈添加卡片,做成了非常有意思的ip人物撥弄+號(hào)的動(dòng)效。在視覺(jué)上起到了強(qiáng)調(diào)的作用,也能驅(qū)動(dòng)用戶的好奇心和體驗(yàn)心,增加話題圈的點(diǎn)擊率和加入率,讓加入圈子這件事變得輕松有趣。

圖片

 

五、【Snapchat】角色創(chuàng)建功能應(yīng)用設(shè)計(jì)

在Snapchat中角色創(chuàng)建完成后,在相應(yīng)的應(yīng)用功能界面,則會(huì)替換成用戶的專屬角色。

如:地圖界面、表情包界面、引導(dǎo)界面以及視頻流界面。

該設(shè)計(jì)以專屬角色代替用戶視角,通過(guò)讓專屬角色深入的參與每一個(gè)功能來(lái)提高用戶粘性,以及用戶存在感和歸屬感。

圖片

 

六、【Snapchat】底部欄故事功能設(shè)計(jì)

Snapchat將故事視頻流設(shè)計(jì)成了視頻“合集”,用戶點(diǎn)開(kāi)視頻,通過(guò)下滑或者點(diǎn)擊創(chuàng)作者的名稱來(lái)關(guān)注或者查看不同的視頻合集。視頻合集分為xx季xx集,方便用戶快速篩選。

另一個(gè)不同于普遍的視頻功能設(shè)計(jì)點(diǎn)中,Snapchat將單擊視頻【暫?!康墓δ茉O(shè)計(jì)成了單擊【快進(jìn)】,視頻切換則是左右切換。對(duì)于中國(guó)用戶,需要時(shí)間來(lái)適應(yīng)不同的交互習(xí)慣。

圖片

 

七、【Gravity】頭像裝扮設(shè)計(jì)探索

在Gravity這款社交軟件中,用戶無(wú)法使用設(shè)置頭像功能,產(chǎn)品將用戶系統(tǒng)角色替代照片頭像。在軟件中模糊用戶的頭像存在感,使用戶發(fā)出的內(nèi)容成為社交重點(diǎn),塑造一個(gè)半匿名社交平臺(tái)的屬性。而角色商城的裝扮,則滿足了用戶頭像多樣性的選擇,同時(shí)通過(guò)這種方式提高了產(chǎn)品變現(xiàn)的能力。

圖片

 

八、【Gravity】角色場(chǎng)景界面

在Gravity的角色場(chǎng)景界面中,用戶可以根據(jù)心情、生活、興趣等場(chǎng)景來(lái)切換自己的展示形象。也可以邀請(qǐng)好友進(jìn)入自己的場(chǎng)景界面,形成一個(gè)動(dòng)態(tài)的“朋友圈”,通過(guò)切換場(chǎng)景來(lái)表示自己最近的狀態(tài)和生活。動(dòng)態(tài)朋友圈的建立能夠增加用戶與用戶之間的聯(lián)系,增強(qiáng)用戶對(duì)平臺(tái)的粘性。

圖片

 

九、【羊駝日語(yǔ)】首頁(yè)卡片功能設(shè)計(jì)

羊駝日語(yǔ)的首頁(yè)不同于其他APP,摒棄了首頁(yè)頭部banner或者金剛區(qū)的設(shè)計(jì)方法,羊駝日語(yǔ)將動(dòng)漫風(fēng)融合進(jìn)APP的設(shè)計(jì)風(fēng)格中,將首頁(yè)的卡片區(qū)動(dòng)漫人物做主要突出。新穎的設(shè)計(jì)讓用戶眼前一亮的同時(shí)將思維引導(dǎo)到卡片功能上去,引導(dǎo)用戶進(jìn)行點(diǎn)擊,提升學(xué)習(xí)率。

圖片

 

十、【型影】構(gòu)圖姿勢(shì)輔助功能設(shè)計(jì)

如果你拍照總是肢體僵硬,不會(huì)擺姿勢(shì),那你一定要下載這個(gè)APP。

型影APP的構(gòu)圖姿勢(shì)由創(chuàng)作者提供,內(nèi)含幾千種不同場(chǎng)景不同姿勢(shì)的構(gòu)圖擺拍。

只需要點(diǎn)擊你喜歡的同款照片,打開(kāi)相機(jī),視頻中的輔助線能夠幫助你一比一復(fù)刻博主同款poss!

圖片


作者:黑馬青年

轉(zhuǎn)載請(qǐng)注明:學(xué)UI網(wǎng)》快來(lái)看看這些小功能里面的設(shè)計(jì)驚喜

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國(guó)內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長(zhǎng)學(xué)習(xí),請(qǐng)加藍(lán)小助,微信號(hào):ben_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。


分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。


藍(lán)藍(lán)設(shè)計(jì)www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司



火出圈的《羊了個(gè)羊》,到底做了什么?

seo達(dá)人


圖片

幾輪信息傳播下來(lái),我的好奇心就這么被激起來(lái)了。于是到小程序里找到游戲,玩了幾把。最直觀的感覺(jué)就是“確實(shí)難度很高”,而且與之前的玩過(guò)的游戲還真有點(diǎn)不一樣。

 

一、產(chǎn)品玩法

1、門(mén)檻低

本質(zhì)上來(lái)說(shuō),《羊了個(gè)羊》是一款消消樂(lè)游戲。消消樂(lè)的特點(diǎn)就是門(mén)檻低,沒(méi)有復(fù)雜的操作,用戶只要點(diǎn)幾下就可以了。第一關(guān)太簡(jiǎn)單了,更多的是為了教學(xué)而服務(wù)的。也正是因?yàn)楹?jiǎn)單,我不知道“卡槽里的3個(gè)相同的卡牌,即使不相鄰也是可以消除的”,不過(guò)玩了幾局后我就明白了。

圖片

2、單局時(shí)間短

微信小游戲有一個(gè)特點(diǎn)就是時(shí)間短,用戶可以隨進(jìn)隨出,單局不會(huì)占用太多的用戶時(shí)間,但是玩起來(lái)后也容易上癮。這似乎與短視頻非常相似,本想著只看一個(gè)視頻,也就3-5分鐘,不會(huì)浪費(fèi)太多時(shí)間,但是一旦開(kāi)始了,根本停不下來(lái)。

前幾天,在我兒子的引導(dǎo)下,玩了一個(gè)賽車游戲。剛開(kāi)始想就玩一局,結(jié)果是一局接一局,中秋放假2個(gè)晚上都玩到了深夜。

3、難度高

《羊了個(gè)羊》與傳統(tǒng)的消消樂(lè)游戲又有些不同,增加了疊牌設(shè)計(jì)、卡槽消除玩法??雌饋?lái)簡(jiǎn)單,玩起來(lái)實(shí)際上非常燒腦。

疊牌的玩法就是用戶必須要消除上層的卡牌,才能激活下層卡牌。有了消除的先后順序,就要求用戶必須有一定的策略,才可能通關(guān)。

卡槽用來(lái)放置用戶選擇的卡牌,卡槽中出現(xiàn)了3個(gè)一樣圖案的卡牌則可以消除,當(dāng)卡槽滿了,也就意味游戲失敗。即使卡池上存在3個(gè)一樣圖案的卡牌,但是卡槽中沒(méi)有了空位,游戲仍然失敗。

圖片

所以用戶不僅要關(guān)注卡池中的卡牌層級(jí),還要關(guān)注卡槽中卡牌情況。

因此,游戲在宣傳方面打出了“通關(guān)率只有0.1%”的口號(hào)。為什么搞這么高的游戲難度呢?

 

二、第二關(guān)都過(guò)不去的難度

任何游戲都必須要有一定的難度,否則用戶玩幾局就會(huì)覺(jué)得“缺乏挑戰(zhàn)性,沒(méi)意思”。但是只到第二關(guān)的難度,我也是第一次見(jiàn)。這種難度給游戲帶了什么呢?

1、話題性帶來(lái)流量

雖然很多游戲會(huì)有獲得成就引導(dǎo)分享,或者分享朋友圈、好友圈復(fù)活玩法等等,但是用戶要么不做分享,或者都是非常被動(dòng)的分享。而這次用戶發(fā)朋友圈,或許都是主動(dòng)而為。

最大的引爆點(diǎn)就是游戲難度,有難度才會(huì)有話題性,用戶才有分享和互動(dòng)的欲望,才能引起更多人的關(guān)注。而朋友圈、分析文章、短視頻各種渠道掀起的話題,肯定為游戲帶來(lái)相當(dāng)大的用戶流量。

2、用戶挑戰(zhàn)欲望

如果有人對(duì)你說(shuō),“有款消消樂(lè)游戲挺好玩的,要不要試試?”,你也許只會(huì)微微一笑,甚至嗤之以鼻。

但是如果有人對(duì)你說(shuō),“有款消消樂(lè)游戲,你第二關(guān)都過(guò)不去”。你會(huì)怎樣?

大概率想“怎么可能呢?我要挑戰(zhàn)一下”。用戶嘗試的欲望就起來(lái)了。結(jié)果,用戶越是挑戰(zhàn)不成功,越想挑戰(zhàn)。

3、方便廣告植入

游戲難度最終是商業(yè)化服務(wù)的,用戶多次嘗試后不成功,就會(huì)求助道具或者啟用一次復(fù)活機(jī)會(huì)。特別是單局已經(jīng)投入了較多的時(shí)間成本,眼看快要成功通關(guān)的關(guān)鍵時(shí)刻,沉沒(méi)成本促使大多數(shù)用戶犧牲30秒的廣告時(shí)間,換取一次復(fù)活的機(jī)會(huì)。

只要看廣告的人越多,錢(qián)也就賺得越多,游戲的難度也是為了“如何讓玩家看更多廣告”而服務(wù)的。

圖片

4、減少游戲投入

對(duì)于游戲這種產(chǎn)品來(lái)說(shuō),真正的熱度應(yīng)當(dāng)來(lái)自于游戲內(nèi)容,以及其帶給玩家精神層次的愉悅體驗(yàn)、世界觀、價(jià)值觀構(gòu)筑等方面;而游戲公司通過(guò)制作優(yōu)質(zhì)內(nèi)容的游戲,獲取商業(yè)利益,再持續(xù)開(kāi)發(fā)更多游戲吸引更多關(guān)注。

所以傳統(tǒng)的關(guān)卡游戲可能是幾十上百關(guān),甚至更多,大家也都習(xí)以為常了。隨著關(guān)卡增加,游戲會(huì)慢慢加入新的玩法,吸引用戶不斷地玩下去,最終讓用戶長(zhǎng)期上癮。希望像擠奶牛一樣,持續(xù)性地挖掘用戶的價(jià)值。

《羊了個(gè)羊》則完全反其道而行之。

似乎是考慮到當(dāng)下小程序游戲非常容易相互模仿。一旦一款游戲火了,之后就會(huì)冒出各種相似的游戲,就會(huì)面臨激烈的競(jìng)爭(zhēng)。所以《羊了個(gè)羊》改變了游戲策略,通過(guò)拉高關(guān)卡難度,讓用戶一直停留在第二關(guān)(也許有更多關(guān),因?yàn)槲覜](méi)有玩過(guò)第二關(guān)),從而減少游戲的開(kāi)發(fā)成本。

這種更像是快餐模式,不用過(guò)多地?fù)?dān)心游戲風(fēng)潮會(huì)過(guò)去,也不用擔(dān)心用戶流失,畢竟游戲的投入并不高。

而一些當(dāng)時(shí)風(fēng)靡一時(shí)的小游戲,例如“跳一跳”、“打紙飛機(jī)”、“旅行青蛙”等,確實(shí)在大火之后迅速降溫。想想自己這幾年也曾經(jīng)玩過(guò)一些小游戲,不過(guò)基本上都是“3分鐘熱度”,玩一段時(shí)間就放棄了。

或許這也是《羊了個(gè)羊》拔高游戲難度的一個(gè)原因吧。

 

三、關(guān)于激勵(lì)機(jī)制

當(dāng)然,在《羊了個(gè)羊》游戲中也有傳統(tǒng)游戲必備的激勵(lì)機(jī)制。例如有省區(qū)代表隊(duì)排名,“最強(qiáng)王者”等榮譽(yù)勛章稱號(hào)。但這些激勵(lì)機(jī)制在目前的階段,似乎并不重要,通關(guān)成為了用戶最大的目標(biāo)。用馬斯洛需求層次理論來(lái)解釋就更加合理了,溫飽還沒(méi)解決,談什么個(gè)人榮譽(yù)呢?

用戶當(dāng)前最大的需求就是“該如何沖過(guò)第二關(guān)”。

圖片

以上就是我的一些思考,歡迎大家評(píng)論區(qū)留言交流~


作者:子牧先生

轉(zhuǎn)載請(qǐng)注明:學(xué)UI網(wǎng)》火出圈的《羊了個(gè)羊》,到底做了什么?

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國(guó)內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長(zhǎng)學(xué)習(xí),請(qǐng)加藍(lán)小助,微信號(hào):ben_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。


分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。


藍(lán)藍(lán)設(shè)計(jì)www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)、UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司



怎樣解決設(shè)計(jì)好看又符合市場(chǎng)需求的問(wèn)題?

seo達(dá)人


在商業(yè)設(shè)計(jì)中,好看和有效按理來(lái)說(shuō)應(yīng)該是一體的,因?yàn)槊撾x了市場(chǎng)需求的好看沒(méi)有意義,而設(shè)計(jì)師所做的工作就是要解決降低傳播成本的問(wèn)題,通過(guò)專業(yè)的審美和技巧讓設(shè)計(jì)更美觀,也是為了滿足市場(chǎng)需求、達(dá)到更好的傳播效果。

舉個(gè)例子,在一張產(chǎn)品海報(bào)中,最好不要讓一個(gè)產(chǎn)品孤零零的“飄”在海報(bào)上,而應(yīng)該加一些元素與產(chǎn)品進(jìn)行組合,以強(qiáng)調(diào)產(chǎn)品的功能屬性和行業(yè)屬性等;或者搭建一個(gè)場(chǎng)景加強(qiáng)氛圍感;又或者加上用戶以加強(qiáng)代入感。這些處理手段都是從設(shè)計(jì)的功能性來(lái)考慮的,但是出來(lái)的視覺(jué)效果確實(shí)也會(huì)比只擺放產(chǎn)品要更好看。

圖片

圖片

比如上面兩張海報(bào),忽略畫(huà)面中的文案意思和尺寸,單純從設(shè)計(jì)上來(lái)看,很明顯圖二更好看,也更有帶入感和氛圍感,所以相比之下,圖二更符合市場(chǎng)需求。

而如果不出于對(duì)市場(chǎng)的考慮,只要做到美觀,那么我們就可以在產(chǎn)品周圍加很多花哨的元素,甚至把產(chǎn)品和文案盡量縮小,讓裝飾元素作為主導(dǎo),這樣可能更好看,但是產(chǎn)品和文案被搶了風(fēng)頭,消費(fèi)者的關(guān)注點(diǎn)都在裝飾元素上,導(dǎo)致最終效果可能會(huì)大打折扣,這就是不符合市場(chǎng)需求的好看?,F(xiàn)在很多國(guó)內(nèi)的電商設(shè)計(jì)在這一方面有比較明顯的問(wèn)題。

圖片

還有一個(gè)老生常談的問(wèn)題,就是關(guān)于中文和英文的排版問(wèn)題,我們都知道用英文排版更容易做出好看、洋氣的版面,所以現(xiàn)在的很多海報(bào)中都會(huì)有英文。

其實(shí)適當(dāng)加一點(diǎn)英文進(jìn)行輔助也沒(méi)什么不好,畢竟我們可以把英文當(dāng)成是與產(chǎn)品或主題相關(guān)的元素,既然圖形能做裝飾元素,那么文字也可以,何況現(xiàn)在國(guó)人整體的英文水平也有所提高,國(guó)內(nèi)也有不少國(guó)外友人。

圖片

但主次問(wèn)題一定要把握好,既然是國(guó)產(chǎn)品牌,目標(biāo)群體又是普通的國(guó)內(nèi)大眾,以中文為主、突出中文才是符合市場(chǎng)需求的。著重突出英文或許會(huì)更加好看,但同時(shí)也會(huì)弱化中文,那么傳播成本就提高了,甚至還會(huì)讓消費(fèi)者懷疑,在這些看不懂的英文里是不是隱藏了一些對(duì)他們不利的信息,所以這種做法并不可取,客戶通常也接受不了。

 

二、并不是丑的設(shè)計(jì)就有效

有很多設(shè)計(jì)師會(huì)習(xí)慣性的以為,好看的設(shè)計(jì)就是花里胡哨的、沒(méi)有效果的;而丑的設(shè)計(jì)就是接地氣的、有效果的、符合市場(chǎng)需求的,甚至喜歡把符合市場(chǎng)需求當(dāng)成設(shè)計(jì)不好看的借口,這絕對(duì)是一個(gè)誤區(qū)。

比如有些人覺(jué)得椰樹(shù)牌椰汁包裝很有效,是因?yàn)樗?,其?shí)美與丑只是個(gè)人的視覺(jué)感受,美丑之下傳遞了什么信息、達(dá)到了怎樣的效果才是關(guān)鍵。椰樹(shù)椰汁的包裝之所以有效,不是因?yàn)樗?,而是因?yàn)樗灰粯?,還有它把包裝本身當(dāng)成了廣告媒體,大量宣傳了它的利益點(diǎn)。

圖片

想象一下,如果一開(kāi)始的包裝就請(qǐng)?jiān)O(shè)計(jì)師按照這種思路精心排版一番,做好看、做時(shí)尚一點(diǎn),效果難道會(huì)比這個(gè)差嗎?應(yīng)該不會(huì)吧,而且可能年輕人會(huì)更喜歡,更敢于拿著它走在大街上。

圖片

圖片

▲ 上圖是網(wǎng)友自發(fā)設(shè)計(jì)的包裝。

 

還有的人覺(jué)得有效的設(shè)計(jì)就是把文字和圖片都盡可能地放大、把重點(diǎn)文字填充成大紅色,邏輯是面積占比大了、顏色不一樣了,自然更容易被看到、更容易閱讀,所以更有效。而事實(shí)上不一定,原因有三。

? 如果所有信息都大、都突出,那么就等于沒(méi)有重點(diǎn),消費(fèi)者在有限的時(shí)間里不知道該看什么。

? 如果文字和圖片都大,那么留白空間就會(huì)減少,版面太擁擠就會(huì)加大閱讀的難度。

? 如果因?yàn)樵靥?、紅色強(qiáng)調(diào)的信息太多,從而導(dǎo)致畫(huà)面變得很難看,那么可能會(huì)引起消費(fèi)者反感,從而放棄閱讀信息,甚至是損害品牌的形象。

下圖是蔥爺在一家超市門(mén)口看到的海報(bào),文字都很大,版面得到了充分利用,也用顏色突出了重點(diǎn)信息,但是效果很好嗎?不一定吧,如果合理美化一下是不是能得到更好的效果。

圖片

把重點(diǎn)信息放大、用紅色突出也沒(méi)有錯(cuò),但突出信息的方式不只有這兩種,以不變應(yīng)萬(wàn)變的種做法很偷懶,效果也不會(huì)太好。

 

三、如何在符合市場(chǎng)需求的基礎(chǔ)上盡量做好看?

1、加強(qiáng)氛圍感

即把產(chǎn)品或主題的屬性加強(qiáng),比如科技產(chǎn)品的設(shè)計(jì)要有很強(qiáng)的科技感、食品海報(bào)要有很強(qiáng)的食欲、運(yùn)動(dòng)海報(bào)要有動(dòng)感和放飛自我的感覺(jué)。加強(qiáng)氛圍感的主要方式有增加場(chǎng)景、增加光影、填充大面積的顏色、增加與產(chǎn)品相關(guān)的素材等等。

加強(qiáng)氛圍感強(qiáng)可以使設(shè)計(jì)在視覺(jué)上變得更美觀,但基本不會(huì)影響到原來(lái)信息的可讀性、產(chǎn)品也不會(huì)被搶風(fēng)頭,這樣的設(shè)計(jì)會(huì)更有帶入感,更能促進(jìn)消費(fèi)者采取行動(dòng)。

圖片

圖片

比如在上面的兩則banner中,圖二在圖一的基礎(chǔ)上增加了背景色和光影,氛圍感增強(qiáng)了很多,同時(shí)視覺(jué)上也更好看了。

 

2、加強(qiáng)設(shè)計(jì)的形式感

比如使用一種新穎的構(gòu)圖方式、新設(shè)計(jì)風(fēng)格、新的創(chuàng)意表現(xiàn)、新的元素組合方式等,有形式感的設(shè)計(jì)會(huì)更整體、更特別。當(dāng)然,在視覺(jué)上也會(huì)比沒(méi)有形式感的設(shè)計(jì)更美觀、更具視覺(jué)沖擊力。

圖片

 

3、有主次、有層級(jí)

產(chǎn)品和重要信息當(dāng)然可以突出,但不能盲目地突出,而是要按信息的重要程度和邏輯關(guān)系來(lái)安排信息的層級(jí)關(guān)系,引導(dǎo)消費(fèi)者高效閱讀信息。

圖片

 

4、設(shè)計(jì)手段不要太單一

比如為了突出重點(diǎn)信息,我們除了放大字體還可以采用其他手法,還可以加強(qiáng)字體對(duì)比、空間對(duì)比、方向?qū)Ρ取⒖臻g對(duì)比、留白對(duì)比、風(fēng)格對(duì)比、點(diǎn)線面對(duì)比等手段,照樣能起到突出的作用。而且手法豐富了以后,視覺(jué)就不會(huì)那么單調(diào),從而也會(huì)好看很多。

圖片

圖片

▲ 圖二比圖一 的設(shè)計(jì)手法就要豐富一些。

 

5、細(xì)節(jié)要精致

在設(shè)計(jì)大方向做得不錯(cuò)的情況下,如果再加強(qiáng)細(xì)節(jié)的處理,那么其美觀性也可以得到很大提升。比如把標(biāo)題做一下字體設(shè)計(jì)、把圖片精修一下、顏色搭配在整體和諧的基礎(chǔ)上增加一點(diǎn)新意、排版用網(wǎng)格系統(tǒng)規(guī)范一下等等。

 

比如在上圖的兩張海報(bào)中,圖二在圖一的基礎(chǔ)上做了圖片美化、網(wǎng)格規(guī)范排版、色彩優(yōu)化等細(xì)節(jié)調(diào)整,視覺(jué)上也更美觀了,甚至也更符合市場(chǎng)需求了。

 

圖片

想要設(shè)計(jì)既能滿足市場(chǎng)需求又能滿足審美需求,確實(shí)不是一件容易的事情,因?yàn)樵O(shè)計(jì)不是數(shù)學(xué),沒(méi)有標(biāo)準(zhǔn)答案,如何把握好這個(gè)度,如何讓兩者完美結(jié)合達(dá)到最好的效果,是需要設(shè)計(jì)師去反復(fù)探索和嘗試的,但毫無(wú)疑問(wèn),它們是可以共存的,而且應(yīng)該共存。


作者:蔥爺

轉(zhuǎn)載請(qǐng)注明:學(xué)UI網(wǎng)》怎樣解決設(shè)計(jì)好看又符合市場(chǎng)需求的問(wèn)題?

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國(guó)內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長(zhǎng)學(xué)習(xí),請(qǐng)加藍(lán)小助,微信號(hào):ben_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。


分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。


藍(lán)藍(lán)設(shè)計(jì)www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 平面設(shè)計(jì)服務(wù)、UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司



嗨皮出行 APP 全新 V2.0 設(shè)計(jì)總結(jié)

seo達(dá)人


圖片

圖片

圖片

圖片

圖片

圖片

圖片

圖片

圖片

圖片

圖片

圖片

圖片


作者:黑馬青年

轉(zhuǎn)載請(qǐng)注明:學(xué)UI網(wǎng)》嗨皮出行 APP 全新 V2.0 設(shè)計(jì)總結(jié)

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國(guó)內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長(zhǎng)學(xué)習(xí),請(qǐng)加藍(lán)小助,微信號(hào):ben_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。


分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。


藍(lán)藍(lán)設(shè)計(jì)www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)、UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司



需求太朦朧,設(shè)計(jì)師如何拆招?

seo達(dá)人


 

圖片
圖片 
先舉一個(gè)栗子,如果你正在進(jìn)出地鐵口,迎面而來(lái)的是一張信息繁雜,需要解讀時(shí)間較長(zhǎng)的海報(bào)廣告,你是否會(huì)駐足觀看?

圖片

除了部分“犯職業(yè)病”的同學(xué)可能會(huì)研究一下,絕大多數(shù)人可能并不會(huì)耗費(fèi)時(shí)間去解析,因此這個(gè)海報(bào)也就失去了傳播信息的價(jià)值。

圖片

或許設(shè)計(jì)師在設(shè)計(jì)這張海報(bào)時(shí)運(yùn)用了某種創(chuàng)意,但因?yàn)?strong>對(duì)場(chǎng)景限制的欠考慮或者并未提前了解投放地點(diǎn),而沒(méi)能達(dá)到預(yù)期效果,的確有點(diǎn)兒得不償失。

圖片

因此,在開(kāi)始著手設(shè)計(jì)前,建議設(shè)計(jì)同學(xué)要和AE或客戶確認(rèn)好目標(biāo)用戶、使用場(chǎng)景和時(shí)間節(jié)點(diǎn)等關(guān)鍵信息。只有在思考到這些之后,才能盡量確保自己的設(shè)計(jì)能真正助力品牌或一場(chǎng)營(yíng)銷活動(dòng)。 

 

圖片

?  它被廣泛用于企業(yè)管理和創(chuàng)意設(shè)計(jì),對(duì)于從不同角度發(fā)散設(shè)計(jì)思維很有幫助,同時(shí)也助于彌補(bǔ)設(shè)計(jì)產(chǎn)出的疏漏,讓你的設(shè)計(jì)工作更成體系。

圖片

圖片
? 在參與項(xiàng)目時(shí),這些信息點(diǎn)可能不會(huì)完整的給到,這就需要我們主動(dòng)進(jìn)行提問(wèn)、了解。有時(shí),提出一個(gè)好的問(wèn)題,就意味著完成了“一半”的工作。收集到的“情報(bào)”越多,也越有利于提高出品的準(zhǔn)確性、合理性。

 

圖片 

? 那么當(dāng)下次有一張“你看著設(shè)計(jì)就行”的海報(bào)需求時(shí),你通過(guò)對(duì)它進(jìn)行拆解,可能得到的答案是——為迎接雙十一,客戶要在商場(chǎng)電梯兩側(cè),做產(chǎn)品促銷廣告,希望通過(guò)更優(yōu)惠的價(jià)格吸引人購(gòu)買(mǎi)的海報(bào)了。

 

圖片

圖片

圖片

 

圖片

? 我的建議是延續(xù)品牌調(diào)性走,至少也要跟著所屬品類的調(diào)性走。因?yàn)椴煌袠I(yè)、品類的風(fēng)格是有差異的,比如:快消品可能要傳達(dá)很“嗨”的感受、奢侈品要很有高冷feel等… 

 

一般情況下,我們不能用做快消品海報(bào)的風(fēng)格來(lái)設(shè)計(jì)奢侈品海報(bào)。 

圖片

? 這是我瀏覽網(wǎng)頁(yè)時(shí)偶然見(jiàn)到的一個(gè)例子,可能比較極端,但這里想建議大家的是,在開(kāi)始設(shè)計(jì)前,可以先大概看一下服務(wù)品牌以往的視覺(jué)調(diào)性,了解行業(yè)、品類的視覺(jué)特點(diǎn),做到心中有數(shù),這樣即使在沒(méi)有明確需求時(shí),我們至少也能做到盡量不跑偏。 

 

 

圖片

圖片

“字再大點(diǎn)兒”這幾個(gè)字在商業(yè)設(shè)計(jì)上“戰(zhàn)功卓著”,引無(wú)數(shù)設(shè)計(jì)同仁競(jìng)折腰…把字放大和設(shè)計(jì)師對(duì)審美的堅(jiān)持,有辦法調(diào)和么?面對(duì)諸如此類的“設(shè)計(jì)需求”,我們可以如何拆招呢? 

圖片

? 我認(rèn)為最關(guān)鍵的點(diǎn)落在這個(gè)詞上——翻譯。當(dāng)客戶說(shuō)他沒(méi)有別的需求,把字再放大一些就行時(shí),你確認(rèn)只是字面上的意思么?其實(shí)大部分情況下好像并不是,他雖然表述不出來(lái),但內(nèi)在的意思有可能是再醒目一些、一眼就能看見(jiàn)。

 

圖片

? 我們來(lái)看一個(gè)案例。提交第一張圖時(shí),客戶反饋?zhàn)诌€要放大,但這里我們嘗試換一種思路來(lái)處理這個(gè)需求。

 

圖片

? 原圖的字號(hào)我們保持不變,把顏色重新調(diào)整一下。通過(guò)更簡(jiǎn)明、醒目的方式,讓其傳播信號(hào)的能力更強(qiáng),從而達(dá)到客戶的真實(shí)目的。

 

 

圖片

? 除了顏色上的調(diào)整,也可以通過(guò)對(duì)文字的重新布局,達(dá)到“字要大”的需求。

 

圖片
? 上面第一張圖是我在網(wǎng)上找到的一個(gè)案例,但因?yàn)樗男芯嗪妥志嘞嘟?,所以讓人閱讀起來(lái)非常困難。我只是在它字號(hào)不變的基礎(chǔ)上調(diào)整了字距,這樣看起來(lái)信息就清晰了很多,相應(yīng)的傳播的信號(hào)也有所增強(qiáng)。

圖片

以上兩個(gè)例子雖然都沒(méi)有直接按照需求把字放大,但同樣能達(dá)到客戶的預(yù)期,因?yàn)橥ㄟ^(guò)這些變化,我們實(shí)現(xiàn)了更醒目,傳播信號(hào)更強(qiáng)的目的。

 

 

圖片

除了字要大,“沒(méi)有品質(zhì)感”應(yīng)該也是讓各位設(shè)計(jì)同學(xué)經(jīng)常撓頭的反饋了…按照上面所講,我們來(lái)嘗試翻譯下這個(gè)需求。

? 品質(zhì)感本身是一個(gè)比較模糊的、虛擬的、對(duì)設(shè)計(jì)作品綜合性的評(píng)價(jià)??梢詮膬蓚€(gè)方向去理解,“品”一般是指物體的品相、細(xì)節(jié),而“質(zhì)”則代表物品所傳達(dá)出的感受、氣質(zhì)。

 

圖片

? 我們來(lái)看一下大眾比較認(rèn)可的具有較高品質(zhì)感的蘋(píng)果產(chǎn)品的頁(yè)面設(shè)計(jì),通過(guò)加入一些光影以及漸變、材質(zhì),使產(chǎn)品看起來(lái)更加真實(shí)、細(xì)膩。這也是非常值得我們借鑒的。

 

圖片 
 
? 通常我們?cè)趌ogo提案中,會(huì)給甲方展示一些logo的樣機(jī)貼圖。這樣能讓客戶更直觀的感受到logo的具體應(yīng)用效果。但如果樣機(jī)的材質(zhì)不夠真實(shí)和細(xì)膩,那么很有可能導(dǎo)致提案的效果大打折扣。比如上方的兩個(gè)樣機(jī)貼圖,我們就能很明顯的感受到哪一個(gè)更有品質(zhì)感。

 

 

圖片

再來(lái)看一個(gè)比較常見(jiàn)的客戶反饋——“看著不喜慶,想用大紅色”。一般情況下,如果按照這個(gè)訴求直接調(diào)整,可能會(huì)影響整體的美觀性,這個(gè)時(shí)候我們是不是可以嘗試換一個(gè)同色調(diào)的其它顏色呢?

圖片 

? 按照客戶的要求調(diào)整后,雖然看起來(lái)有一些喜慶的氛圍,但畫(huà)面顯得不透氣,并且也和主體的顏色類似,造成畫(huà)面沒(méi)有層次感。

圖片 
 
? 我們換成了同樣具有熱鬧屬性的黃色,不僅能襯托主體,也能傳遞出熱鬧的氛圍,并且提交后,客戶表示符合預(yù)期,非常滿意。

 

 

圖片

圖片  

這是因?yàn)椋m然在各位設(shè)計(jì)同學(xué)眼中,我們使用的是不同的顏色(它們唯一的共性是暖色,即使在簡(jiǎn)版的潘通色卡中,暖色就有上百種),但是很抱歉,它們?cè)诳蛻暨@塊兒,可能統(tǒng)一都被稱為是“大紅色”。 

 

 

圖片

所以,當(dāng)客戶表面上在說(shuō)要喜慶、要大紅色時(shí),我們可以嘗試進(jìn)行需求的翻譯,其內(nèi)在的訴求可能是想傳達(dá)溫暖、親切感;也可能是熱鬧、豪放感…大家可以根據(jù)實(shí)際服務(wù)項(xiàng)目的行業(yè)屬性、風(fēng)格特征等做進(jìn)一步的分析,靈活運(yùn)用。

 

 

寫(xiě)在最后:

圖片

 


作者:大目

轉(zhuǎn)載請(qǐng)注明:學(xué)UI網(wǎng)》需求太朦朧,設(shè)計(jì)師如何拆招?

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國(guó)內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長(zhǎng)學(xué)習(xí),請(qǐng)加藍(lán)小助,微信號(hào):ben_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。


分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。


藍(lán)藍(lán)設(shè)計(jì)www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)、UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司




設(shè)計(jì)師的能力建設(shè)(2):思考能力

seo達(dá)人

一、為什么設(shè)計(jì)師不愿意思考?

每個(gè)人都有自己的思考,只是有些時(shí)候不愿思考。我認(rèn)為主要有以下幾個(gè)原因:

1、個(gè)人定位錯(cuò)誤

B端業(yè)務(wù)脫離了設(shè)計(jì)師的生活場(chǎng)景,設(shè)計(jì)師很難有代入感。日常工作中,主要依靠產(chǎn)品經(jīng)理的輸入。而視覺(jué)出身的設(shè)計(jì)師通常比較感性,不太愿意去了解復(fù)雜的業(yè)務(wù)場(chǎng)景,不想?yún)⒓有枨笤u(píng)審。對(duì)于需求內(nèi)容,設(shè)計(jì)師容易全盤(pán)接受,甘愿只做一名“真正”的設(shè)計(jì)師。

設(shè)計(jì)師不愿意被稱為“美工”,但是現(xiàn)實(shí)中,一些B端設(shè)計(jì)師就是“美工”的角色。產(chǎn)品經(jīng)理給了原型方案,設(shè)計(jì)師按照設(shè)計(jì)規(guī)范潤(rùn)色一下,完成頁(yè)面搭建就可以了。當(dāng)你問(wèn)他為什么這么設(shè)計(jì)時(shí),要么說(shuō)“原型就是這樣的”,要么說(shuō)“為了好看”,就是沒(méi)有自己的思考。

另外新人設(shè)計(jì)師缺乏思考,就容易盲從。當(dāng)年我在設(shè)計(jì)實(shí)習(xí)時(shí),就是如此。一方面?zhèn)€人的設(shè)計(jì)能力比較弱,另一方面缺乏思考,找不到破解途徑。更多的是依靠其他人的輸入,加上缺少自信,更容易聽(tīng)信別人的想法。當(dāng)時(shí)做了一些事情,但似乎又沒(méi)做什么,導(dǎo)致個(gè)人的成長(zhǎng)非常緩慢,甚至?xí)纬蓯盒匝h(huán),給自己也造成了很大的精神壓力。

久而久之,設(shè)計(jì)師的存在感就會(huì)越來(lái)越弱,也會(huì)對(duì)個(gè)人信心造成比較嚴(yán)重的傷害。

2、成就感低

B端產(chǎn)品的頁(yè)面設(shè)計(jì)很多都是流程、數(shù)據(jù),設(shè)計(jì)師主要跟表格,表單打交道。做來(lái)做去,沒(méi)什么新鮮東西。時(shí)間長(zhǎng)了,設(shè)計(jì)師容易失去工作熱情。特別是企業(yè)內(nèi)部的B端中后臺(tái)管理系統(tǒng),用戶量不大,各方面的關(guān)注度不高,用戶體驗(yàn)似乎可有可無(wú),設(shè)計(jì)師就會(huì)產(chǎn)生思考惰性,“就這樣吧~”成為了主流的想法。

另外設(shè)計(jì)師如果只關(guān)注交互和視覺(jué)、受限在設(shè)計(jì)規(guī)范的框架中,設(shè)計(jì)方案就會(huì)流于形式。而產(chǎn)品經(jīng)理基于業(yè)務(wù)需求出發(fā),設(shè)計(jì)方案也很容易被推翻,一遍遍改稿成為家常便飯。如果產(chǎn)品經(jīng)理還懂點(diǎn)交互,那么在他眼中,設(shè)計(jì)師對(duì)產(chǎn)品就沒(méi)有多大的幫助,頂多只是幫忙把原型圖畫(huà)的規(guī)整了一點(diǎn)。

3、團(tuán)隊(duì)氛圍差

很多B端產(chǎn)品對(duì)設(shè)計(jì)工作不夠重視,不會(huì)專門(mén)設(shè)置設(shè)計(jì)團(tuán)隊(duì),所以設(shè)計(jì)師的地位并不高,加之設(shè)計(jì)流程不規(guī)范,產(chǎn)品經(jīng)理有時(shí)會(huì)直接扔一個(gè)原型方案過(guò)來(lái),讓設(shè)計(jì)師照?qǐng)D做設(shè)計(jì),連個(gè)基本的設(shè)計(jì)輸入也沒(méi)有。有些產(chǎn)品經(jīng)理的配合意愿差,設(shè)計(jì)師主動(dòng)溝通時(shí),還會(huì)遭到奚落或者刁難。

經(jīng)驗(yàn)不足的設(shè)計(jì)師碰到這種情況,一時(shí)難以找不到解決方法,就容易自我封閉,索性就放棄努力,完全遵照原型執(zhí)行。畢竟“原型即需求,需求是產(chǎn)品經(jīng)理的職責(zé),我是遵照需求設(shè)計(jì)的,完全沒(méi)問(wèn)題”。一旦有問(wèn)題,設(shè)計(jì)師也有借口搪塞過(guò)去。

4、經(jīng)驗(yàn)主義作祟

經(jīng)驗(yàn)很重要,可以讓設(shè)計(jì)師從容地面對(duì)各種需求。不過(guò)有時(shí)候經(jīng)驗(yàn)主義會(huì)讓設(shè)計(jì)師想當(dāng)然地去理解需求,導(dǎo)致設(shè)計(jì)師犯錯(cuò)。每一個(gè)需求看似相同,但是深究下來(lái),用戶和場(chǎng)景可能已經(jīng)發(fā)生了變化,原有的設(shè)計(jì)形式不再適用了。

競(jìng)品分析可以幫助我們獲得別人的設(shè)計(jì)經(jīng)驗(yàn),不過(guò)這種設(shè)計(jì)經(jīng)驗(yàn)也不一定牢靠。競(jìng)品雖然是相關(guān)性較強(qiáng)的產(chǎn)品,但是產(chǎn)品的定位、市場(chǎng)狀況、用戶和場(chǎng)景還是有所差別的,所以完全照搬競(jìng)品也并不是最優(yōu)的選擇。

當(dāng)我們研究競(jìng)品時(shí),最重要的是剖析競(jìng)品為什么會(huì)這么設(shè)計(jì),而不是只看競(jìng)品是怎么設(shè)計(jì)的。

 

二、設(shè)計(jì)師該如思考呢?

思考的方法有很多??追蜃釉f(shuō)過(guò)“學(xué)而不思則罔,思而不學(xué)則怠”。把思考和學(xué)習(xí)的辯證關(guān)系說(shuō)得很透徹了。

1、思考的深度

“學(xué)而不思則罔”,意思是說(shuō)只學(xué)習(xí)不思考,就不會(huì)很深刻地理解知識(shí)的內(nèi)涵。

當(dāng)我們接到需求時(shí),產(chǎn)品經(jīng)理有時(shí)候會(huì)直接指定一個(gè)競(jìng)品,建議設(shè)計(jì)師直接照搬設(shè)計(jì)內(nèi)容。對(duì)于設(shè)計(jì)師而言,這樣做設(shè)計(jì)肯定比較簡(jiǎn)單。但是對(duì)于設(shè)計(jì)師的成長(zhǎng)沒(méi)有太大意義。設(shè)計(jì)師應(yīng)該深入思考,理解產(chǎn)品背后的設(shè)計(jì)原因。這樣才能將別人的經(jīng)驗(yàn)為自己所用。

另外當(dāng)我們接到需求時(shí),不要立馬動(dòng)手開(kāi)始畫(huà)圖,應(yīng)該先要了解需求的目標(biāo)、需求的用戶場(chǎng)景,對(duì)需求進(jìn)行一番梳理,并與產(chǎn)品經(jīng)理溝通,消除其中的疑問(wèn)點(diǎn)后,再著手開(kāi)始設(shè)計(jì)。

通過(guò)不斷地深入思考,設(shè)計(jì)師就能夠積累出自己的設(shè)計(jì)方法論,也可以幫助設(shè)計(jì)師快速成長(zhǎng)。

2、思考的廣度

其實(shí)狹義的用戶體驗(yàn)設(shè)計(jì)領(lǐng)域并不寬,應(yīng)該說(shuō)是比較窄的。設(shè)計(jì)師局限在自己的專業(yè)領(lǐng)域,很難獲得持續(xù)的成長(zhǎng)。而在工作流程上,設(shè)計(jì)師的需求來(lái)自產(chǎn)品經(jīng)理,如果只依賴產(chǎn)品經(jīng)理的輸入,設(shè)計(jì)師在工作上必然會(huì)非常被動(dòng)。

設(shè)計(jì)師想要獲得足夠的話語(yǔ)權(quán),必須要提高思考的廣度。

1)站在用戶角度思考

設(shè)計(jì)師成長(zhǎng)初期,注意力更多的是做好產(chǎn)品需求,完成設(shè)計(jì)方案。這個(gè)階段最大的問(wèn)題就是“重設(shè)計(jì)、輕業(yè)務(wù)”。設(shè)計(jì)的出發(fā)點(diǎn)局限在設(shè)計(jì)本身,“視覺(jué)只追求好看,交互只關(guān)注控件或者操作邏輯”。

我剛?cè)胄袝r(shí)就是這樣,來(lái)了需求就做,不會(huì)問(wèn)需求的價(jià)值,不去思考用戶關(guān)注什么,用戶場(chǎng)景是什么,主要就是為了完成設(shè)計(jì)任務(wù)。工作精力只是停留在與產(chǎn)品開(kāi)發(fā)討論控件形式,操作方式、操作流程點(diǎn)擊次數(shù)等。

實(shí)際上設(shè)計(jì)師應(yīng)該要了解用戶場(chǎng)景,并代入其中,才能真正的發(fā)現(xiàn)用戶痛點(diǎn),才能做出更好的解決方案。

2)站在產(chǎn)品角度思考

界面設(shè)計(jì)是為產(chǎn)品服務(wù)的,必然也要滿足產(chǎn)品的目標(biāo)。設(shè)計(jì)方案只是片面地為用戶體驗(yàn)服務(wù)也是不可取的。在一些B端產(chǎn)品中,用戶體驗(yàn)并不是最重要的核心競(jìng)爭(zhēng)力,所以用戶體驗(yàn)需要服從整個(gè)產(chǎn)品的規(guī)劃,在特定場(chǎng)景下就是要與產(chǎn)品相互妥協(xié),逐級(jí)迭代,不能只追求極致的用戶體驗(yàn)。

另一方面設(shè)計(jì)師還要深入了解業(yè)務(wù),從設(shè)計(jì)角度幫助業(yè)務(wù)提升。比如某個(gè)業(yè)務(wù)場(chǎng)景下,需要給用戶提供一些數(shù)據(jù)指標(biāo),為下一步操作提供依據(jù)。產(chǎn)品經(jīng)理或許只是給出一張數(shù)據(jù)表格。

而設(shè)計(jì)師則要思考如何進(jìn)行有效的信息傳遞,讓用戶清晰地理解數(shù)據(jù)邏輯。最終給出的答案可能是,在數(shù)據(jù)表格基礎(chǔ)上,利用數(shù)據(jù)可視化方式展示數(shù)據(jù)之間的對(duì)比關(guān)系,便于用戶做出判斷。

3)站在設(shè)計(jì)師角度思考

很多時(shí)候界面設(shè)計(jì)比較主觀,每個(gè)用戶的喜好、感受可能會(huì)大相徑庭。所以設(shè)計(jì)師抱怨最多的就是“沒(méi)有話語(yǔ)權(quán)”。領(lǐng)導(dǎo)今天要綠色、明天要紅色,仿佛設(shè)計(jì)永遠(yuǎn)在變動(dòng)。最終千辛萬(wàn)苦確定下來(lái)的方案,領(lǐng)導(dǎo)一句話可能又要調(diào)整。這對(duì)設(shè)計(jì)師而言,絕對(duì)是沉重的打擊。

設(shè)計(jì)師除了完成設(shè)計(jì)方案,還要思考如何將一個(gè)“主觀”的設(shè)計(jì)方案,“客觀”地表達(dá)出來(lái),要讓相關(guān)人員知曉設(shè)計(jì)的思考過(guò)程,讓設(shè)計(jì)方案變得有理有據(jù),并影響相關(guān)人員,獲得最終的認(rèn)可。

一旦設(shè)計(jì)師思考總結(jié),形成了適合自己的方法后,設(shè)計(jì)師或許就自然而然地?fù)碛辛恕霸捳Z(yǔ)權(quán)”。

 

總結(jié)

設(shè)計(jì)師的成長(zhǎng)應(yīng)該是個(gè)老生常談的話題,思考能力是必不可少的能力之一。

“思而不學(xué)則怠”。有些設(shè)計(jì)師或許并不是不思考,而是深陷困境,找不到出路。思考過(guò)后,還需要去學(xué)習(xí)提升,去主動(dòng)與他人溝通,尋找解決方案。或許這樣才能打通自己的成長(zhǎng)之路。


作者:子牧先生

轉(zhuǎn)載請(qǐng)注明:學(xué)UI網(wǎng)》設(shè)計(jì)師的能力建設(shè)(2):思考能力

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國(guó)內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長(zhǎng)學(xué)習(xí),請(qǐng)加藍(lán)小助,微信號(hào):ben_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。


分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。


藍(lán)藍(lán)設(shè)計(jì)www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司




有沒(méi)有發(fā)現(xiàn),‘點(diǎn)擊 ’開(kāi)始變少而各種手勢(shì)越來(lái)越多了?

seo達(dá)人


圖片

但隨著大屏手機(jī)的出現(xiàn)、逐漸追求個(gè)性化、高效率的操作等原因,使得不少人開(kāi)始習(xí)慣用“摳邊返回”的方式返回上一頁(yè):按住屏幕左側(cè)邊緣并拖動(dòng)。

圖片

無(wú)需特意將手指移動(dòng)到特定的左上角位置、再點(diǎn)擊back圖標(biāo),隨意在屏幕左側(cè)邊緣按住并拖拽 即可返回上一頁(yè),方便又快捷。

而且現(xiàn)在越來(lái)越多的手勢(shì),賦予了用戶更多的操作自由與使用效率,也讓互聯(lián)網(wǎng)產(chǎn)品的生命力進(jìn)一步得到了強(qiáng)化,給每個(gè)產(chǎn)品的功能體驗(yàn)帶來(lái)了更大的發(fā)揮空間。

圖片

下面帶大家欣賞一下,各個(gè)手勢(shì)里好玩、優(yōu)秀的互聯(lián)網(wǎng)設(shè)計(jì)案例。

圖片

 

一、雙指捏合

1、捏一捏就能抱抱?

之前網(wǎng)易(抑)云上線了一個(gè)很暖心的交互,在某條歌曲評(píng)論上用雙指捏一下,就會(huì)彈出一個(gè)“抱抱”的動(dòng)畫(huà),寫(xiě)下這條評(píng)論的用戶就能收到一個(gè)“抱抱”。

夠給那些生擁有悲觀情緒(特別是抑郁癥)的人求得心靈寄托,帶來(lái)一些溫暖、安慰,表達(dá)用戶情緒,也降低產(chǎn)品不良風(fēng)評(píng)(網(wǎng)抑云)。

圖片

亮點(diǎn)在于:運(yùn)用「環(huán)境貼切」原則,雙指捏合的手勢(shì)動(dòng)作聯(lián)想到了現(xiàn)實(shí)里的「抱一抱」動(dòng)作,更符合/表達(dá)出抱一抱的情感關(guān)懷和暖心情緒。

觀點(diǎn)總結(jié):產(chǎn)品不應(yīng)該是冷冰冰的,應(yīng)該給用戶探索更多的樂(lè)趣和溫度,通過(guò)「用戶關(guān)懷」助力產(chǎn)品口碑與印象的提升。

 

2、捏一捏就能伸縮?

iOS的相冊(cè)圖片,可以使用雙指捏合or分離 即可對(duì)圖片進(jìn)行放大、縮小瀏覽,快速查看圖片細(xì)節(jié)。

圖片

免去用戶「需要點(diǎn)擊圖片后,再去縮放」的操作鏈路,大大減少操作路徑。但該交互更多符合國(guó)外操作習(xí)慣,國(guó)內(nèi)還是習(xí)慣采用【點(diǎn)擊后再放大】方式放大圖片。

亮點(diǎn)在于:用同一個(gè)模塊兼容多種交互/內(nèi)容,免去用戶「需要點(diǎn)擊圖片后,再去縮放」的操作鏈路

要點(diǎn)總結(jié):可思考用一定的快捷操作來(lái)滿足不同水平的用戶需求,允許用戶定制常用功能,比如【快捷鍵、重新操作、默認(rèn)值等】

 

二、搖一搖

1、搖一搖就能加載內(nèi)容?

愛(ài)奇藝在啟動(dòng)頁(yè)上的信息展示上做了創(chuàng)新:只需“搖一搖”即可進(jìn)入對(duì)應(yīng)的廣告詳情和影視劇播放頁(yè),拋離傳統(tǒng)的“點(diǎn)擊”模式

圖片

亮點(diǎn)在于:利用新鮮玩法來(lái)吸引更多用戶觀看廣告、影視綜視頻,減少對(duì)啟動(dòng)頁(yè)內(nèi)容的抵觸情緒與用戶流失

要點(diǎn)總結(jié):學(xué)會(huì)用趣味性交互 / 新的設(shè)計(jì)手法吸引用戶目光,利用新鮮感的驅(qū)使引導(dǎo)用戶參與,減少流失

 

2、搖一搖才能拍照出片?

喵喵記賬有個(gè)設(shè)計(jì)挺有意思的,按下相機(jī)拍照后,需要晃動(dòng)手機(jī)來(lái)使相片成像,才能看到影像慢慢顯現(xiàn)。

通過(guò)連接現(xiàn)實(shí)生活感受,使成像過(guò)程具備儀式感與趣味性。

圖片

亮點(diǎn)在于:不僅只在視覺(jué)上進(jìn)行擬物化,更注重與現(xiàn)實(shí)中類似的交互操作,使之更具真實(shí)感。

要點(diǎn)總結(jié):系統(tǒng)的一切表現(xiàn)和表述,應(yīng)該盡可能貼近用戶所在的環(huán)境,比如【用戶語(yǔ)言、使用習(xí)慣、手勢(shì)操作、生活聯(lián)想/隱喻等】

 

三、拖拽

1、一拖就能發(fā)送照片?

QQ里的圖片發(fā)送很有意思,只要按住想要發(fā)送的圖片并往上拖動(dòng),松手即可發(fā)送。不用像傳統(tǒng)的’先選中圖片,再點(diǎn)擊發(fā)送按鈕’,特別方便

對(duì)于發(fā)送單張圖片來(lái)說(shuō),免去了常規(guī)的跳轉(zhuǎn)頁(yè)面調(diào)取相冊(cè)的多余步驟,大大提升操作成本

圖片

亮點(diǎn)在于:利用手指的黃金操作熱區(qū),賦予更加快速、便捷的操作方式,大大減少行為負(fù)荷

要點(diǎn)總結(jié):對(duì)用戶重要、常用的功能可以設(shè)置「快捷操作」,提升操作效率

 

2、頭像還能拖出來(lái)玩的?

在即刻的個(gè)人主頁(yè)里,可以隨意地拖拽、甩動(dòng)自己的頭像。松手后頭像會(huì)根據(jù)慣性回到原處。期間還帶著殘影、原來(lái)的頭像位置會(huì)顯示一個(gè)小紅心。

圖片

亮點(diǎn)在于:利用頭像降低了個(gè)人中心帶來(lái)’冷冰冰’的感覺(jué),豐富產(chǎn)品的可玩性與互動(dòng)性

要點(diǎn)總結(jié):設(shè)計(jì)有趣的隱藏彩蛋,能給用戶帶來(lái)驚喜并有效拉進(jìn)之間的距離

 

四、雙擊

· 哪里需要點(diǎn)哪里?

早期在抖音上看視頻時(shí),點(diǎn)擊或長(zhǎng)按屏幕上的任何位置都會(huì)顯示【愛(ài)心圖標(biāo)】與【操作浮層】。

大大減少用戶的操作成本(手指與目光的移動(dòng)),突顯產(chǎn)品的個(gè)性化服務(wù)。

圖片

 

2、雙擊就能控制彈幕?

B站作為國(guó)內(nèi)「視頻彈幕」的始發(fā)者,它的用戶喜愛(ài)程度與操作頻率也是極高的。因此只要兩個(gè)手指雙擊屏幕,就能快速開(kāi)啟或關(guān)閉彈幕。

用戶可隨時(shí)隨地開(kāi)啟或關(guān)閉彈幕,無(wú)需特意找到右下角的固定入口進(jìn)行操作,大大減少操作成本。

圖片

亮點(diǎn)在于:免去用戶需要點(diǎn)擊特定區(qū)域的操作負(fù)荷,增加產(chǎn)品操作的舒適與自由度

要點(diǎn)總結(jié):系統(tǒng)狀態(tài)可見(jiàn)性:讓用戶知道【自己在做什么、處在系統(tǒng)的什么位置等】,并做出適當(dāng)?shù)姆答?

 

五、滑動(dòng)

1、用標(biāo)尺來(lái)控制數(shù)值?

Florence里的標(biāo)尺設(shè)計(jì)得很有意思,通過(guò)第一人稱下的鏡頭視角,讓用戶感知當(dāng)前標(biāo)尺所對(duì)應(yīng)的人物清晰程度,以此來(lái)控制標(biāo)尺位置。

避免用戶掌握、控制不了合適標(biāo)尺的位置,提升選擇效率

圖片

亮點(diǎn)在于:提供參照物可讓用戶有直觀的決策依據(jù),減少操作成本

要點(diǎn)總結(jié):任何讓用戶更改/選擇的地方,都應(yīng)該明確地傳達(dá)出預(yù)覽效果

 

2、用拖拽來(lái)控制人物動(dòng)作?

Florence是一款‘模擬敘事’小游戲,里面很多的交互動(dòng)作都模擬了真實(shí)生活:

比如【刷牙】,需要左右滑動(dòng)屏幕來(lái)模仿真實(shí)的刷牙動(dòng)作;再如【做飯】也需要滑動(dòng)平底鍋來(lái)模仿炒菜動(dòng)作。

圖片

亮點(diǎn)在于:利用交互動(dòng)作來(lái)推動(dòng)情節(jié)的發(fā)展,讓玩家有真實(shí)的代入感,提升游戲的趣味性。

要點(diǎn)總結(jié):模擬真實(shí)生活/環(huán)境的設(shè)計(jì),能有效提升用戶的理解能力、產(chǎn)品趣味性

當(dāng)然還有iOS微信上的‘刪除確認(rèn)’,在原有的內(nèi)容基礎(chǔ)上表達(dá)對(duì)用戶的二次確認(rèn),避免用戶手誤造成操作失誤,減少不必要的損失發(fā)生

圖片

 

六、隔空手勢(shì)

華為Mate30pro 有個(gè)「隔空手勢(shì)」的交互,可以在距離屏幕20cm-40cm內(nèi)進(jìn)行手勢(shì)操作,如隔空翻頁(yè)、上下滑動(dòng)、隔空截屏等。

提升手機(jī)的使用體驗(yàn)與操作效率,特別是邊吃東西 邊玩手機(jī)(追劇看小說(shuō)等)

圖片

還有優(yōu)酷HD上線了一個(gè)黑科技交互【隔空手勢(shì)】,可隔著屏幕用手勢(shì)做各種操作

如「播放/暫停、全屏/半屏、快進(jìn)/退15秒、亮度調(diào)節(jié)、音量調(diào)節(jié)」等操作,讓用戶不點(diǎn)觸摸屏幕就能操作視頻。

圖片

亮點(diǎn)在于:讓用戶解放雙手,無(wú)需手指觸摸到屏幕即可控制手機(jī),可減少很多衛(wèi)生問(wèn)題與操作成本。

要點(diǎn)總結(jié):學(xué)會(huì)利用新技術(shù)來(lái)滿足更多、高層次的用戶訴求,通過(guò)一定的設(shè)計(jì)方式來(lái)滿足不同水平的用戶需求。

 

– END

最后,再酷炫再方便的手勢(shì),最多也只是錦上添花、起方便快捷的作用而已,不可能完全替代‘點(diǎn)擊’的位置與作用。

正如正文所說(shuō):手勢(shì)交互只適合用對(duì)業(yè)務(wù)重要、用戶常用的場(chǎng)景中,可以起到四兩撥千斤的,切記不可為了酷炫而隨便添加。

以上老和對(duì)【手勢(shì)操作】的一些小總結(jié),覺(jué)得認(rèn)同的麻煩幫我【點(diǎn)贊/在看/收藏/轉(zhuǎn)發(fā)】,寫(xiě)得不對(duì)的請(qǐng)輕點(diǎn)噴~


作者:和出此嚴(yán)

轉(zhuǎn)載請(qǐng)注明:學(xué)UI網(wǎng)》有沒(méi)有發(fā)現(xiàn),‘點(diǎn)擊 ’開(kāi)始變少而各種手勢(shì)越來(lái)越多了?

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國(guó)內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長(zhǎng)學(xué)習(xí),請(qǐng)加藍(lán)小助,微信號(hào):ben_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。


分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。


藍(lán)藍(lán)設(shè)計(jì)www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司



日歷

鏈接

個(gè)人資料

存檔