首頁

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

seo達人

一、高端

圖片

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

圖片

 

二、科技

圖片

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

圖片

 

三、時尚

圖片

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

圖片

圖片

 

四、酷炫

圖片

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

圖片

 

五、好吃

圖片

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

圖片

 

六、夏天

圖片

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

圖片

 

七、清新

圖片

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

圖片

 

八、快樂

圖片

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

圖片

 

九、可愛

圖片

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

圖片

 

十、健康

圖片

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

圖片

 

十一、運動

圖片

要想讓色彩動起來,對比一定要強,可以是色相對比、也可以是明度對比和飽和度對比。橙色和黃色是兩個很具活力的的顏色,所以常用于表現(xiàn)運動的設計里。

圖片

 

十二、科幻

圖片

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

圖片

 

十三、喜慶

圖片

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

圖片

 

十四、復古

圖片

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

圖片

 

十五、中國風

圖片

具有中國風特色的顏色和色彩組合有很多,蔥爺這里僅列舉了8個組合。這類色彩同樣飽和度不會達到最高,有點復古和充滿文化氣息的感覺。胭脂(暗紅色)、緗色(中黃)、紺青(深藍色)、黛(褐色)等是中國風常用的顏色。

圖片

 

十六、夢幻

圖片

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

圖片

 

十七、女性

圖片

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

圖片

 

十八、優(yōu)雅

圖片

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

圖片

 

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

圖片

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

圖片

 

 

圖片

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

作者:蔥爺

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

藍藍設計建立了UI設計分享群,每天會分享國內(nèi)外的一些優(yōu)秀設計,如果有興趣的話,可以進入一起成長學習,請加藍小助,微信號:ben_lanlan,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯(lián)系01063334945。


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


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



這個效果原來是這樣做出來的

seo達人


圖片

 

正文

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

圖片

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

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

圖片

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

圖片

 

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

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

1、線性漸變

這是最常見的一種漸變方式,具備明確的方向性,由兩種或者多種顏色組合形成。相較于單色來說,線性漸變可以使得畫面更加豐富,色彩營造出的層次感更強。

圖片

2、徑向漸變

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

圖片

3、角度漸變

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

圖片

4、混合漸變

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

圖片

5、流體漸變

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

圖片

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

 

二、漸變小教程

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

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

方法一:

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

圖片

方法二:

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

圖片

 

三、分享幾個案例

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

1、鄰近色系易把控

混合漸變技法層面來說并不難,配色是相對具備難度的,很多同學都會因為配色不到位而做不出優(yōu)秀的作品。針對應用圖標設計中的配色來說,鄰近色系的搭配是最容易把控的。選擇色相范圍在 60° 以內(nèi)的色值,混合出來的色彩排斥感都是比較低的,融合度比較高,能夠呈現(xiàn)出比較舒適自然的視覺感官體驗。

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

圖片

2、強視覺感還得對比色

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

圖片

3、學會舉一反三

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

圖片

4、其他作品欣賞

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

 

 

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

通過對混合漸變實現(xiàn)技巧的學習和案例欣賞,相信大家對于混合漸變有了比較全面的認知。學以致用的目的,下面為大家準備了一個小作業(yè),希望以此來強化大家的理解。

圖片

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

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

圖片


作者:黑馬青年

轉(zhuǎn)載請注明:學UI網(wǎng)》這個效果原來是這樣做出來的

藍藍設計建立了UI設計分享群,每天會分享國內(nèi)外的一些優(yōu)秀設計,如果有興趣的話,可以進入一起成長學習,請加藍小助,微信號:ben_lanlan,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯(lián)系01063334945。


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


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




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

seo達人

業(yè)務背景 

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

 

行業(yè)洞察

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

 

設定架構(gòu)

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

圖片

01 內(nèi)在心與神 

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

圖片

02 外在形與貌

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

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

面貌五官

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

圖片

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

圖片

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

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

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

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

圖片

妝容

在妝容上,嘗試融入電商熱賣元素-火苗,來進行面部彩繪,呼應電商直播間虛擬助理的身份。

圖片

頭發(fā)

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

圖片

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

穿搭

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

圖片

b)舉止優(yōu)雅

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

圖片

c)表情生動

咱們按照場景把基本情緒劃分為快樂、傷感兩類;歡迎/引導/收到贊的正向行為,表現(xiàn)為快樂的微笑;答不上來問題和收到踩的負向行為,表現(xiàn)為傷感的噘嘴/皺眉,避免使用帶有攻擊性的(悲痛、憤怒、憎恨)。

圖片圖片

 

寫在最后

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

作者: 富媒體用戶體驗 

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

藍藍設計建立了UI設計分享群,每天會分享國內(nèi)外的一些優(yōu)秀設計,如果有興趣的話,可以進入一起成長學習,請加藍小助,微信號:ben_lanlan,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯(lián)系01063334945。


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


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



快來看看這些小功能里面的設計驚喜

seo達人

一、【抖音】點贊功能情感化設計

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

圖片

 

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

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

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

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

圖片

 

三、【閑魚】賣閑置圖標場景設計

閑魚將“賣閑置”的駝峰標簽欄設計成“電風扇”的動態(tài)圖標形式,結(jié)合近期高溫天氣,給用戶帶來心理上涼爽的使用體驗。

圖片

 

四、【每平每屋】加入話題圈卡片動效設計

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

圖片

 

五、【Snapchat】角色創(chuàng)建功能應用設計

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

如:地圖界面、表情包界面、引導界面以及視頻流界面。

該設計以專屬角色代替用戶視角,通過讓專屬角色深入的參與每一個功能來提高用戶粘性,以及用戶存在感和歸屬感。

圖片

 

六、【Snapchat】底部欄故事功能設計

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

另一個不同于普遍的視頻功能設計點中,Snapchat將單擊視頻【暫?!康墓δ茉O計成了單擊【快進】,視頻切換則是左右切換。對于中國用戶,需要時間來適應不同的交互習慣。

圖片

 

七、【Gravity】頭像裝扮設計探索

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

圖片

 

八、【Gravity】角色場景界面

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

圖片

 

九、【羊駝日語】首頁卡片功能設計

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

圖片

 

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

如果你拍照總是肢體僵硬,不會擺姿勢,那你一定要下載這個APP。

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

只需要點擊你喜歡的同款照片,打開相機,視頻中的輔助線能夠幫助你一比一復刻博主同款poss!

圖片


作者:黑馬青年

轉(zhuǎn)載請注明:學UI網(wǎng)》快來看看這些小功能里面的設計驚喜

藍藍設計建立了UI設計分享群,每天會分享國內(nèi)外的一些優(yōu)秀設計,如果有興趣的話,可以進入一起成長學習,請加藍小助,微信號:ben_lanlan,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯(lián)系01063334945。


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


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



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

seo達人


圖片

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

 

一、產(chǎn)品玩法

1、門檻低

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

圖片

2、單局時間短

微信小游戲有一個特點就是時間短,用戶可以隨進隨出,單局不會占用太多的用戶時間,但是玩起來后也容易上癮。這似乎與短視頻非常相似,本想著只看一個視頻,也就3-5分鐘,不會浪費太多時間,但是一旦開始了,根本停不下來。

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

3、難度高

《羊了個羊》與傳統(tǒng)的消消樂游戲又有些不同,增加了疊牌設計、卡槽消除玩法??雌饋砗唵危嫫饋韺嶋H上非常燒腦。

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

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

圖片

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

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

 

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

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

1、話題性帶來流量

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

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

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

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

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

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

3、方便廣告植入

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

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

圖片

4、減少游戲投入

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

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

《羊了個羊》則完全反其道而行之。

似乎是考慮到當下小程序游戲非常容易相互模仿。一旦一款游戲火了,之后就會冒出各種相似的游戲,就會面臨激烈的競爭。所以《羊了個羊》改變了游戲策略,通過拉高關(guān)卡難度,讓用戶一直停留在第二關(guān)(也許有更多關(guān),因為我沒有玩過第二關(guān)),從而減少游戲的開發(fā)成本。

這種更像是快餐模式,不用過多地擔心游戲風潮會過去,也不用擔心用戶流失,畢竟游戲的投入并不高。

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

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

 

三、關(guān)于激勵機制

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

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

圖片

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


作者:子牧先生

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

藍藍設計建立了UI設計分享群,每天會分享國內(nèi)外的一些優(yōu)秀設計,如果有興趣的話,可以進入一起成長學習,請加藍小助,微信號:ben_lanlan,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯(lián)系01063334945。


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


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



怎樣解決設計好看又符合市場需求的問題?

seo達人


在商業(yè)設計中,好看和有效按理來說應該是一體的,因為脫離了市場需求的好看沒有意義,而設計師所做的工作就是要解決降低傳播成本的問題,通過專業(yè)的審美和技巧讓設計更美觀,也是為了滿足市場需求、達到更好的傳播效果。

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

圖片

圖片

比如上面兩張海報,忽略畫面中的文案意思和尺寸,單純從設計上來看,很明顯圖二更好看,也更有帶入感和氛圍感,所以相比之下,圖二更符合市場需求。

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

圖片

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

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

圖片

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

 

二、并不是丑的設計就有效

有很多設計師會習慣性的以為,好看的設計就是花里胡哨的、沒有效果的;而丑的設計就是接地氣的、有效果的、符合市場需求的,甚至喜歡把符合市場需求當成設計不好看的借口,這絕對是一個誤區(qū)。

比如有些人覺得椰樹牌椰汁包裝很有效,是因為它丑,其實美與丑只是個人的視覺感受,美丑之下傳遞了什么信息、達到了怎樣的效果才是關(guān)鍵。椰樹椰汁的包裝之所以有效,不是因為它丑,而是因為它不一樣,還有它把包裝本身當成了廣告媒體,大量宣傳了它的利益點。

圖片

想象一下,如果一開始的包裝就請設計師按照這種思路精心排版一番,做好看、做時尚一點,效果難道會比這個差嗎?應該不會吧,而且可能年輕人會更喜歡,更敢于拿著它走在大街上。

圖片

圖片

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

 

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

? 如果所有信息都大、都突出,那么就等于沒有重點,消費者在有限的時間里不知道該看什么。

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

? 如果因為元素太大、紅色強調(diào)的信息太多,從而導致畫面變得很難看,那么可能會引起消費者反感,從而放棄閱讀信息,甚至是損害品牌的形象。

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

圖片

把重點信息放大、用紅色突出也沒有錯,但突出信息的方式不只有這兩種,以不變應萬變的種做法很偷懶,效果也不會太好。

 

三、如何在符合市場需求的基礎上盡量做好看?

1、加強氛圍感

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

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

圖片

圖片

比如在上面的兩則banner中,圖二在圖一的基礎上增加了背景色和光影,氛圍感增強了很多,同時視覺上也更好看了。

 

2、加強設計的形式感

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

圖片

 

3、有主次、有層級

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

圖片

 

4、設計手段不要太單一

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

圖片

圖片

▲ 圖二比圖一 的設計手法就要豐富一些。

 

5、細節(jié)要精致

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

 

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

 

圖片

想要設計既能滿足市場需求又能滿足審美需求,確實不是一件容易的事情,因為設計不是數(shù)學,沒有標準答案,如何把握好這個度,如何讓兩者完美結(jié)合達到最好的效果,是需要設計師去反復探索和嘗試的,但毫無疑問,它們是可以共存的,而且應該共存。


作者:蔥爺

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

藍藍設計建立了UI設計分享群,每天會分享國內(nèi)外的一些優(yōu)秀設計,如果有興趣的話,可以進入一起成長學習,請加藍小助,微信號:ben_lanlan,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯(lián)系01063334945。


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


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



需求太朦朧,設計師如何拆招?

seo達人


 

圖片
圖片 
先舉一個栗子,如果你正在進出地鐵口,迎面而來的是一張信息繁雜,需要解讀時間較長的海報廣告,你是否會駐足觀看?

圖片

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

圖片

或許設計師在設計這張海報時運用了某種創(chuàng)意,但因為對場景限制的欠考慮或者并未提前了解投放地點,而沒能達到預期效果,的確有點兒得不償失。

圖片

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

 

圖片

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

圖片

圖片
? 在參與項目時,這些信息點可能不會完整的給到,這就需要我們主動進行提問、了解。有時,提出一個好的問題,就意味著完成了“一半”的工作。收集到的“情報”越多,也越有利于提高出品的準確性、合理性。

 

圖片 

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

 

圖片

圖片

圖片

 

圖片

? 我的建議是延續(xù)品牌調(diào)性走,至少也要跟著所屬品類的調(diào)性走。因為不同行業(yè)、品類的風格是有差異的,比如:快消品可能要傳達很“嗨”的感受、奢侈品要很有高冷feel等… 

 

一般情況下,我們不能用做快消品海報的風格來設計奢侈品海報。 

圖片

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

 

 

圖片

圖片

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

圖片

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

 

圖片

? 我們來看一個案例。提交第一張圖時,客戶反饋字還要放大,但這里我們嘗試換一種思路來處理這個需求。

 

圖片

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

 

 

圖片

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

 

圖片
? 上面第一張圖是我在網(wǎng)上找到的一個案例,但因為它的行距和字距相近,所以讓人閱讀起來非常困難。我只是在它字號不變的基礎上調(diào)整了字距,這樣看起來信息就清晰了很多,相應的傳播的信號也有所增強。

圖片

以上兩個例子雖然都沒有直接按照需求把字放大,但同樣能達到客戶的預期,因為通過這些變化,我們實現(xiàn)了更醒目,傳播信號更強的目的。

 

 

圖片

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

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

 

圖片

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

 

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

 

 

圖片

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

圖片 

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

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

 

 

圖片

圖片  

這是因為,雖然在各位設計同學眼中,我們使用的是不同的顏色(它們唯一的共性是暖色,即使在簡版的潘通色卡中,暖色就有上百種),但是很抱歉,它們在客戶這塊兒,可能統(tǒng)一都被稱為是“大紅色”。 

 

 

圖片

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

 

 

寫在最后:

圖片

 


作者:大目

轉(zhuǎn)載請注明:學UI網(wǎng)》需求太朦朧,設計師如何拆招?

藍藍設計建立了UI設計分享群,每天會分享國內(nèi)外的一些優(yōu)秀設計,如果有興趣的話,可以進入一起成長學習,請加藍小助,微信號:ben_lanlan,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯(lián)系01063334945。


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


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




設計師的能力建設(2):思考能力

seo達人

一、為什么設計師不愿意思考?

每個人都有自己的思考,只是有些時候不愿思考。我認為主要有以下幾個原因:

1、個人定位錯誤

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

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

另外新人設計師缺乏思考,就容易盲從。當年我在設計實習時,就是如此。一方面?zhèn)€人的設計能力比較弱,另一方面缺乏思考,找不到破解途徑。更多的是依靠其他人的輸入,加上缺少自信,更容易聽信別人的想法。當時做了一些事情,但似乎又沒做什么,導致個人的成長非常緩慢,甚至會形成惡性循環(huán),給自己也造成了很大的精神壓力。

久而久之,設計師的存在感就會越來越弱,也會對個人信心造成比較嚴重的傷害。

2、成就感低

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

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

3、團隊氛圍差

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

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

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

經(jīng)驗很重要,可以讓設計師從容地面對各種需求。不過有時候經(jīng)驗主義會讓設計師想當然地去理解需求,導致設計師犯錯。每一個需求看似相同,但是深究下來,用戶和場景可能已經(jīng)發(fā)生了變化,原有的設計形式不再適用了。

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

當我們研究競品時,最重要的是剖析競品為什么會這么設計,而不是只看競品是怎么設計的。

 

二、設計師該如思考呢?

思考的方法有很多。孔夫子曾說過“學而不思則罔,思而不學則怠”。把思考和學習的辯證關(guān)系說得很透徹了。

1、思考的深度

“學而不思則罔”,意思是說只學習不思考,就不會很深刻地理解知識的內(nèi)涵。

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

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

通過不斷地深入思考,設計師就能夠積累出自己的設計方法論,也可以幫助設計師快速成長。

2、思考的廣度

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

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

1)站在用戶角度思考

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

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

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

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

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

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

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

3)站在設計師角度思考

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

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

一旦設計師思考總結(jié),形成了適合自己的方法后,設計師或許就自然而然地擁有了“話語權(quán)”。

 

總結(jié)

設計師的成長應該是個老生常談的話題,思考能力是必不可少的能力之一。

“思而不學則怠”。有些設計師或許并不是不思考,而是深陷困境,找不到出路。思考過后,還需要去學習提升,去主動與他人溝通,尋找解決方案。或許這樣才能打通自己的成長之路。


作者:子牧先生

轉(zhuǎn)載請注明:學UI網(wǎng)》設計師的能力建設(2):思考能力

藍藍設計建立了UI設計分享群,每天會分享國內(nèi)外的一些優(yōu)秀設計,如果有興趣的話,可以進入一起成長學習,請加藍小助,微信號:ben_lanlan,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯(lián)系01063334945。


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


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




有沒有發(fā)現(xiàn),‘點擊 ’開始變少而各種手勢越來越多了?

seo達人


圖片

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

圖片

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

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

圖片

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

圖片

 

一、雙指捏合

1、捏一捏就能抱抱?

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

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

圖片

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

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

 

2、捏一捏就能伸縮?

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

圖片

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

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

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

 

二、搖一搖

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

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

圖片

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

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

 

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

喵喵記賬有個設計挺有意思的,按下相機拍照后,需要晃動手機來使相片成像,才能看到影像慢慢顯現(xiàn)。

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

圖片

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

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

 

三、拖拽

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

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

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

圖片

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

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

 

2、頭像還能拖出來玩的?

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

圖片

亮點在于:利用頭像降低了個人中心帶來’冷冰冰’的感覺,豐富產(chǎn)品的可玩性與互動性

要點總結(jié):設計有趣的隱藏彩蛋,能給用戶帶來驚喜并有效拉進之間的距離

 

四、雙擊

· 哪里需要點哪里?

早期在抖音上看視頻時,點擊或長按屏幕上的任何位置都會顯示【愛心圖標】與【操作浮層】。

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

圖片

 

2、雙擊就能控制彈幕?

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

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

圖片

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

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

 

五、滑動

1、用標尺來控制數(shù)值?

Florence里的標尺設計得很有意思,通過第一人稱下的鏡頭視角,讓用戶感知當前標尺所對應的人物清晰程度,以此來控制標尺位置。

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

圖片

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

要點總結(jié):任何讓用戶更改/選擇的地方,都應該明確地傳達出預覽效果

 

2、用拖拽來控制人物動作?

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

比如【刷牙】,需要左右滑動屏幕來模仿真實的刷牙動作;再如【做飯】也需要滑動平底鍋來模仿炒菜動作。

圖片

亮點在于:利用交互動作來推動情節(jié)的發(fā)展,讓玩家有真實的代入感,提升游戲的趣味性。

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

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

圖片

 

六、隔空手勢

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

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

圖片

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

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

圖片

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

要點總結(jié):學會利用新技術(shù)來滿足更多、高層次的用戶訴求,通過一定的設計方式來滿足不同水平的用戶需求。

 

– END

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

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

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


作者:和出此嚴

轉(zhuǎn)載請注明:學UI網(wǎng)》有沒有發(fā)現(xiàn),‘點擊 ’開始變少而各種手勢越來越多了?

藍藍設計建立了UI設計分享群,每天會分享國內(nèi)外的一些優(yōu)秀設計,如果有興趣的話,可以進入一起成長學習,請加藍小助,微信號:ben_lanlan,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯(lián)系01063334945。


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


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



日歷

鏈接

個人資料

藍藍設計的小編 http://www.bouu.cn

存檔