首頁

黃金圈法則:怎樣識別真需求和偽需求?

資深UI設(shè)計者


如果您想訂閱本博客內(nèi)容,每天自動發(fā)到您的郵箱中, 請點這里

做產(chǎn)品,繞不開「需求」二字。很多產(chǎn)品從0到1需要團(tuán)隊付出很多努力,但如果在把握用戶需求的時候出了錯誤,再好的團(tuán)隊、再牛的執(zhí)行力、再牛逼的技術(shù)也阻止不了項目的失敗,所以,分辨用戶需求就成了產(chǎn)品的關(guān)鍵。


需求有「真需求」,也有「偽需求」,「真需求」可以實現(xiàn)用戶的強(qiáng)關(guān)聯(lián),從而實現(xiàn)產(chǎn)品的穩(wěn)定增長,而「偽需求」要么無法獲得用戶,要么曇花一現(xiàn)。比如魔漫相機(jī),超級課程表這類曾經(jīng)的「現(xiàn)象級」產(chǎn)品,在短暫的瘋狂后迅速被用戶拋棄,其實都是因為沒有正確識別用戶需求。

那么,如何找到買家真正的需求呢?

一、思維工具——「黃金圈法則」

「黃金圈法則」是西蒙·斯涅克在《從為什么開始》中提出的一種思維方法。

他用三個同心圓來描述人的思維模式,黃金圈從外到內(nèi)依次是:做什么(what)、怎么做(how)以及為什么(why)。

  • 思維模式處在最外層的人,他們知道自己想要做什么,但很少去思考怎么做才更好;
  • 處在中間層的人知道如何更好地去完成任務(wù)和目標(biāo),卻很少思考做這件事情的原因;
  • 而處在最中心圈的人則是以「為什么」為出發(fā)點,他們擁有內(nèi)在動機(jī),能夠?qū)崿F(xiàn)自我激勵,而只有這樣的人才能成為偉大的領(lǐng)導(dǎo)者,才能激勵和影響到身邊的人。

黃金圈思維可以讓人們穿破事物的現(xiàn)象,看到事物的本質(zhì),從而做出最佳決策。

它不僅可以用于自我激勵和成長,同時也可以應(yīng)用于營銷、管理與溝通等領(lǐng)域,而我們今天要重點討論如何用它來識別真需求及偽需求。

二、分辨用戶需求的「黃金圈」模型

what(用戶反饋)、how(用戶行為)、why(真正的需求):

  • 用戶告訴你的需求是what,比如你通過問卷調(diào)查或者買家評價與反饋所收集到的信息等。
  • 用戶表現(xiàn)出來的需求是how,即用戶在使用產(chǎn)品、選擇產(chǎn)品時的動作和結(jié)果,它可以對用戶的需求進(jìn)行行動表達(dá)上的證偽。
  • 用戶內(nèi)心真正的需求是why,即用戶一系列動作背后的原因,為什么要使用該產(chǎn)品而不使用其他產(chǎn)品等。

通過這三個層面,我們可以發(fā)現(xiàn)需求、驗證需求,進(jìn)一步挖掘需求,最終識別出用戶真正的消費(fèi)動機(jī),從而找到有效的解決方案。這三個步驟形成了一個「需求驗證漏斗」:

三、在「what」層發(fā)現(xiàn)需求

what層面是用戶評價和用戶痛點,它讓你「發(fā)現(xiàn)可能的機(jī)會」,但這個機(jī)會不一定會形成需求。

比如你要做零售產(chǎn)品創(chuàng)新,那就可以直接去淘寶,看同類產(chǎn)品的買家評價。尤其是差評,就是等待你解決的「痛點」。

身邊的朋友都抱怨淘寶上買東西經(jīng)常要找好半天,找不到自己喜歡的,那么「產(chǎn)品多、篩選難」就是個待解決的「痛點」。

隔壁養(yǎng)金毛狗的女孩經(jīng)常抱怨狗糧太重快遞又不送上樓,減肥成功的男士原來的衣服都不合身了,這些我們平時很容易發(fā)現(xiàn)的抱怨類的信息,就是用戶使用產(chǎn)品過程中的痛點,也都有可能成為新產(chǎn)品的機(jī)會。

發(fā)現(xiàn)機(jī)會,并不代表我們要立刻開始尋求解決方案,因為需求可能只是偽需求,或者根本就不具備任何可行性。

1. 需求本身是「偽需求」,用戶對問題表述「錯誤」或者缺乏對解決方案的「想象力」。

就像喬布斯說的那樣:「不要問客戶他需要什么,因為他們根本不知道?!乖谄桨咫娔X出來之前,用戶并不知道自己需要一臺完全沒有鍵盤的電腦。

2. 項目不具備可行性

比如消費(fèi)人群不夠大,對這類「硬造性場景」感興趣的都是小眾,無法落實到真實的大眾生活里去,產(chǎn)品無法扎根;就像現(xiàn)在的O2O上門服務(wù),大多都是偽需求,上門洗車、上門美容都屬于這一類,消費(fèi)頻次太低,而且家對于多數(shù)人來說是個非常私密的地方,并不希望陌生人到訪。

四、觀察「how」驗證需求

What層面會呈現(xiàn)出的「需求」,我們并不能馬上開始基于這個層面去尋求解決方案,而是要通過「how」來進(jìn)行進(jìn)一步驗證。

「how」就是「用戶行為」。用戶反饋可以說謊,但行動不會。

一個女生說我選老公的標(biāo)準(zhǔn)是:這個人要孝順,帥氣,結(jié)果她選擇了一個有錢人;

一個男生說我選擇老婆的標(biāo)準(zhǔn)是:要善良,結(jié)果他選擇了一個漂亮身材好的人;

小島居民經(jīng)常說他們討厭穿鞋子,因為鞋子會經(jīng)常進(jìn)沙子,但實際上他們依然在穿鞋。

也就是說,用戶經(jīng)?!刚f一套、做一套」。

比如你問用戶喜歡什么顏色,十個人中可能有五個告訴你他喜歡綠色,但如果你真的生產(chǎn)一堆綠帽子然后就沒有然后了。

還有我們一開始提到的「魔漫相機(jī)」,你如果采訪用戶的話,十個人可能有八個告訴你他非常喜歡這個應(yīng)用,但實際上他們玩一次之后就把它拋棄了,因為「爛大街」了,用戶只是在跟風(fēng),他本身根本沒有這個需求。

因此,判斷需求不能只是聽用戶怎么說(what),一定要通過看他怎么做(how)來驗證。

那如果驗證了之后發(fā)現(xiàn)用戶「言行不一」,是不是需求就不存在了呢?也不是,我們要跳出用戶的思維,從主動的角度,也就是「why」這個角度去挖掘用戶的真正需求,開發(fā)解決方案。

五、在「why」層挖掘真實需求

Why是用戶反饋及用戶行動背后的原因,找到這個原因,才能最終驗證需求是否是真需求,也決定了用戶最后是否會為你的解決方案買單。

我們先拿「小島居民的鞋子」來舉例:

小島居民鞋子很容易進(jìn)沙子,這就是一個痛點,也就是what層面的需求。

如果要解決這一痛點,是不是就提倡大家不穿鞋呢?這要從how這個層面來判斷,也就是用戶如何表現(xiàn),結(jié)果發(fā)現(xiàn)雖然鞋里經(jīng)常進(jìn)沙子,大家依然在穿鞋。

最后經(jīng)過調(diào)查我們發(fā)現(xiàn),沙灘里面有很多碎貝殼,不穿鞋會劃傷腳,所以,「不能劃傷腳」比起「進(jìn)沙子」的需求顯然是更為迫切,因此,用戶的真實需求是「舒適地行走在沙灘上」,那么解決方案不是提倡大家「不穿鞋」,而是提供一雙舒適的、不會積沙的鞋子。

再說一個我身邊一位朋友創(chuàng)業(yè)的真實案例:

朋友安妮是個喜歡喝奶茶的女孩子,她幾乎每天都要喝上一杯。在某天和同事討論奶茶的時候,她們開始吐槽奶茶的各種不好,尤其是「不健康」,奶茶的主要成分是植脂末和茶粉、淀粉,不僅不健康,而且容易長胖。安妮上網(wǎng)搜索了一下相關(guān)信息,發(fā)現(xiàn)很多買家都對奶茶的不健康有所擔(dān)心。

于是,安妮決定開個店鋪,專門做「健康的奶茶」。

但實際上她的店鋪開張后生意卻非常冷清,除了一開始有些熟人會過去捧場,大多數(shù)時間店里都是門可羅雀。

安妮的奶茶確實做到了健康,完全用純牛奶和新鮮的茶葉沖泡,糖都是用的上等的果糖。

但為什么大家現(xiàn)在反而不喝呢?

因為「需求」把握錯誤。

消費(fèi)者在抱怨奶茶不健康的時候,他不是想要健康的奶茶,而是想要口味不變、價格不變、包裝漂亮、環(huán)境舒適的情況下,更為健康的奶茶。

我們?nèi)绻傧騱hy層面進(jìn)行探索,就會發(fā)現(xiàn)問題的實質(zhì):

為什么大家要喝奶茶,如果想要追求健康,為什么不是果汁、酸奶、牛奶、咖啡?

因為奶茶好喝,口感豐富、有層次、有趣味,這是其他飲品無法比擬的。

到此為止,我們會發(fā)現(xiàn),用戶的真實需求其實是「好喝而有趣的飲料」。

對于大多數(shù)飲食類產(chǎn)品,口味絕對是第一位的,犧牲口味而滿足用戶的其他需求一概是偽需求。

在「七宗罪」中有一條是「貪食」,喜歡美味的食物是人的天性,大多數(shù)人只有在真的生病之后才會在乎健康,在這之前,他愿意為了絕妙的口感冒第二天中風(fēng)的危險。

由此可見,由發(fā)現(xiàn)需求到驗證需求,是要經(jīng)歷「how」層面直接的驗證,同時追索到「why」層面進(jìn)行分析才能最終確認(rèn)。


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


用戶不按你的設(shè)計方案來?用騰訊這個模型檢查產(chǎn)品!

資深UI設(shè)計者


如果您想訂閱本博客內(nèi)容,每天自動發(fā)到您的郵箱中, 請點這里

在工作中,有時會遇到這樣的一個現(xiàn)象:自以為是最優(yōu)的設(shè)計方案,用戶卻并不會按照預(yù)期的方式使用。每每發(fā)生這樣的事情都會讓我很困惑,用戶為什么不聽話呢?


一、出現(xiàn)問題

試想這樣一個場景:假設(shè)有電話打進(jìn)來,你卻沒有接,試想一下可能有哪些原因?qū)е铝恕笡]接電話」 的這個行為呢?

問題可能出現(xiàn)在三個方面:

  • 你發(fā)現(xiàn)打進(jìn)來的是一個保險推銷電話,不想接電話。這代表著你缺少接電話的動機(jī),因此導(dǎo)致了沒接電話的行為。
  • 你正在開會,不能接電話。這代表著你當(dāng)前缺少接電話的能力,因此導(dǎo)致了沒接電話的行為。
  • 你的手機(jī)靜音了,沒有聽到電話。這代表著「電話來了」 這件事情并沒有觸達(dá)到你,缺少觸發(fā)也能導(dǎo)致沒接電話的行為。

通過上述的例子不難發(fā)現(xiàn),用戶的行為是受多種因素影響的,我們姑且將這些影響分為三類:動機(jī)、能力、觸發(fā)。

二、案例分析

現(xiàn)在試著用這三個要素來分析一個身邊的案例:雖然我知道這樣不好,但是我依然熱衷于打王者榮耀,這是為什么呢?

1. 動機(jī)

王者榮耀作為一款游戲,自帶著「好玩」 的屬性,可以讓玩家在其中獲取快樂,抵御痛苦;另外,來自朋友的邀請、因為玩游戲游戲而帶來的談資、通過提升段位獲得的群體認(rèn)同感等等都可能成為強(qiáng)有力的游戲動機(jī)。

2. 能力

王者榮耀成功的將 DOTA、LOL 等 MOBA 游戲從 PC 端遷到移動端,只要擁有一部智能手機(jī)和一個穩(wěn)定的網(wǎng)絡(luò)環(huán)境,隨時隨地都可以拿出手機(jī)玩上一局王者榮耀,MOBA 類游戲的設(shè)備門檻從未被如此降低;另外,游戲的操作、套路等等也被極度簡化,沒有了 PC 端 MOBA 游戲極高的學(xué)習(xí)門檻,讓更多人可以具備加入這款游戲的能力。

3. 觸發(fā)

來自朋友的邀請通常無法拒絕,這就是依托于社交的病毒式傳播所具有的巨大威力,當(dāng)茶余飯后,朋友喊你一起開黑時,一次有效的觸發(fā)就已經(jīng)達(dá)成了。除此之外還有來自官方的 push 消息、微信中的每周戰(zhàn)報等等,這些都在不停地觸發(fā)用戶,讓玩家不斷強(qiáng)化對于游戲的印象。直到有一天,當(dāng)你閑來無事的時候不由自主的想到拿起手機(jī)打一局王者榮耀,這時它就已經(jīng)達(dá)成了來自玩家內(nèi)部的觸發(fā),成為了你的一個習(xí)慣。

擁有強(qiáng)烈的游戲動機(jī)、具備參與游戲的能力、再加上合理的觸發(fā)機(jī)制,這些因素共同造就了玩家熱衷于打王者榮耀的行為。

三、分析影響因素

由上述案例可以看出,動機(jī)、能力及觸發(fā)這三個因素對于用戶的行為有著十分重要的影響,而且如果你仔細(xì)思考會發(fā)現(xiàn),這三個因素不僅僅適用于上述的案例,而是可以用來解釋絕大多數(shù)場景下用戶行為產(chǎn)生的原因,所以接下來我們展開分析這三個影響用戶行為的關(guān)鍵因素。

1. 行為動機(jī)的根源

用戶的行為動機(jī)大致可以分為三種:

追求快樂、逃避痛苦:用戶更加喜歡能夠快速帶來快樂的產(chǎn)品,例如微視等短視頻產(chǎn)品,讓用戶通過快速消費(fèi)幾秒鐘的短視頻就可以馬上獲取快樂,這也是越來越多的用戶沉迷其中的重要原因之一。

追求希望、逃避恐懼:用戶也會為了追求希望/逃避恐懼做出許多下意識的行為。例如我曾經(jīng)觀察到,很多人在點擊保存文件時會連續(xù)點擊多次工具欄中的保存按鈕,或者多次在鍵盤上按下「Ctrl+S」 的快捷鍵,這樣的行為大概是害怕不小心丟掉自己的勞動成果。這種下意識的多次點擊保存的行為,就是「追求希望、逃避恐懼」 的一個具體表征。

追求認(rèn)同、逃避排斥:人是具有社會屬性的,我們都會追求他人的認(rèn)同,避免被他人排斥。因此在社交網(wǎng)站上的點贊、評論、轉(zhuǎn)發(fā)等互動往往會給作者提供源源不斷的創(chuàng)作動力,其本質(zhì)上是人類追求他人認(rèn)同的心理成為了強(qiáng)有力的驅(qū)動力。

2. 能力限制

用戶的能力限制來自六個方面:時間、金錢、體力、腦力、社會偏差、非常規(guī)性。

前四種能力限制比較容易理解,在此不做贅述。

社會偏差,是指他人對該項活動的接受程度。例如曾經(jīng)在社交平臺中隨處可見的「不轉(zhuǎn)不是中國人」 、「為了家人轉(zhuǎn)起來」 之類的綁架式傳播,現(xiàn)在已經(jīng)很少見了,因為大家都不喜歡這樣的東西,所以當(dāng)用戶遇到類似的內(nèi)容時,也不太容易選擇轉(zhuǎn)發(fā)了。

非常規(guī)性,是指該項行為與常規(guī)活動的匹配程度或者矛盾程度。例如大型超市會在用戶的常規(guī)的行動路線上放置一些小商品,這樣用戶就很可能會產(chǎn)生計劃外的購買行為,如果放置小商品的位置與用戶常規(guī)的行動路線不匹配,甚至互相矛盾,顯然就達(dá)不到引導(dǎo)用戶產(chǎn)生額外購買行為的目的。

3. 觸發(fā)方式

觸發(fā)大致可以分為外部觸發(fā)和內(nèi)部觸發(fā)兩種。

外部觸發(fā)可以理解為產(chǎn)品為了觸達(dá)用戶而做的事情,又可細(xì)分為四種:

付費(fèi)型觸發(fā):通過付費(fèi)的形式進(jìn)行推廣,最常見的就是廣告,商家花錢做廣告,使其產(chǎn)品讓更多人知道。

回饋型觸發(fā):通過正向反饋獲取的曝光,例如產(chǎn)品在應(yīng)用商店的排行榜中位于榜首,自然會獲得更多的觸達(dá)用戶的機(jī)會。

人際型觸發(fā):通過口口相傳的方式觸達(dá)用戶。

自主型觸發(fā):產(chǎn)品自主產(chǎn)生的觸達(dá)行為,例如新聞APP 每天在固定時間 PUSH 的新聞給用戶,久而久之,即使一個不怎么經(jīng)??葱侣劦挠脩粢矔烙羞@樣的一個 APP 可以查看新聞。

相較于外部觸發(fā),內(nèi)部觸發(fā)則顯得更加有價值。內(nèi)部觸發(fā)是指用戶的內(nèi)在情緒/情感等驅(qū)動而觸發(fā)的用戶行為,這是所有產(chǎn)品的最終目標(biāo)。例如用戶發(fā)現(xiàn)通過玩某款游戲可以治療「無聊」 的情緒時,一旦其產(chǎn)生無聊的情緒,就會自然而然的想到玩這款游戲。這樣產(chǎn)品就與用戶建立了一個內(nèi)在的良性聯(lián)系。

外部觸發(fā)往往是曇花一現(xiàn),而內(nèi)部觸發(fā)才能真正讓用戶產(chǎn)生習(xí)慣。

總結(jié)

總結(jié)起來,用戶的行為規(guī)律是有跡可循的,總體上符合這樣的一個模型:

行為(Behaviour) = 動機(jī)(Motivation) + 能力(Ability) + 觸發(fā)(Trigger)

如果一個產(chǎn)品/功能使用起來比較難,則需要用戶有較高的動機(jī),再加上合理的觸發(fā),才能讓用戶的行為觸發(fā)成功;反之,如果用戶的動機(jī)較低,則必須讓產(chǎn)品/功能非常易于使用,再加上合理的觸發(fā),才能讓用戶的行為觸發(fā)成功。動機(jī)、能力、觸發(fā)三者共同制約著用戶的行為,缺一不可。

因此,如果再遇到「用戶不聽話」 的情況,不妨用這個模型來檢驗自己的產(chǎn)品/功能是否存在問題:用戶的使用動機(jī)是否較低?使用難度是否太大?是否合理的觸達(dá)了用戶?相信這樣一輪檢視下來,總會有一些收獲的!

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


間距不會調(diào)?掌握這一個點,從此不再迷茫!

資深UI設(shè)計者


如果您想訂閱本博客內(nèi)容,每天自動發(fā)到您的郵箱中, 請點這里

之前一直覺得色彩,圖形,字體是 UI設(shè)計的三大構(gòu)成,任何設(shè)計都是從這三大元素開始的,所有的 UI設(shè)計都是由這些構(gòu)成的,但是卻忽略了界面中空間的運(yùn)用,也就是我們常說的間距。今天我想分享下幾年前從 Google 的 Material Design 以及 8 pt grid 中學(xué)到的關(guān)于間距相關(guān)的教程,這篇分享有助于我們處理好界面間距一致性問題,讓設(shè)計更加統(tǒng)一,同時定義規(guī)范里面的原子設(shè)計方法,能完美融合。


間距無處不在,界面中的邊距,距離上邊,左邊,右邊,頂部等各種屬性。因此作為一名設(shè)計師,我們需要很好的掌握各種間距規(guī)律,通過間距規(guī)律很好的組織好內(nèi)容。

一、為什么要統(tǒng)一間距?

是否大家和其他設(shè)計師在合作過程中,經(jīng)常打開一個設(shè)計師源文件時候,發(fā)現(xiàn)各種間距大小,各種不一致地方,明明同一個頁面,已經(jīng)定義好規(guī)范,但是每個人使用的間距大小不一致??赡苣銈円?guī)范已經(jīng)定義好了,最小單位是5,按照5的倍數(shù)去做設(shè)計,但是還是會出現(xiàn)各種奇葩的間距,10,12,18等等。或者說有的設(shè)計師是按照5來說的,間距會出現(xiàn)10,15,20,25,30,很難解釋清楚哪種場景下用什么樣間距規(guī)則。

不止是設(shè)計師,估計研發(fā)打開我們標(biāo)注稿都是崩潰的。所以我們需要去統(tǒng)一間距規(guī)則,它的優(yōu)點是能很好的讓設(shè)計師之間合理的了解我們間距系統(tǒng)規(guī)則,同時開發(fā)在做設(shè)計開發(fā)時候,不需要每次都重復(fù)開發(fā)不同間距,導(dǎo)致整個 APP 風(fēng)格混亂,那么我們?nèi)绾稳プ瞿兀?

二、它的價值是什么?

對于設(shè)計師:效率上,減少決策和思考,當(dāng)我做一個需求時候,我不需要考慮到底用多大間距,同時能保持元素之間的節(jié)奏。

對于團(tuán)隊:設(shè)計師和開發(fā)之間溝通更加簡單,開發(fā)人員能很好的按照最小單位按照增量遞增去寫間距,而不必每次都進(jìn)行測量。

對于用戶:他們信任的品牌有一致性的美感,在設(shè)備上沒有模糊的像素偏移等,就和微信一樣,說不出哪里好,但就是最好的。

三、站在巨人肩膀上思考

△ Material Design 在他的布局中有講過,他們的間距,所有間距規(guī)則都是在8的倍數(shù)上進(jìn)行遞增,而且并不是毫無頭緒的遞增,只定義了幾種增量關(guān)系,克制的有序的間距彈性,最小的是8,16,24,32,48,56,72。

△ 同樣在 iPad端,間距規(guī)則也是有序的,克制的間距彈性,而不會出現(xiàn)我們?nèi)粘TO(shè)計中經(jīng)常間距隨意任選的使用,毫無規(guī)則亂用。

△ 在 Airbnb 的規(guī)范中,PC 和無線所有設(shè)計間距規(guī)范原則只定義了5種,8,16,24,48,64讓規(guī)則更加簡單,更好的統(tǒng)一了整個風(fēng)格的一致性。

這些原則除了在元素和元素中運(yùn)用,其實在按鈕中,在按鈕里面文字和上下左右的距離,都是有序的,我特別喜歡一句話,設(shè)計語言只有在有序的遵循和重復(fù)使用下才有用。

四、怎么做?

1. 定最小原子單位

這個最小間距規(guī)則可以是3的倍數(shù),像蘑菇街、豆瓣一樣,如果你希望產(chǎn)品留白比較多,也可以是5的倍數(shù),例如 pinterest、亞馬遜等,這個沒有絕對的,一切根據(jù)你們產(chǎn)品內(nèi)容豐富程度決定。

△ 亞馬遜和 AliExpress 都是按照5為倍數(shù)來做間距增量

2. 確認(rèn)間距彈性

大家都買過衣服或者鞋子,一般鞋子尺碼,只會有固定幾個(36,37,38,39,40,41,42,43)如果你需要的鞋子特別大,可能需要訂制,包括衣服也是同樣(XS,S.M.L.XL)。

在定義間距上同理,以往做設(shè)計規(guī)范的經(jīng)驗,在上一步定義好最小單位就完啦,然后設(shè)計師按照增量去設(shè)計就 ok,這樣只是完成一半,如果按照4的增量(4,8,12,16,20,24,28,32,36,40….)這種帶來問題就是任何間距都不可預(yù)測,提供的選擇過于接近了,在什么情況下使用24,什么情況下使用28,我們很難去決策,如何去做。

之前在團(tuán)隊做過一個調(diào)研,我們問了設(shè)計師,也看了很多設(shè)計源文件,包括國外也有一個類似調(diào)查,就是在用4作為設(shè)計原子間距做設(shè)計時候,設(shè)計師使用最多的間距有哪些?結(jié)果很有意思,使用16的占一半,8和32的占一半,所以定義太多間距其實毫無意義,只會帶來設(shè)計時候的不確定元素。

3. 根據(jù)業(yè)務(wù)場景,定義間距

正如前面所說,過多間距規(guī)則,只會帶來設(shè)計師困惑,徒增界面復(fù)雜性,對開發(fā),對設(shè)計師都是一種負(fù)擔(dān),所以我們在定義間距時候,一定要少,要讓我們間距原則覆蓋到絕大多數(shù)場景??梢詮?XS,S,M,L,XL 為參考,小,中,大為緯度。

△ Airbnb 的間距規(guī)則 XS,S,M,L,XL 是最小為8,常用8,16,24,48,64,Airbnb 則更加克制,給設(shè)計師選擇更少,反而更能保持設(shè)計次序。

△ quickbooks 的間距規(guī)則 XS,S,M,L,XL 是最小為4,常用8,16,20,40,60能很好滿足各種業(yè)務(wù)場景,包括各種的間距場景都是在此基礎(chǔ)上去拓展。

△ 那么界面中所有的間距地方,全部運(yùn)用8,16,20,40,60這幾個原則來做設(shè)計,保證頁面統(tǒng)一性。

△ 包括頁面中的元素高度,比如 banner 高度也是按照間距增量去設(shè)計高度,那么整個頁面就更加有系統(tǒng)性和科學(xué)性。

△ 這也是我們在做系統(tǒng)設(shè)計時候經(jīng)常用到的,通過增量來做設(shè)計。

△ 同理,在國外很多優(yōu)秀產(chǎn)品中,我們不難發(fā)現(xiàn)這種規(guī)律的使用,更好的提升了設(shè)計效率。

總結(jié)

統(tǒng)一簡化間距規(guī)則,通過這些規(guī)則,構(gòu)建一致性界面,所有邊距,元素空間都遵循規(guī)則時候,對于視覺設(shè)計和開發(fā)人員來說,都能很好解決一致性和效率問題。

在我們剛開始設(shè)計時候,可能會覺得沒有真正的好處,但是當(dāng)項目越來越復(fù)雜時候,團(tuán)隊規(guī)模越來越大,每天處理各種設(shè)計原子和設(shè)計分子時候,你會發(fā)現(xiàn),當(dāng)你使用固定的間距,它會比之前隨意的間距規(guī)則有更好的效果。

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


8個步驟幫你掌握從用戶出發(fā)的創(chuàng)意腦暴法

資深UI設(shè)計者

如果您想訂閱本博客內(nèi)容,每天自動發(fā)到您的郵箱中, 請點這里

頭腦風(fēng)暴是創(chuàng)意點子常用的方法,那么從用戶出發(fā)的腦暴有什么不同?從過去幾年用研發(fā)現(xiàn)向產(chǎn)品方案轉(zhuǎn)化的腦暴案例中,總結(jié)成功與失敗經(jīng)驗,提煉出目前最優(yōu)的流程與執(zhí)行技巧,一起來提高創(chuàng)意點子產(chǎn)生的成功率吧!

關(guān)于新產(chǎn)品創(chuàng)新的成功率,有這樣一組數(shù)據(jù):3000個原始想法,能變成300個成熟想法,300個成熟想法能產(chǎn)生125個項目,其中大概有9個能進(jìn)入早期開發(fā),4個能大力開發(fā),最后成功的只有1.7個。(來自彭肯恩博士的研究)

大多數(shù)點子的失敗,可能的原因有很多,比如疏于對趨勢的關(guān)注和研究、缺乏理論的突破、缺乏執(zhí)行力、難以逃脫組織思維慣性等等(來自創(chuàng)新管理課程),其中還有一個常常提到的原因:離用戶太遠(yuǎn)。在最初想點子的時候,由于不知道用戶需求、腦補(bǔ)用戶需求、片面地針對用戶表面部分需求卻忽視深層需求來規(guī)劃,就會導(dǎo)致產(chǎn)品或功能開發(fā)完成以后,不知道目標(biāo)用戶、目標(biāo)場景,也不知道對用戶的價值,最終產(chǎn)品也會因用戶不去使用,而導(dǎo)致創(chuàng)新失敗。

作為用戶研究者,洞察和分析用戶真實需求是我們的本職和專長,但如何把這些用戶研究的發(fā)現(xiàn)以更有效的方式轉(zhuǎn)化為「靠譜」的好點子,則需要與團(tuán)隊里各個角色一起不斷的努力。從14年起,我們在一次次從用研發(fā)現(xiàn)到產(chǎn)品點子的頭腦風(fēng)暴實踐中,不斷優(yōu)化流程、評估效果,形成了現(xiàn)在的「從用戶出發(fā)的創(chuàng)意腦暴」流程,在這里分享給大家。

傳統(tǒng)的頭腦風(fēng)暴法(brainstorming)相信大家都熟悉,就是一組人圍在一起,隨意的將腦中與主題有關(guān)的見解提出來,再將大家的見解分類整理。但在實際執(zhí)行的過程中,頭腦風(fēng)暴的現(xiàn)場卻常常交錯著討論、腦補(bǔ)、推理、玩笑等等,然后時間很快過去,卻沒有產(chǎn)出「靠譜」的點子。從用戶出發(fā)的創(chuàng)意腦暴,是以典型用戶故事為線索,輕松、的產(chǎn)出點子的頭腦風(fēng)暴過程:一方面,線索契合用戶真實完整的需求場景,點子變得更容易想也更符合用戶需求;另一方面,通過流程上的細(xì)節(jié)設(shè)計,可以更的激發(fā)點子產(chǎn)生。

整個過程分為8步。雖然常常的情況是一個人想不出方案,就馬上拉人一起腦暴發(fā)散,但其實腦暴前的素材和流程準(zhǔn)備,以及達(dá)成共識對腦暴的最終效果起到了至關(guān)重要的作用。

第一步:確定一個不遠(yuǎn)不近的腦暴主題

產(chǎn)生好點子的前提是問對問題,問對問題需要跳出眼前的思維限制,但又不要太天馬行空。要做到這點并不容易,這要求腦暴的組織者在一開始就想清楚團(tuán)隊真正要解決的問題是什么,而不僅僅「產(chǎn)品的某個功能眼下要怎么做」這種具體問題(這樣的問題聽起來就讓人疲憊)。舉個例子,當(dāng)眼前的業(yè)務(wù)問題是想出一些裝扮功能,如果把腦暴的主題定為「裝扮還可以做哪些新功能」,思路就會陷入現(xiàn)有的裝扮流程里,這時點子的方向已經(jīng)被具象和限制,有時甚至是無解的;如果定為「如何幫助用戶通過裝扮來表達(dá)自己」(前提是用戶真的用裝扮在滿足這一需求)就會更合適一些,這樣就可以去想如何通過裝扮表達(dá)自己的心情、興趣、狀態(tài)、、所屬群體身份等等,思路打開的同時又與業(yè)務(wù)結(jié)合;而如果僅僅是「用戶如何表達(dá)自己」,想出的點子,就會太泛,脫離業(yè)務(wù)。

第二步:有選擇的邀請團(tuán)隊成員

首先,有選擇的邀請樂于分享、樂于溝通、思維活躍的人,他們會自然而然的產(chǎn)生想法,互相交流,否則每個人盯著自己的點子說著自己的故事就會喪失一組人在一起的意義;其次,在邀請成員時,不建議只有自己組的組員(雖然這樣比較方便),因為參與角色的多樣性一方面可以相互激發(fā)創(chuàng)意,同時也讓點子在收斂階段能得到更多元的評價(比如工程師對點子可行性的評估就有其專業(yè)的判斷)。在人數(shù)上,雖然6-8人是腦暴的建議人數(shù),但因為我們的腦暴流程會讓點子批量產(chǎn)生,人數(shù)的增加會直接導(dǎo)致后續(xù)點子收斂時效率的降低,所以目前來看建議6人為佳。

第三步:準(zhǔn)備簡潔又有代表性的用戶故事

用戶故事的準(zhǔn)備是腦暴的一個關(guān)鍵,吸引著我們不斷的去改進(jìn)和探尋。過去,我們也有過一些不太理想的嘗試:讓參與者分享自己的故事(如畢業(yè)生如何找房),這時很容易就根據(jù)主觀和片面的需求想點子;給出一些用戶需求的詞讓大家聯(lián)想(如不孤單),這時參與者對著普通又太正確的詞已經(jīng)想過很多遍,很難進(jìn)入狀態(tài);給出一系列相關(guān)故事(如多個類似的故事)幫參與者發(fā)想,這時呈現(xiàn)的信息對參與者來說已經(jīng)過于復(fù)雜,傳達(dá)的效率很低;給出的每個故事都帶有用戶痛點(如粉絲給明星發(fā)消息得不到回應(yīng)),這時參與者往往會依照故事中的情節(jié)去推理,絞盡腦汁非常辛苦,卻忽略了沒有痛點的地方藏著用戶的真實需求(如粉絲默默的把想對明星說的話記錄在手機(jī)備忘里)。

所以,目前的做法是:

  • 對調(diào)研中收集到的大量用戶原始故事進(jìn)行分析;
  • 根據(jù)分析點之間的相互關(guān)系,按照一定的維度把分析點組織起來,比如組織成幾類典型的用戶畫像、使用產(chǎn)品的幾類動機(jī)、幾個場景、幾步行為流程等等,組織維度符合 MECE( Mutually Exclusive Collectively Exhaustive,相互獨立、完全窮盡)原則即可;
  • 按照組織后的結(jié)構(gòu)(如畫像/動機(jī)/場景/流程等),把同一個類別下多個反映分析點的真實故事組合改編成一個典型故事。

舉例來看,研究粉絲的過程中,我們發(fā)現(xiàn)有的粉絲會組團(tuán)給偶像投票打榜并感嘆「團(tuán)結(jié)就是力量」、有的粉絲會在活動現(xiàn)場和他人一起大聲應(yīng)援并覺得暖心、有的粉絲在 QQ群和其他粉絲一起討論相互訴說并且感覺很棒。這些故事都反映出粉絲對于「群體」、「團(tuán)結(jié)」的訴求,將這幾個不同人的真實故事綜合起來,就形成了一個特別在意「團(tuán)結(jié)形象」的典型粉絲故事。這個「團(tuán)結(jié)」的典型故事和「秩序」、「強(qiáng)大」等等典型故事一起反映了粉絲「群體形象」方面的訴求。

通過這樣的方式得到的典型故事不僅有真實故事的細(xì)節(jié),而且嚴(yán)謹(jǐn)?shù)胤从秤脩粜枨?,信息量大,結(jié)構(gòu)完整。腦暴參與者面對這些故事,就很容易理解,并聯(lián)想出更多符合用戶真實需求的點子。整個過程說起來簡單,但在實際執(zhí)行時卻考驗著研究人員的大局觀、邏輯能力、洞察力、組織能力等等,整個研究過程有時可能會需要1-2個月。

第四步:設(shè)置嚴(yán)謹(jǐn)又輕松的流程

在腦暴流程上的設(shè)置上,主要的嘗試點在個人想點子和大家交流點子的方式和順序安排。如果大家同時一邊想一邊交流,會出現(xiàn)沒空思考或有人不認(rèn)真想的情況;如果大家先寫再輪流說,會出現(xiàn)思考時獨立思考,交流時只關(guān)心自己的說法而忽視交流發(fā)散的情況。所以在嘗試了默寫式頭腦風(fēng)暴(后文會詳細(xì)介紹)后,我們就沿用了這個鼓勵思考交流、弱化發(fā)言的腦暴方式。

另外要注意的一個點是,不用在流程上對想點子的思路有過多的限制,比如告訴參與者「你可以先想什么再想什么」或「你想出的點子不能太抽象或太具體」,這種「急功近利」的做法會讓參與者困惑和緊張。相反的,應(yīng)該要做的是讓他們放松,比如放一些音樂、擺一些零食等等,這樣更容易產(chǎn)生想法。

第五步:在正式腦暴前,達(dá)成共識

在腦暴前,向參與者說明本次腦暴的目的、主題、流程和規(guī)則,能夠幫助大家統(tǒng)一目標(biāo),提率。

頭腦風(fēng)暴的四個基本規(guī)則在腦暴過程中要落到實處:

  • 追求數(shù)量(可設(shè)置一個小榮譽(yù)激勵大家想點子);
  • 禁止批評(包括負(fù)面的表情或語氣詞都不能有);
  • 提倡獨特的想法(可以異想天開、天馬行空);
  • 綜合并改善設(shè)想(可以在別人的基礎(chǔ)上寫新的點子)。

組織者也可以給出一些用戶研究的發(fā)現(xiàn),幫助大家建立概念、了解用戶。

第六步:默寫式頭腦風(fēng)暴

默寫式頭腦風(fēng)暴是在奧斯本頭腦風(fēng)暴的基礎(chǔ)上改造而成的一種書面腦暴方法(具體操作方式如下圖)。從用戶出發(fā)的創(chuàng)意腦暴在此基礎(chǔ)上,增加了用戶的典型故事作為線索。在開始前,每個參與者會拿到3張用戶典型故事卡;在第一個5分鐘,每人針對3個故事各寫至少1個點子,貼在故事卡上,然后傳給右鄰;第二個5分鐘,每人從傳來的故事卡和前人的點子上得到啟發(fā),再各寫至少1個點子,傳給右鄰;這樣直到故事傳完,就能得到至少6 x 3 x 6=108個點子。這也是為什么前面提到要控制參與者人數(shù)的原因,因為每增加1人,就會多一輪腦暴的時間,點子的數(shù)量會相應(yīng)增加,在下一步分類交流時的工作量和時間也會直接增加。

第七步:點子現(xiàn)場收斂

在已經(jīng)有了一百多個點子的情況下,現(xiàn)場投票可以快速把「好點子」篩出來。但由于在寫點子的時候,把想法準(zhǔn)確的表達(dá)在一張便簽紙上并不是一件容易的事,所以在投票前,還是會有一個簡單的交流,讓大家了解彼此的點子,同時合并類似的點子。

投票分為感性輪和理性輪:感性輪是讓人眼前一亮的點子,每人3票;理性輪是可行或能有效提升業(yè)績的點子,也是每人3票。這樣兩個維度交叉出來就能得到既讓人眼前一亮,又具有可行性的點子。參與者多樣的背景也讓點子的評估更加全面。

第八步:點子的后續(xù)跟進(jìn)

腦暴結(jié)束并不是點子的結(jié)束。最初的點子只是一句話或一個示意圖,從點子走向方案,還需要不斷地打磨交互、視覺、文案、邏輯、場景等等方面的細(xì)節(jié);從方案到投入開發(fā)乃至上線,則需要綜合考慮優(yōu)先級、人力、技術(shù)等更多方面的問題;在上線后,點子的可用性以及對業(yè)務(wù)的效果,也需要提前規(guī)劃和進(jìn)一步驗證。

總的來說,從用戶出發(fā)的創(chuàng)意腦暴,在線索和流程設(shè)計上做出了一些嘗試,讓產(chǎn)生的想法更加符合用戶真實需求,以此來提高創(chuàng)新點子的成功率。但創(chuàng)新畢竟不是一件容易的事,在未來,我們也會不斷地嘗試和打磨這個流程,思考更好的方式,讓創(chuàng)新有跡可循。

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

企業(yè)設(shè)計的未來是什么?是消費(fèi)級用戶體驗

博博

企業(yè)設(shè)計的未來是什么?是消費(fèi)級用戶體驗

人人都是產(chǎn)品經(jīng)理 2018-07-21 15:13:33

如果您想訂閱本博客內(nèi)容,每天自動發(fā)到您的郵箱中, 請點這里

企業(yè)產(chǎn)品要想取得最大的成功,就應(yīng)該為用戶提供符合消費(fèi)產(chǎn)品標(biāo)準(zhǔn)的體驗。

企業(yè)設(shè)計的未來是什么?是消費(fèi)級用戶體驗

在John Maeda最近的一篇文章“為企業(yè)設(shè)計與為消費(fèi)者設(shè)計之間的區(qū)別”中,他解釋了為什么為企業(yè)設(shè)計與為消費(fèi)者設(shè)計應(yīng)用程序相比是不同的,也許更具挑戰(zhàn)性。

然而,作為一個為企業(yè)、小企業(yè)和消費(fèi)者產(chǎn)品設(shè)計應(yīng)用程序的人,我逐漸相信,在過去幾年中,為消費(fèi)者和企業(yè)應(yīng)用程序設(shè)計的區(qū)別已經(jīng)迅速縮小。

對于一個企業(yè)產(chǎn)品來說,要獲得最大的用戶接受度和長期的成功,我們應(yīng)該為最終用戶提供一種體驗,這種體驗必須滿足消費(fèi)品中同樣的可用性、性能和品牌標(biāo)準(zhǔn)。

用戶已成為決策者

對于傳統(tǒng)的企業(yè)產(chǎn)品,過去的模式是將產(chǎn)品賣給公司的高管,然后員工使用他們提供的工具。如果應(yīng)用程序難于使用,員工會盡可能少地使用它,而是使用耗時的、通常是手工的變通方法,以避免在工具上花費(fèi)時間。

如今,團(tuán)隊和員工經(jīng)常選擇自己的產(chǎn)品,這意味著贏得勝利的是最好的產(chǎn)品和設(shè)計,而不是最好的銷售和營銷。Slack、Sketch、Dropbox、Sunrise、谷歌Drive和Asana都是這一趨勢的例子。

企業(yè)設(shè)計的未來是什么?是消費(fèi)級用戶體驗

因為在不同平臺之間切換的成本比以前要低得多,所以在工作中選擇自己的工具要容易得多。我看到員工們選擇為他們工作的日歷工具、通信工具、文檔存儲系統(tǒng),甚至設(shè)計工具,比如:草圖。越來越多的大型團(tuán)隊工具決策,是自下而上的。用戶正在選擇他們喜歡的軟件,而不是強(qiáng)加給他們的軟件。

這意味著,企業(yè)產(chǎn)品的構(gòu)建需要越來越少地考慮,如何在企業(yè)產(chǎn)品設(shè)計中應(yīng)用消費(fèi)者思維,而越來越多地考慮如何在企業(yè)產(chǎn)品設(shè)計中應(yīng)用消費(fèi)者思維。

不要依賴銷售團(tuán)隊來實現(xiàn)用戶的增長。

作為一名設(shè)計師,你的目標(biāo)是開發(fā)一款非常棒的應(yīng)用程序,讓你的用戶想要在屋頂上大聲談?wù)撍?,并與所有的隊友分享。

在這種情況下,接受是隨機(jī)的,用戶最終會對您的產(chǎn)品更忠誠,而不是他們被迫使用的東西。

性能很重要

盡管許多企業(yè)應(yīng)用程序都是基于云計算的(例如:Salesforce、Quickbooks、Marketo、Infor等),但消費(fèi)者對速度的預(yù)期與桌面應(yīng)用程序的預(yù)期并無不同。

如果基于云的應(yīng)用程序需要花費(fèi)時間來加載,用戶就會離開。Gmail和其他在線應(yīng)用程序,已經(jīng)為響應(yīng)性和性能設(shè)置了標(biāo)準(zhǔn)。

創(chuàng)造第一次使用體驗,讓用戶自己成功

正如我與協(xié)作設(shè)計應(yīng)用UXPin共同編寫的《企業(yè)用戶體驗的未來免費(fèi)指南》(free guide the Future of Enterprise UX)中所解釋的,設(shè)計師還應(yīng)該努力創(chuàng)建一種無需外部培訓(xùn)的應(yīng)用程序登錄體驗。

這仍然是我看到企業(yè)產(chǎn)品設(shè)計公司猶豫不決的地方,人們會說:

“好吧,人們理解這個工具需要一點培訓(xùn),因為它比消費(fèi)者應(yīng)用程序復(fù)雜一點?!?

為人們在工作中使用的產(chǎn)品不應(yīng)該成為糟糕設(shè)計的借口,如果你遵循常見的UI結(jié)構(gòu)——定位用戶,給他們一個具體的用戶好處,讓他們覺得他們已經(jīng)獲得了寶貴的時間——他們將繼續(xù)學(xué)習(xí)使用你的產(chǎn)品,就像他們學(xué)習(xí)視頻游戲、移動應(yīng)用程序和其他東西一樣。

例如:在為Intuit的旗艦產(chǎn)品QuickBooks設(shè)計登錄體驗時,我們詢問了關(guān)于業(yè)務(wù)的關(guān)鍵信息,然后根據(jù)所提供的信息定制體驗,為用戶做一些初始的設(shè)置工作。這有助于產(chǎn)品感覺它是為最終用戶和他們的業(yè)務(wù)設(shè)計的。

我們創(chuàng)建了一個屏幕,顯示了同一行業(yè)和位置上Quickbooks用戶的數(shù)量。在傳統(tǒng)的登錄體驗中,不需要這樣做,但是這種流程的轉(zhuǎn)換要比步驟更少的登錄體驗高。屏幕告訴人們:“我們將為您設(shè)置產(chǎn)品,從而為您節(jié)省時間”,這也強(qiáng)化了他們正在選擇行業(yè)領(lǐng)導(dǎo)者。

企業(yè)設(shè)計的未來是什么?是消費(fèi)級用戶體驗

第一次使用體驗的新工具條不僅適用于嘗試使用它的人。它必須足夠好,讓他們在與團(tuán)隊其他成員和他們的公司一起倡導(dǎo)產(chǎn)品時感到舒適。

讓您的產(chǎn)品可由用戶和團(tuán)隊定制

企業(yè)客戶不應(yīng)該接受這樣的概念:他們需要實現(xiàn)專家來為客戶定制產(chǎn)品,客戶應(yīng)該能夠自己做到這一點。

如果您設(shè)計了一個企業(yè)應(yīng)用程序,它可以由使用它的團(tuán)隊定制,那么您就給了他們一種對產(chǎn)品的投資和所有權(quán)的感覺。你賦予他們力量,給用戶信心。用戶把產(chǎn)品做對,從而變得更加忠誠。

此外,作為企業(yè)供應(yīng)商,如果您將時間/資源用于客戶的定制實現(xiàn),您將沒有足夠的資源用于應(yīng)用客戶反饋和創(chuàng)新。

企業(yè)設(shè)計的風(fēng)險和機(jī)遇

盡管企業(yè)用戶體驗和消費(fèi)者用戶體驗之間的差距正在縮小,但在設(shè)計業(yè)務(wù)應(yīng)用程序時,仍需要考慮一些持久的差異。

創(chuàng)新的風(fēng)險更大

使用企業(yè)工具,您正在處理非常有價值的數(shù)據(jù),因此如果您將數(shù)據(jù)隱藏在有趣的和不尋常的交互中,可能會讓用戶感到沮喪。作為一名設(shè)計師,您希望遵循已經(jīng)存在的用戶界面標(biāo)準(zhǔn),將您的創(chuàng)新重點放在產(chǎn)品中比現(xiàn)有產(chǎn)品更好的部分。

作為一個谷歌文檔編輯器的用戶,我不需要知道如何使用文檔編輯器,因為它大量地借用了我使用Microsoft Word所知道的東西。谷歌在執(zhí)行過程中所強(qiáng)調(diào)的是,將創(chuàng)新集中在差異化上:將其與MS Word區(qū)別開來的協(xié)作工具。

我唯一需要學(xué)習(xí)的就是——如何邀請別人和我一起編輯?

一旦我有了這個概念,我就可以用成千上萬個有趣的方法來使用這個應(yīng)用程序,并且在我使用擴(kuò)展我的應(yīng)用到其他相關(guān)產(chǎn)品(比如:演示)的過程中,建立我所學(xué)到的東西。(我將第一個承認(rèn),在選擇使用現(xiàn)有范例的地方,設(shè)計師很難做到自律,而且仍然非常專注于在哪里重新設(shè)計)

你很少有能力“吃狗食”你的工作

如果你是為Facebook或Pinterest這樣的消費(fèi)者工具設(shè)計的,你自己可能就是用戶。對于企業(yè)或業(yè)務(wù)應(yīng)用程序,情況往往不是這樣。

這意味著你必須既是一名優(yōu)秀的研究者,也是一名設(shè)計師。

當(dāng)我在Intuit公司時,知道如何設(shè)計一個好的web應(yīng)用程序,是不夠的,我還必須了解會計結(jié)構(gòu),以及小型企業(yè)/會計師的需求。我從來沒有開過小公司,所以我必須花更多的時間與使用該產(chǎn)品的人交流,學(xué)習(xí)和理解他們的目標(biāo)和動機(jī),比我在其他公司花的時間要多。

我邀請了其他人(比我知道得更多)和我一起設(shè)計。值得慶幸的是,在Asana,我們使用我們的應(yīng)用來完成我們所有的工作,所以我們可以體驗我們的用戶體驗。

結(jié)論

我很高興看到設(shè)計師和設(shè)計領(lǐng)袖對創(chuàng)建企業(yè)工具更感興趣,我認(rèn)為這是因為消費(fèi)者和企業(yè)之間的差距正在縮小。

有了消費(fèi)者應(yīng)用程序,你就可以設(shè)計出一種影響到數(shù)十億用戶的工具,并將娛樂帶給世界。但隨著時間的推移,設(shè)計師會感到矛盾。許多消費(fèi)者應(yīng)用程序通過廣告賺錢,因此用戶目標(biāo)和公司目標(biāo)并不同步。用戶在想:

“我想看這個視頻,公司在想,‘我們怎么能讓用戶在看這個視頻之前看更多的廣告呢?’”

為企業(yè)和其他付費(fèi)應(yīng)用程序設(shè)計的好處是:終端用戶的目標(biāo)和您的企業(yè)的目標(biāo)是一致的,你的公司只有在用戶成功使用該應(yīng)用時才會受益。通過企業(yè)工具,你正在構(gòu)建產(chǎn)品,幫助組織及其員工實現(xiàn)他們的目標(biāo),幫助所有企業(yè)更好地完成他們的工作。

原文作者:Amanda Linden

本文由 @ ANG 翻譯發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可,禁止轉(zhuǎn)載

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

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


App的視覺美成因分析

資深UI設(shè)計者



如果您想訂閱本博客內(nèi)容,每天自動發(fā)到您的郵箱中, 請點這里

在做UI設(shè)計之初,我就有跟蹤一些app版本和更新的習(xí)慣。在互聯(lián)網(wǎng)行業(yè)工作久了,我總是會從他們每一個版本的產(chǎn)品形態(tài)去揣測這個公司的動態(tài)??吹揭恍┕δ芎徒换c,我會設(shè)身處地地思考如果我是他們的產(chǎn)品設(shè)計師應(yīng)該如何處理;遇見一些深得我心的功能點,我也總是有一種和他們的產(chǎn)品設(shè)計師惺惺相惜的江湖感情。反正久而久之,我邊猜測邊總結(jié),也是養(yǎng)成了自己的一套“歪門邪道”的方法論。




言歸正傳,我們來看這一篇文章的內(nèi)容。


時間來到了2017年,手機(jī)空間越來越大,大家的手機(jī)中也裝了越來越多的app。很多時候,當(dāng)拿起一個朋友的手機(jī),看他手機(jī)里都有哪些應(yīng)用,這些應(yīng)用的優(yōu)先級是如何排布的,我經(jīng)常會從中得出關(guān)于這個人的另一層線索。


比如一個人手機(jī)里優(yōu)先位置上有脈脈、知乎、豆瓣、一個ONE、單讀這幾個app,那我可以推測這個人一定是具備文藝屬性的互聯(lián)網(wǎng)從業(yè)者。


比如一個人手機(jī)封面是吳亦凡或者鹿晗,手機(jī)里優(yōu)先位置上有優(yōu)酷、愛奇藝、騰訊視頻、芒果TV、天貓、京東、蘑菇街這樣的一堆a(bǔ)pp,就可以看出這是一位愛綜藝、愛追星、愛剁手的小姑娘。

……



 1. 意識是主觀形式與客觀內(nèi)容的內(nèi)在統(tǒng)一



如果說2013~2015年app的 UI設(shè)計上充斥了很多同質(zhì)化產(chǎn)品的話,到了2017年,UI設(shè)計師們在dribbble和behance的風(fēng)格影響下,產(chǎn)品的設(shè)計有了更多的發(fā)展空間。我們不得不說的是,現(xiàn)在的app比之前越來越好看和越來越好用了。


如下圖所示我隨意截取了九個我自己覺得UI很棒的產(chǎn)品和大家分享,他們分別是Enjoy、單讀、Artand、Airbnb、一個ONE、Gilt、良倉、Zeen、和氧氣。

Image title

Image title

Image title


那這里有一個關(guān)鍵的問題就出現(xiàn)了,為什么有些app,普通用戶一打開就自然而然地覺得它很美?用戶這種“覺得它很美”的意識到底是從哪兒來的?



在此之前,我先來說兩組哲學(xué)概念。


意識是主觀形式與客觀內(nèi)容的內(nèi)在統(tǒng)一。(馬克思主義哲學(xué))

內(nèi)容決定形式,形式反作用于內(nèi)容。(黑格爾唯心主義哲學(xué))



為了闡述用戶這種“覺得它很美”的意識到底是從哪兒來的,就必須要了解app中“內(nèi)容”和“形式”之間的關(guān)系。那我們不妨來看一下什么叫內(nèi)容,什么叫形式。



2.內(nèi)容


如果斗膽給app設(shè)計工作中的“內(nèi)容”下一個定義的話,我大概會說:內(nèi)容是集成在app中,所有可被感知的圖片、文字、聲音的合集。這里之所以說是可被感知的,主要是從用戶層面上看,忽略了用戶不可感知的“代碼”層面。



那么我們有必要搞清楚的是,一個app的內(nèi)容到底是如何產(chǎn)生的?也就是一個app到底是如何產(chǎn)生的?



那這里我不妨展開一下,假設(shè)我是一個產(chǎn)品設(shè)計師,有一天CEO告訴我最近想做一個電商app。(這里我假設(shè)我們公司很有實力,忽略了市場和運(yùn)營、渠道和資金上的問題,只考慮產(chǎn)品設(shè)計方面。)


那這個時候我會問老板:“老板,你做電商類app,是想做平臺類的呢還是做垂直的呢?你可想好了啊,你做平臺類的想要從淘寶、京東分份額的話,那你必須要有自己的特色。比如國內(nèi)app‘xx’、‘xx’和‘xx’、他們都有自己的特色?;蛘哒f你是想做垂直一些的么?比如‘xx’是專門做化妝品領(lǐng)域的,比如‘xx’是專門做美食的?!比缓罄习灞晃乙环榜Z化”之后得出的結(jié)論是我們來做一個美食電商,但是這個美食電商不會對標(biāo)Enjoy那樣的高檔人群,而是做成類似于“什么值得吃”這樣的大眾場景。


好,故事講完了,現(xiàn)在我化身為這個產(chǎn)品設(shè)計師,簡短片面地闡述我的思考過程:首先我拿到的目標(biāo)是做一款“什么值得吃”app,它的目標(biāo)人群是全中國吃貨,且要滿足吃貨推薦、評價和在線下單支付(前期無法做渠道的話需要跳轉(zhuǎn)淘寶京東鏈接)等功能。



經(jīng)過一番思考,我認(rèn)為這款app的MVP狀態(tài)應(yīng)該需要如下圖所示的功能。

Image title


這里簡單說一下MVP是啥意思?!癕VP=Minimum Viable product(最小可行產(chǎn)品)”是《精益創(chuàng)業(yè)》的作者埃里克·萊斯提出提出的一個概念,字面意思就是可保證產(chǎn)品正常使用(主邏輯閉環(huán))的最小產(chǎn)品單元。MVP又分為Validating MVP和Invalidating MVP,在這里就不展開了?!毒鎰?chuàng)業(yè)》是一本特別贊的書,推薦大家閱讀。


我設(shè)計的這個其實是Invalidating MVP,大概需要四個部分。


“推薦”是核心,以帖子形式或者別的什么形式推薦一些東西并附上鏈接。“專題”方面做一些可供運(yùn)營和推廣的專題,比如“情人節(jié)送什么巧克力”、“最適合食辣族的幾款辣醬”之類?!吧坛恰崩锩鏁乓恍┳誀I的物品。“我的”里面會有我的推薦、我的收藏、我的訂單之類的一堆東西。



你們發(fā)現(xiàn)了嗎,其實這個時候,產(chǎn)品設(shè)計師就已經(jīng)在定義產(chǎn)品的信息架構(gòu)了。


第一,因為這個app叫”什么值得吃”,那我們是不是還需要推薦一些線下值得吃的店呢?如果做了是不是就和Enjoy同質(zhì)化太嚴(yán)重了?那最好就是先不做。



第二,在推薦這一頁里面我大概需要什么功能,因為面向的對象不太像Enjoy那種偏一線城市的人群,那我應(yīng)該用戶群體同類對標(biāo)到今日頭條這種level的感覺。



第三,這個首頁我是按照各種食品屬性的分類來建立推薦列表呢,還是說我按照人的屬性來建立推薦列表呢?如果是按照食物的分類的話,給別人的感覺可能和淘寶很像,比如我在列表里面看到“巧克力”再點進(jìn)去看巧克力的推薦,和我在“甜品族”這個人群標(biāo)簽里看到某巧克力好吃,這兩種行為邏輯給用戶的感覺完全不同。大家體會一下,作為“什么值得吃”這款app來說,肯定是后者更適合,所以得出結(jié)論是以人的屬性建立推薦列表。(我甚至考慮到了以后迭代未來功能版本的可能性,比如到時候每個人可以有多種身份標(biāo)簽,再去做匹配社交之類的。)



好,那我現(xiàn)在關(guān)于產(chǎn)品首頁大概得出了以下幾點感覺。


(1)首頁推薦按照人的屬性標(biāo)簽去區(qū)分推薦列表。

(2)產(chǎn)品風(fēng)格不宜太洋氣(尤其是一定不能像Enjoy那樣使用黑白配色),最好是產(chǎn)品對標(biāo)今日頭條和微博的感覺,受眾偏向二三四線城市。

(3)每一個推薦應(yīng)該有收藏、購買鏈接等部件,在首頁上應(yīng)該有專門為運(yùn)營活動或者市場換量設(shè)置的入口(可能是banner形式)。

(4)為了不使推薦屬性具有傾向性,每一個推薦都應(yīng)該盡量層級平行。(比如“吃辣黨”和“甜品族”就應(yīng)該入口平行。)

(5)一定要保證一個完整且通順的支付邏輯和用戶推薦邏輯,這是最基本的兩個功能。中間可能涉及到推薦里面要有商城鏈接(如果商城沒有的要跳轉(zhuǎn)淘寶),自己的商城要支持支付寶、微信等支付方式,要有訂單狀態(tài)和退單等一系列功能,余額功能或退款自動退回功能二選一(看公司需不需要資金池)。

....(此處省略N條)



其實,app“內(nèi)容”的產(chǎn)生,就是我上述這些奇怪東西的綜合(當(dāng)然其實并沒有上述這么簡單,這個以后有機(jī)會細(xì)講),比如我們從上面的論述當(dāng)中,可以歸納出這款“什么值得吃”app的首頁“推薦”應(yīng)該具有如下信息。

Image title


我寫這么多字其實就是想告訴大家一個app的“內(nèi)容”是如何產(chǎn)生的,當(dāng)然我這里說得十分簡單,真實情況可能比這個復(fù)雜百倍,大家意會就是了。

好了說完了內(nèi)容,我們來看所謂app中的“形式”又是什么。




3.形式



如果說我們把所有集成在app中可感知的圖片、文字、聲音的集合稱作app的內(nèi)容的話,那么app的形式就是“承載這些內(nèi)容,使內(nèi)容更好被感知的方式”。



人有五感,包括視覺、聽覺、嗅覺、味覺和觸覺。而人去和一款手機(jī)應(yīng)用進(jìn)行交互的時候只會從視覺、聽覺、觸覺(反饋)三個方面去感知,而觸覺涉及到交互層面,以后我寫到app的交互架構(gòu)的時候會詳細(xì)說。 聽覺其實也不是本文重點,我舉個例子一筆帶過就好了。比如大家都用過滴滴,滴滴有一個“內(nèi)容(功能)”是司機(jī)送一個乘客的過程中,當(dāng)判斷距離目的地很近的時候會默認(rèn)進(jìn)行一個“下一單的匹配”的功能。我們用滴滴的這個功能來對比手機(jī)游戲里面的“匹配下一局”,我們會發(fā)現(xiàn)這是幾乎相同的“內(nèi)容”,但是承載形式不一樣。手游是視覺展現(xiàn),你必須點擊手機(jī)上的“匹配”按鈕,而滴滴因為考慮到司機(jī)在開車很難解放雙手去點擊匹配,所以從產(chǎn)品邏輯上設(shè)計的是“語音提示+主動匹配+手動接單”的方式,所以我們總能在快下出租車的時候聽到司機(jī)手機(jī)上傳出響亮的“開始接單啦”語音提示。



本文的重點是視覺。

可能在大家以往的工作當(dāng)中并不會關(guān)注一款app原型是怎么樣設(shè)計出來的,大家可能只會關(guān)心我拿到原型以后應(yīng)該如何轉(zhuǎn)化為驚艷的高保真頁面。

把一個內(nèi)容整理、排列成一個app頁面,就是大家更關(guān)心的“形式”的部分。還是回到上文“什么值得吃”這款虛構(gòu)的app上,綜合上面的觀點,我大致能畫出原型如下圖所示兩種。

Image title


當(dāng)然這個是最粗糙的原型。(如果各位UI設(shè)計師在工作中接到了類似于這樣的原型那只能說心疼你們一秒。)那么問題來了,大家在生活中一定見到過這兩種原型的app。左邊這個很常見,比如斗魚tv這些直播平臺,早期閑魚、網(wǎng)易嚴(yán)選和今日頭條等都是用的這種感覺;右邊這個就更常見了,不論是點餐平臺(美團(tuán)、百度、餓了嗎),還是大型電商(京東、淘寶)你都可以看到它。



那么問題來了,嘗試分析一下,上面這兩種形式到底有什么優(yōu)劣呢?


第一件事應(yīng)該想到的是如果需要采用右邊的排列形式就必須要控制標(biāo)簽(tag)的字?jǐn)?shù),你懂我是什么意思吧?比如今天有個運(yùn)營跳出來說我們做一個新的標(biāo)簽把名字叫“酸酸甜甜就是我”。產(chǎn)品一定特別崩潰,原因如下圖所示。

Image title

   

第二,由于右邊的標(biāo)簽占據(jù)了推薦貼的位置,導(dǎo)致推薦貼可能沒有左邊的那種展現(xiàn)形式更加醒目。但是相對的,右邊的優(yōu)勢在于,由于豎向排列可以讓一個屏幕顯示更多的標(biāo)簽,這一點就需要取舍,比如一個產(chǎn)品的初期沒準(zhǔn)備放這么多切換標(biāo)簽的話,還是建議用左邊那種。


更深層次的,外賣產(chǎn)品之所以用右邊這種形式是因為力求一屏展示更多的菜,而且外賣產(chǎn)品的左側(cè)標(biāo)簽一般是一家店鋪的菜的品類,用戶下滑菜品配合點擊品類,點完即走,很方便(京東和淘寶電商類平臺也是類似的)。但是比如早期的今日頭條只能采用左邊的這種形式,因為頭條是需要用戶長時間沉浸的,比如用戶選中一個“體育”的標(biāo)簽一般要看好久好久,用戶需要沉浸在這個標(biāo)簽下的內(nèi)容中,那這個時候顯然用右邊這種設(shè)計方式讓標(biāo)簽常駐屏幕左側(cè)是不合適的。



基于以上分析,作為內(nèi)容+電商平臺的“什么值得吃”應(yīng)該選用左邊這種設(shè)計形式。

好,“什么值得吃”這個虛擬的例子就說到這里,主要是讓大家明白內(nèi)容和形式之間的關(guān)系,只有你們明白了這個,才可以正式進(jìn)入本章的主題——app的視覺美成因分析。




4.app的視覺美成因分析



首先來看結(jié)論。一款app讓你感覺到長得美,一定是團(tuán)隊在兩個方面下功夫了——第一是內(nèi)容的視覺優(yōu)化,第二是形式的視覺優(yōu)化。


我先來給你們看兩張圖,讓你們感受一下什么叫內(nèi)容的視覺優(yōu)化。

Image title


你們可以看到左右兩張圖,左邊是Enjoy的精選頁,右邊是我隨手糟蹋的,大家會發(fā)現(xiàn)其實信息內(nèi)容一模一樣,但是左邊的和右邊的視覺設(shè)計差距大家一眼就能看出來吧。如果出現(xiàn)右邊這樣的UI稿,那只能說明這個團(tuán)隊在內(nèi)容的視覺優(yōu)化上面不用心!以上就是內(nèi)容的視覺優(yōu)化的作用。關(guān)于內(nèi)容當(dāng)中的圖片,其實大家都有直觀感受:一款app允許用戶自定義的圖片越多,這款app視覺就一定越難把控。原因很簡單,因為用戶自定義的信息里面,文字信息我們是可以通過限制字段和select(選擇)去控制的,但是對于圖片來說,哪怕控制了用戶自定義圖片的尺寸,我們也無法控制這些圖片的質(zhì)量。大家去看一下秒拍這款app,它的框架設(shè)計做得很棒,包括一些empty status(無內(nèi)容狀態(tài)頁)的小圖標(biāo)繪制都很棒,但是我們打開app的時候,首頁的內(nèi)容總是參差不齊,差強(qiáng)人意。同理還有閑魚這款app, UI框架做得很漂亮,但是內(nèi)容頁面總會顯得沒那么“高大上”。


Enjoy,自如、氧氣、想去以及Gilt、美團(tuán)等這些輕量電商或者租房app都選擇花一大筆成本自己聘請一批或全職或兼職的攝影師的原因,就是為了得到符合自己規(guī)范的優(yōu)質(zhì)內(nèi)容圖片(比如你們?nèi)タ醋匀绲姆吭葱畔⒄掌揪褪悄欠N樣子,氧氣的內(nèi)衣樣片背景永遠(yuǎn)是白色)。


我之前做過一款旅行游學(xué)類app,在立項之初我們的圖庫里面就已經(jīng)有了幾萬張高質(zhì)量有版權(quán)的攝影師作品,然后在設(shè)計的過程中大膽采用流式布局(類似于今天開眼app),大量展示優(yōu)質(zhì)圖片,才使得在2015年初那個時期我們的UI風(fēng)格比較具有鮮明的特色。



其實這也是一個產(chǎn)品團(tuán)隊需要深思熟慮的點:


·比如旅行app,一定要有大量優(yōu)質(zhì)的圖片作為依托才可能美。

·比如淘寶這種體量的大型電商,那除了盡可能控制圖片質(zhì)量以外,更多的應(yīng)該在優(yōu)化專題和banner上,并且告訴入駐商家(用戶)上傳優(yōu)質(zhì)的圖片更容易獲取用戶流量從而轉(zhuǎn)化為成訂單。

·比如知乎、貼吧之類這樣的問答和社區(qū),用戶上傳的圖片五花八門千奇百怪,那我們可以考慮在首頁列表展示的時候就壓根不要展示圖片……



那是不是內(nèi)容的視覺優(yōu)化只包含圖片的優(yōu)化呢?其實不是的,除了圖片的視覺優(yōu)化以外,icon的優(yōu)化、文字的視覺優(yōu)化這些都是很重要的。


關(guān)于icon的優(yōu)化大家應(yīng)該已經(jīng)看過足夠多的文章在這里我就不贅述了,比如線性icon里面不能摻入塊狀icon,負(fù)空間icon里面不應(yīng)突然出現(xiàn)一個奇怪的漸變icon。我有一點心得可以分享,比如大家畫了一個2px的線性圖標(biāo)用于@2x,那在plus iPhone 的plus機(jī)型,6p 7p 8p都叫plus上面應(yīng)該要手動調(diào)整一下圖標(biāo)變成3px而不是用png自動生成,否則會有虛邊(除非你們的工程師使用的是svg的iconfont)。


關(guān)于文字的視覺優(yōu)化,幾乎市面上的所有app,只要涉及文字內(nèi)容的排版,毫無例外都做得很好了。從根源上出發(fā),為什么一個設(shè)計師需要去不厭其煩像個工匠一樣折磨開發(fā)調(diào)整字體大小間距粗細(xì)什么亂七八糟的東西?其實,字體視覺優(yōu)化去達(dá)到的目的主要有兩點:


(1)輔助視覺對焦

(2)減輕視覺壓力


第二點沒什么好說的了,大家應(yīng)該都明白,主要說第一點,視覺對焦這個事情是這樣的,我們在一個界面中,如果不出現(xiàn)特別突兀的信息,正常人眼一般是從左到右,從上到下的順序閱讀。

Image title


比如上圖是一個閱讀界面,所有問題都沒有特別突兀的地方。我們把界面做一個高斯模糊去分析視覺焦點,會發(fā)現(xiàn)整個頁面呈現(xiàn)很平和,所以,這個頁面的閱讀順序應(yīng)該是一行一行地閱讀文字,也就是從上到下,從左到右。

但是,這只是頁面形式很平的情況,舉個沒那么平的例子。

Image title


上圖是知乎的一個頁面,我們把它去色并且高斯模糊去分析它的視覺焦點。大家會發(fā)現(xiàn)其實視覺焦點是加粗加大的標(biāo)題字體和上面的小頭像構(gòu)成的。

Image title



這就是使用文字優(yōu)化去輔助視覺對焦。我不妨再舉一例,大家來看下面的2016年5月左右的氧氣app截圖。

Image title


左邊是氧氣的原UI,右邊是我做的對比圖。顯然,關(guān)于文字優(yōu)化輔助視覺對焦這一點,氧氣的設(shè)計師深諳此道。他們沒有按照右邊那種傳統(tǒng)辦法設(shè)計這個頁面,而是把每一個深夜話題的題目都變成了一張圖,變成一張圖還不算,還在這張圖上面用淺綠色“劃了重點”。這樣雖然加大了設(shè)計師的工作量,但是這個頁面正是因為這樣的處理,能讓用戶第一眼聚焦到標(biāo)題上。

Image title


關(guān)于內(nèi)容的視覺優(yōu)化,我來總結(jié)一下吧。


app內(nèi)容是集成在app中,所有可被感知圖片、文字、聲音合集。那么內(nèi)容的視覺優(yōu)化主旨在于通過圖片,文字,圖形(icon)等的優(yōu)化,去使得app更加易讀、易用和美觀。



說完了內(nèi)容的視覺優(yōu)化,我們再看一下形式的視覺優(yōu)化案例。按說只要內(nèi)容都已經(jīng)優(yōu)化好了,表現(xiàn)內(nèi)容的形式不是排得特別爛,視覺效果展現(xiàn)出來應(yīng)該都不錯。我們再重復(fù)一遍app形式的定義——能更好地承載內(nèi)容,使內(nèi)容更好地被感知的方式。


我們該如何去排列不同的內(nèi)容讓它們更好地被感知呢?



這里面最常見的方法就是UI組件化設(shè)計,關(guān)于UI組件化設(shè)計我個人的定義是一款app里面同樣形式排列但是不同內(nèi)容的單元。這樣的例子不勝枚舉,我們每天都見到的最常見的一個組件化設(shè)計是微信里的每一個table view (表格視圖)。

Image title


大家打開你們的微信,可以看到其實微信的聊天列表的每一個單元都是由固定的內(nèi)容組成的。內(nèi)容包含一張圖(頭像),兩段文字(名字和信息),一段時間組成。

再看以下兩個頁面。

Image title


先看左面這個頁面,雖然第二個品牌故事被遮擋了很多,但是由于我們看到了第一個GUCCI的banner之后,用戶心理預(yù)期就有了,用戶左滑一下屏幕大概率出現(xiàn)的也是這樣形式的不同內(nèi)容。


再看右邊這張圖,一個app的每一個專題都是以一本雜志的形式呈現(xiàn)的,所以當(dāng)你看到這個頁面的時候,用戶心里會有“我左滑右滑都是一本專題書”的預(yù)期。



在設(shè)計過程中,我們往往會把相同屬性的內(nèi)容設(shè)計成同一形式。這樣做有什么優(yōu)點呢?最大的優(yōu)點是減少用戶認(rèn)知負(fù)擔(dān),使得內(nèi)容更好地被感知。

舉個大家都懂的格式塔的例子。

Image title


看上圖A,大家都知道接下來一個一定是正方形,但看上圖B,下一個別說你們不知道是什么,我也不知道。格式塔相似律告訴我們,人們在知覺時,對刺激要素相似的項目,只要不被接近因素干擾,會傾向于把它們聯(lián)合在一起。



那么我們就很容易解釋下圖。

Image title


大家看到這里是不是很熟悉?聯(lián)系上下文,現(xiàn)在應(yīng)該知道為什么市面上的app都這么設(shè)計了吧?還不就是為了讓用戶更好地接受信息。




5.總結(jié)



一切UI設(shè)計本質(zhì)上是為了更好地展現(xiàn)信息。

更好地展現(xiàn)信息是為了更好地指引用戶完成交互操作,從而讓用戶更好地去接收信息并完成一定功能目的。



本章一直在講述app信息呈現(xiàn)上的視覺優(yōu)化。其實視覺優(yōu)化也好,邏輯優(yōu)化、交互優(yōu)化也罷,都是為了使得app更加好用、易用、有效。



在我剛開始接觸UI設(shè)計的時候,也曾經(jīng)沉迷dribbble,不斷模仿那些大師們的驚艷界面。在長達(dá)一兩年的學(xué)習(xí)和工作中,我一直認(rèn)為UI設(shè)計師的本職工作就是畫一個漂亮的殼子,把信息裝進(jìn)去然后能讓app變得更好看而已。


但是后來我完全不這樣想,如果現(xiàn)在讓我評價一款app的UI,我可能真正最看重的那個維度已經(jīng)不是“視覺感覺”上的好看,而是“視覺邏輯”上的嚴(yán)謹(jǐn)和“視覺風(fēng)格”上的一體化,比如分割線,比如icon的樣式,比如tableview(表格視圖)的設(shè)計,比如字體的主次對比等。



當(dāng)我沒有理由的畫一條分割線,只為了分割兩個也不知道是啥的元素時,當(dāng)我沒有理由地就是想要為卡片化組件加上一個box-shadow(陰影)時,當(dāng)我沒有理由的設(shè)計一個奇怪的交互方式還硬說它特別好用時,我都在警醒自己一句話:每一個UI界面的設(shè)計都應(yīng)該被賦予應(yīng)有的理由。希望以此共勉。


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

 


美團(tuán)點評 UED 總監(jiān):突破設(shè)計邊界,互聯(lián)網(wǎng)變革幸存之道

資深UI設(shè)計者


如果您想訂閱本博客內(nèi)容,每天自動發(fā)到您的郵箱中, 請點這里

美團(tuán)點評 UED 總監(jiān)崔穎韌(下文簡稱崔校長)認(rèn)為:曾經(jīng)設(shè)計師僅靠一技之長就能在行業(yè)內(nèi)生存,但互聯(lián)網(wǎng)行業(yè)瞬息萬變,如今,人工智能的設(shè)計水平都可以達(dá)到設(shè)計助理的級別。在互聯(lián)網(wǎng)變革下,設(shè)計師只有不設(shè)限,擴(kuò)展自己的價值空間,才能在這場持久戰(zhàn)中成為最后的贏家。

一、設(shè)計師的現(xiàn)狀

1. 設(shè)計師已經(jīng)開始被人工智能取代

2018年緊跟2017,是人工智能重點發(fā)力的一年,關(guān)于「人工智能會完全取代設(shè)計師」的話語層出不窮,很多從業(yè)者倍感危機(jī)。

崔校長表示,AI 時代是真的來了,設(shè)計師也開始被人工智能所取代。

現(xiàn)在,很多負(fù)責(zé)垂直業(yè)務(wù)的運(yùn)營設(shè)計師已經(jīng)參與到智能體系建設(shè)中,建設(shè)素材庫、設(shè)定配色、排版規(guī)則和標(biāo)準(zhǔn),幫助訓(xùn)練 AI 等。

甚至美團(tuán)點評也開發(fā)了可以做 Banner 的智能設(shè)計系統(tǒng),不光可以做 Banner,今年內(nèi)還可以自動生成活動主頁和簡單 H5 頁面,而且是多品類覆蓋,包括餐飲、休娛、麗人等。

相應(yīng)的,設(shè)計部門原先計劃申請的運(yùn)營設(shè)計師人數(shù)就減少,甚至不新增了。

盡管 AI 的強(qiáng)勢沖擊很嚇人,但是設(shè)計師工作中,例如設(shè)計師對目標(biāo)受眾的理解,現(xiàn)階段是沒有機(jī)器可以替代的,頂尖設(shè)計師的專業(yè)技能在沖擊之下,反而會更加突出、顯眼。

2. 國內(nèi)設(shè)計師普遍話語權(quán)不高

在國外,很多優(yōu)秀的公司都是設(shè)計驅(qū)動,而國內(nèi)設(shè)計師普遍話語權(quán)不高。

針對這個現(xiàn)象,崔校長認(rèn)為,實際上國外很多「設(shè)計驅(qū)動」的公司,本質(zhì)上是 CEO 驅(qū)動,有一個重視用戶體驗的 CEO,那么全公司做事都會重視用戶體驗。實質(zhì)上是 CEO 在驅(qū)動,設(shè)計僅僅是執(zhí)行。

而在國內(nèi),行業(yè)環(huán)境沒有那么舒服,特別是偏傳統(tǒng)的公司,高管層對用戶體驗的價值認(rèn)知非常弱,所以才會有設(shè)計師話語權(quán)低的問題。

如果要解決這個「歷史難題」:

  • 首先,設(shè)計團(tuán)隊本身要對用戶體驗有清晰正確的認(rèn)識,不能唯設(shè)計、唯用戶體驗論;
  • 然后,通過專業(yè)手段,既保障了用戶體驗,又良好的解決了商業(yè)問題,

那么一定是可以在業(yè)務(wù)團(tuán)隊那邊贏得認(rèn)可的。

有了實際案例證明價值,下一步就可以做一些跨團(tuán)隊的用戶體驗概念普及,去提供相關(guān)的認(rèn)知度。

美團(tuán)點評是一個高管層很重視用戶體驗的公司。在美團(tuán)點評,用戶體驗部的價值是可以得到足夠認(rèn)可的。

在這樣的情況下,大家依然會努力拓展自己的價值空間,會突破邊界,比如說交互設(shè)計師會做一些用戶研究和產(chǎn)品分析相關(guān)的事情。

項目產(chǎn)品 Leader 只需提供一個產(chǎn)品目標(biāo),而在「戰(zhàn)略層、范圍層、結(jié)構(gòu)層、框架層、表現(xiàn)層」五個層面的分析研究和輸出工作,交互設(shè)計師都可以完成,產(chǎn)出一個完整的項目提案報告。

由此可見,設(shè)計工作者只要有實際案例證明價值,得到 Leader 的認(rèn)可,加上持之以恒的拓展自身價值,提高自身話語權(quán)不是問題。

3. 對產(chǎn)品設(shè)計的認(rèn)識還停留在圖形界面

很多剛工作的設(shè)計師擺脫不了專業(yè)的束縛,認(rèn)為設(shè)計只是圖形的搭建,沒有更多思考。

對此,工作經(jīng)驗豐富,且閱人無數(shù)的崔校長表示,這是一個普遍現(xiàn)象,也是一個正常的現(xiàn)象。

在社會化精細(xì)分工的時代,設(shè)計師從專業(yè)入手,自然而然地,一開始認(rèn)知會局限在圖形界面上。隨著專業(yè)級別的提升,會擴(kuò)大認(rèn)知范疇,看到界面之外的東西。這是基本規(guī)律,沒有捷徑。

古語說:

不謀全局者,不足謀一域。

設(shè)計師應(yīng)該有意識去突破邊界,這是正確的方向?,F(xiàn)實中有很多人無法突破瓶頸,往往是拒絕突破邊界,思維的局限導(dǎo)致了個人價值的局限。

4. 設(shè)計的好壞沒有絕對的評判標(biāo)準(zhǔn)

大家都知道,設(shè)計是有好壞之分的,但卻不一定清楚這個評判好壞的標(biāo)準(zhǔn)。

崔校長認(rèn)為,設(shè)計師沒有一個絕對標(biāo)準(zhǔn)來評判好壞的。

在商業(yè)團(tuán)體中,一切資源投入都是為了達(dá)成商業(yè)目的,所以能幫助達(dá)成這個目的的設(shè)計就是好設(shè)計,這是一個評判標(biāo)準(zhǔn)。而具體的標(biāo)準(zhǔn),根據(jù)團(tuán)隊的商業(yè)目的差異,有很大區(qū)別。

在商業(yè)團(tuán)體中,用戶體驗是實現(xiàn)商業(yè)目的的一種手段,脫離商業(yè)目的,講純粹的用戶體驗就是耍流氓。

只有擺正了這個認(rèn)識,在職場中就更容易獲得成功。

二、設(shè)計師的突破

1. 保障用戶體驗是第一標(biāo)準(zhǔn)

現(xiàn)在,很多人都在倡導(dǎo),設(shè)計規(guī)范化、組件化,這種趨勢是有利有弊的。

針對這個趨勢,崔校長建議,不能唯規(guī)范唯組件論。雖然規(guī)范化、組件化這類比較基本的設(shè)計增效手段,可以明顯提升基層效率和基礎(chǔ)質(zhì)量,但是規(guī)范和組件只能保障底線,無法拉高設(shè)計質(zhì)量的上限。

比如有的設(shè)計師會跟產(chǎn)品說,我們的規(guī)范如此,所以只能這么設(shè)計,這是錯的,規(guī)范不是一刀切的標(biāo)準(zhǔn),保障用戶體驗才是第一標(biāo)準(zhǔn)。

該用規(guī)范組件的時候就用,如果場景上不適用也不能硬用。

2. 用戶體驗設(shè)計,不僅僅要把界面做好看

作為用戶體驗設(shè)計師,要有把界面做美觀的能力。

除此之外,崔校長還說:

界面好看是最表層的設(shè)計體現(xiàn),真正的用戶體驗遠(yuǎn)不止于此。

《用戶體驗的要素》所描述的「戰(zhàn)略層、范圍層、結(jié)構(gòu)層、框架層、表現(xiàn)層」五個要素,要做到都充分、專業(yè)、邏輯連貫,最終才能獲得一個在線產(chǎn)品的良好用戶體驗。

在構(gòu)建一個良好的用戶體驗時,更重要的是表現(xiàn)層背后的商業(yè)體系、產(chǎn)品目標(biāo)、用戶心智模型,對設(shè)計依據(jù)做充分的研究和挖掘才是根本。

3. 方法論為主導(dǎo),找靈感

遭遇設(shè)計瓶頸時,找靈感也是有技巧的,有一部分設(shè)計師,憑空想靈感,這是低效的。

崔校長建議,以方法論為主導(dǎo),找靈感。

崔校長說:

設(shè)計的目的是為了解決問題,應(yīng)該以理性思維為主導(dǎo),去定義問題,分析問題,解決問題。如果以 Idea 導(dǎo)向,也就是通過試錯來驗證有效 Idea,這跟碰運(yùn)氣差不多,效率非常低下。

在美團(tuán)點評上海用戶體驗部的設(shè)計路徑中,總體是以方法論來主導(dǎo),僅在方案的表現(xiàn)層,會運(yùn)用頭腦風(fēng)暴和素材搜集的方式幫助激發(fā)靈感、發(fā)散方案。

4. 注重自身和團(tuán)隊的共同成長

在學(xué)習(xí)、成長上,每個工作者都更注重自我的成長,這是必然的,設(shè)計師也不例外。

但工作究其根本,是自我成長、團(tuán)隊成長、產(chǎn)品成長的結(jié)合,優(yōu)秀的團(tuán)隊一定都是非常注重這三方面成長的,美團(tuán)點評也是如此。

崔校長說,美團(tuán)點評有涵蓋各個專業(yè)的互聯(lián)網(wǎng)+大學(xué),在設(shè)計方面設(shè)有設(shè)計學(xué)院,沉淀了很全很豐富的方法論和案例,同時公司還有復(fù)盤文化,大家會從每次的項目實踐中,總結(jié)經(jīng)驗、獲得知識。

崔校長建議,設(shè)計師應(yīng)該嘗試「跨界」,個人能在其中飛速成長,這是經(jīng)驗之談。

校長本人是學(xué)計算機(jī)專業(yè)的,做過產(chǎn)品經(jīng)理,最后在設(shè)計領(lǐng)域深耕。

這樣的綜合角色幫助他更宏觀、更完整地去看產(chǎn)品體驗搭建的過程;能夠更好的理解上游產(chǎn)品角色到底關(guān)心什么,下游開發(fā)角色需要什么;能夠更好的跟相關(guān)角色溝通,并讓設(shè)計發(fā)揮更大的價值。

所以設(shè)計師不僅要注重外部學(xué)習(xí)環(huán)境,還要注重自身的跨界、不斷拓寬邊界,自身和團(tuán)隊共同成長,這對你職業(yè)生涯的發(fā)展產(chǎn)生不可估量的價值。

5. 優(yōu)秀的設(shè)計團(tuán)隊不能沒有管理者

設(shè)計不是單打獨斗。

一個優(yōu)秀的團(tuán)隊?wèi)?yīng)該注意哪些問題呢 ?

對團(tuán)隊進(jìn)步起著關(guān)鍵性作用的管理者應(yīng)該是怎樣的呢?

對此,崔校長認(rèn)為,優(yōu)秀的設(shè)計團(tuán)隊在團(tuán)隊建設(shè)上,要有完善的管理制度、完善的專業(yè)體系、扎實的人才梯隊,在結(jié)果上要有優(yōu)秀的產(chǎn)品案例。

作為 Leader :

  • 首先,要專業(yè)過硬、學(xué)習(xí)能力強(qiáng)、格局大;
  • 然后,要賦能團(tuán)隊,用你的決策力賦能,給團(tuán)隊判斷正確的方向,不走錯路;
  • 用專業(yè)能力賦能,指導(dǎo)團(tuán)隊提升專業(yè)高度;
  • 用協(xié)調(diào)能力賦能,讓團(tuán)隊運(yùn)作更。

剛剛成為 leader 的同學(xué),可能會不適應(yīng)與設(shè)計師完全不同的工作模式。

對此,崔校長建議,此時你最需要注意的是思維轉(zhuǎn)換。思維轉(zhuǎn)換首先需要明確三個角色,崔校長總結(jié)為「三位一體管理模型」,分別是教練、裁判、經(jīng)理,這三者缺一不可。

  • 在項目過程中,要發(fā)揮教練角色,進(jìn)行專業(yè)指導(dǎo),保障設(shè)計輸出質(zhì)量,如果教練角色缺失,設(shè)計質(zhì)量難以提高,設(shè)計師成長難。
  • 在評審和決策的時候,要發(fā)揮裁判角色,給出明確的結(jié)論,承擔(dān)決策責(zé)任,如果裁判角色缺失,容易變成甩鍋俠,把自己的責(zé)任丟給基層設(shè)計師,設(shè)計質(zhì)量容易失控,也會導(dǎo)致設(shè)計師壓力過大,產(chǎn)生流失。
  • 最后是經(jīng)理角色,去思考團(tuán)隊建設(shè),去選擇團(tuán)隊需要的設(shè)計師,對設(shè)計師的績效進(jìn)行判斷,識別出哪些應(yīng)該重點培養(yǎng),哪些應(yīng)該淘汰換血。經(jīng)理角色缺失會導(dǎo)致吃大鍋飯的局面,團(tuán)隊能力止步不前,陷于平庸化。

6. 保持溝通

溝通,在設(shè)計師的工作內(nèi)容中占了不小的比例。

跟團(tuán)隊同事進(jìn)行合理的溝通,在一定程度上,能提高工作效率,專注設(shè)計質(zhì)量,將更多的時間放在設(shè)計本身。

對此,美團(tuán)點評崔校長很有發(fā)言權(quán)。

美團(tuán)點評上海用戶體驗部現(xiàn)在有100多位設(shè)計師,對接的產(chǎn)品經(jīng)理在500人以上,對接的程序員在1000人以上,而且上下游部門都是分散的。

產(chǎn)品部門和研發(fā)部門都是多個的,不像 UED ,只有一個部門統(tǒng)一管理,那么溝通方面確實有很大的難度。

崔校長表示,為了團(tuán)隊溝通更,美團(tuán)點評內(nèi)部要求 Leader 跟相關(guān)部門的 Leader 建立良好的溝通機(jī)制,保障信息通暢;然后,用設(shè)計流程規(guī)范,來要求設(shè)計師跟自己的上下游對接方充分溝通;最后,團(tuán)隊風(fēng)格上推動設(shè)計師走出去,深入上下游討論和協(xié)作,跟進(jìn)產(chǎn)品討論會,多到開發(fā)位置上確認(rèn)實現(xiàn)的細(xì)節(jié)。

崔校長還分享了一個關(guān)于溝通的小故事:

在搬了辦公區(qū)之后,產(chǎn)品的座位離設(shè)計師只有一個過道之隔,于是設(shè)計師開始有了一些「小煩惱」。產(chǎn)品經(jīng)理一有問題就隨時找設(shè)計師討論,設(shè)計師的工作總被打斷,卻不太好意思拒絕產(chǎn)品。

這是一個比較有趣的現(xiàn)象,說明產(chǎn)品跟設(shè)計師之間溝通非常緊密,而且很信任設(shè)計師的專業(yè)度,能夠一起有效地解決問題。

這個場景在團(tuán)隊內(nèi)部時有發(fā)生,這個「煩惱」對設(shè)計師而言,可以說是不可避免的。

對此,崔校長建議設(shè)計師要做好時間管理,掌握好溝通的時間安排,不能影響了總體的設(shè)計效率。

總結(jié)

設(shè)計不設(shè)限,是每一個設(shè)計師都應(yīng)該思考的方向。

只有自己不甘現(xiàn)狀,勇敢突破,才能以更高的速度進(jìn)步,才能在互聯(lián)網(wǎng)高速發(fā)展的現(xiàn)在,甚至未來,成為最后的贏家。

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

半年做了兩個APP,我總結(jié)出這6個實戰(zhàn)經(jīng)驗

資深UI設(shè)計者

如果您想訂閱本博客內(nèi)容,每天自動發(fā)到您的郵箱中, 請點這里

一、團(tuán)隊工作,妥協(xié)是一門學(xué)問

一個產(chǎn)品最后出來的樣子,是各種妥協(xié)的結(jié)果。

互聯(lián)網(wǎng)產(chǎn)品和平面類型的設(shè)計工作最大的區(qū)別,可能是在于工種的細(xì)分上。之前做平面相關(guān)的工作(品牌,視覺,電商),自己一個人可能就充當(dāng)了基本上除了印刷以外的所有主要工作,既要和客戶溝通,了解用戶需求和想法以及存在的問題,又要思考和制定設(shè)計方案,向客戶展示設(shè)計提案,又要執(zhí)行獲得認(rèn)可的設(shè)計提案,保證設(shè)計成果符合客戶預(yù)期并落地,如果是最后要交付印刷品,可能還要跟進(jìn)印刷的過程,保證印刷物料的質(zhì)量。好像一個人把所有的活都要干了。

但是互聯(lián)網(wǎng)產(chǎn)品不太一樣,首先最大的問題是如何讓方案落地的過程,這個工作一般來說沒有辦法一個人干(除非是牛到精通前端后端和客戶端的各種開發(fā)語言的全棧設(shè)計師),因為會涉及到程序開發(fā),有一些設(shè)計師,就算你厲害了,你能把產(chǎn)品交互和 UI 都搞定,然后你還會(web端)前端開發(fā)語言或者客戶端開發(fā)語言,但是你還是需要一個能寫后臺的工程師,所以,正常情況下,互聯(lián)網(wǎng)產(chǎn)品的開發(fā),是環(huán)環(huán)相扣的,至少都需要兩到三個人來配合工作。這還是比較小型的產(chǎn)品,如果是復(fù)雜的產(chǎn)品,那每個環(huán)節(jié)都必須細(xì)分出來,而且可能每個環(huán)節(jié)都不止一個人,產(chǎn)品,交互,UI,前端,客戶端,后臺,因為每個環(huán)節(jié)的工作量都太大了!

△ 圖源:Nick Taylor

既然有這么多的分工,那必然會導(dǎo)致不同的工作崗位看問題的點都是不一樣的。舉個例子:經(jīng)常會聽到開發(fā)說,明明用 A 就可以,為什么非要用 B?一開始的時候,其實我真的不太理解,但是后來慢慢熟悉了開發(fā)的工作之后(尤其是自己開始學(xué)習(xí)一些代碼知識之后)慢慢理解了,其實開發(fā)在實現(xiàn)我們的設(shè)計的時候,最關(guān)注的是功能的實現(xiàn),而功能就是各種交互的集合,一個頁面上,如果交互不變,功能不變,只是改一些視覺上的樣式,這是相對來說簡單的,如果牽扯到交互的調(diào)整和修改,那個工作量可能就成倍增加,所謂牽一發(fā)而動全身。所以我們在設(shè)計的時候,更要注意模塊和組件的一致性和可復(fù)用性,這樣不僅可以提高我們的設(shè)計質(zhì)量,也可以有效的減少開發(fā)的工作量,提高開發(fā)的效率。

同時,開發(fā)在實現(xiàn)的第一個版本的產(chǎn)品中一般很多時候視覺上會有各種各樣的問題,開發(fā)人員在開發(fā)過程中,為了提率,不太在意還原 UI 的細(xì)節(jié),比如這個間距是多少,那個間隔是幾個像素,所以最后產(chǎn)品上線前都會有 UI走查的環(huán)節(jié),在這個過程中就是要一點一點地改進(jìn)產(chǎn)品UI 實現(xiàn)中不符合設(shè)計稿的地方,這個時候才是我們設(shè)計師關(guān)注所謂的每一個像素的時候,在那之前,還是先關(guān)注功能和流程的實現(xiàn)吧。

其實不僅僅是因為每個崗位的職能不同會導(dǎo)致很多不同的意見,有時候也可能是因為每個人的審美或者是性格的問題,也會產(chǎn)生不少的摩擦,所以,學(xué)會妥協(xié),在妥協(xié)中堅持是團(tuán)隊合作中的一門大學(xué)問。

二、把自己定位為產(chǎn)品設(shè)計師

以攻為守,讓自己從更全面的視角去思考 UI 的工作。

△ 圖源:Nick Taylor

一個 UI設(shè)計師的未來在哪里?有時候我會思考這樣的問題,有可能是因為我已經(jīng)30了。這一兩年,危機(jī)感很重,每次看到非科班群里各種90后、95后的年輕設(shè)計師,心生羨慕的同時也充滿了莫名的壓力。

這半年多因為自己團(tuán)隊中沒有專門的交互設(shè)計師,所以我就同時肩負(fù)了大部分交互設(shè)計的工作。一開始做交互設(shè)計的東西,其實自己的認(rèn)識還是很淺薄的,雖然平時自己也看很多用戶體驗,設(shè)計心理學(xué)、交互設(shè)計等等的書籍,但是真的上手干活,還是會經(jīng)常一頭霧水,因為交互設(shè)計太需要縝密的邏輯思維了。市場上常見的 app 的標(biāo)準(zhǔn)化的交互設(shè)計因為都有競品參考,還是相對來說簡單的,在我看來比較難的是工具型的產(chǎn)品和 CMS(內(nèi)容管理系統(tǒng)后臺),尤其是 CMS 的交互設(shè)計,如果設(shè)計不好,分分鐘讓用的人感覺要崩潰。交互設(shè)計是一門很深的學(xué)問,也是 UI設(shè)計師必須去了解和熟知的,它絕不是簡單的頁面之間的跳轉(zhuǎn),也不僅是酷炫的動效,它是能讓產(chǎn)品的使用體驗得到質(zhì)的飛躍的關(guān)鍵。

如果把一個產(chǎn)品比作一個人,那產(chǎn)品本身的方向是這個人的靈魂和思想,交互是這個人的舉止和修養(yǎng),而 UI 是一個人外形和穿衣品味以及整體氣質(zhì),優(yōu)秀的人,三者缺一不可,三者是共生的關(guān)系。

在我看來。成為一個產(chǎn)品設(shè)計師,了解產(chǎn)品思維,熟悉交互設(shè)計,精通視覺設(shè)計,這樣的設(shè)計師覺得才是以后互聯(lián)網(wǎng)設(shè)計師的標(biāo)配。高配是什么?我覺得至少是全棧設(shè)計師吧。這就像平面設(shè)計領(lǐng)域,不懂印刷各種工藝和材質(zhì)的,都稱不上好的平面設(shè)計師。好的建筑設(shè)計師,也得懂很多建筑學(xué)和建筑材料的知識。

我在這半年的實際工作中,雖然第一個產(chǎn)品的概念定義和原型我沒有參加討論(我去的時候已經(jīng)定下來了),但是我還是嘗試去思考這個產(chǎn)品到底意義在哪里,目標(biāo)用戶是哪些人,解決了目標(biāo)用戶的什么需求,他們的使用場景有哪些。我一直都認(rèn)為互聯(lián)網(wǎng)產(chǎn)品的設(shè)計工作始終更是貫穿著設(shè)計思維,只是每個具體的分工的側(cè)重點不同,你可以不精于產(chǎn)品需求的整理和篩選,但你是得明白你你所設(shè)計的是為了滿足什么需求,有目標(biāo)和方向才能做出更好的設(shè)計,你連問題都不知道,怎么去解決問題。設(shè)計的工作,終究都是為了解決問題,不了解問題的來龍去脈,便不能梳理出問題的本質(zhì),更無法做出好的設(shè)計去解決問題。

把自己定位為產(chǎn)品設(shè)計師,稍微多花點心思去思考產(chǎn)品,去學(xué)習(xí)交互,別讓自己的眼界停留在只畫幾個好看界面,畫幾套特別的圖標(biāo),不然你早晚要被這個行業(yè)淘汰,不對,是被其他更優(yōu)秀的設(shè)計師淘汰。

三、牢記UCD,但別太天真

很多公司并不真的在意所謂的 UCD。

△ 圖源:Nick Taylor

我相信大部分的設(shè)計師還是在中小型的企業(yè)里工作,這樣的企業(yè)的設(shè)計工作有一個很明顯的特征,就是以主管或者老板的喜好為第一滿足目標(biāo),所有的設(shè)計方案都會以老板的喜好為基準(zhǔn)參考,只有老板說 ok 才算是 ok。當(dāng)然,我們公司也是,畢竟我們也是一個小型公司,而且老板的個人風(fēng)格特別強(qiáng)烈。所以在做第一款 app 時,僅僅是首屏的視覺方案,都出了不止七八個版本。在進(jìn)入更加深入的其他頁面的設(shè)計環(huán)節(jié)時,我們也沒有去做什么用戶場景分析或者用戶需求分析之類的工作,都是依照著老板的一些想法去一步一步的實現(xiàn),當(dāng)然,這并不是一定是錯的,只是大部分公司的設(shè)計工作的現(xiàn)狀,這樣也可能會有好的產(chǎn)品,只是可能性更低而已。很多公司沒有很專業(yè)的設(shè)計團(tuán)隊,也沒有很專業(yè)的產(chǎn)品經(jīng)理,更沒有很專業(yè)的產(chǎn)品設(shè)計師,做很多設(shè)計決策的時候基本上都是靠拍腦袋,或者依靠個人的生活或者設(shè)計經(jīng)驗,在不知不覺中,就把 UCD 的設(shè)計方法忘在腦后了,UI設(shè)計師只是負(fù)責(zé)機(jī)械式美化下每一個元素,做一下視覺風(fēng)格的統(tǒng)一,變成了一個不折不扣的界面美化師。

但我們 UI設(shè)計師不能只是美化一下界面,雖然我們可以沒有專業(yè)的設(shè)計團(tuán)隊,沒有很厲害的產(chǎn)品經(jīng)理或者交互設(shè)計師,但是我們也要在設(shè)計過程中不斷地提醒自己,要以用戶體驗為中心,用戶在這個界面需要的是什么,什么信息對他來說是最重要的,怎么樣設(shè)計可以減少用戶的瀏覽負(fù)擔(dān),提高用戶的使用效率,雖然可能我們思考的方向和結(jié)果的不一定對,但是只要去想,才能不斷強(qiáng)化我們自己的這個設(shè)計思維,避免自己產(chǎn)出千篇一律的設(shè)計方案,提高自己的設(shè)計能力。如果能把每一項工作都盡百分之120的努力去完成,那就算你現(xiàn)在是在一個微不足道的小公司,你也一定能成長為一個設(shè)計大牛。

四、堅持學(xué)習(xí),不斷提高審美和眼界

現(xiàn)在作品不好,沒問題,如果一直都不好,那就是你自己真的出了問題。

△ 圖源:Nick Taylor

我以前很羨慕那種設(shè)計師,年紀(jì)輕輕就進(jìn)大公司,或者20歲不到作品就讓人感覺眼前一亮。對于我這種非科班的,大學(xué)畢業(yè)7年了,認(rèn)真靜下心來干設(shè)計才3年多,似乎還沒開始跑,就已經(jīng)被人甩開一大截了。

看起來似乎很糟糕,但其實真不是,你所經(jīng)歷的一切艱難,如果挺過去了,那就是你人生寶貴的財富。那應(yīng)該怎么做呢?只能不斷努力地去縮小和別人的差距,不對,不是和別人的差距,是和自己對自己期望值的差距。

那么提高審美和眼界就是最基本要做的事情,同時我也認(rèn)為這是作為一個設(shè)計師需要持續(xù)不斷提高的最基本的能力。審美和眼界的提高是需要日積月累的,軟件操作和技法可以短時間內(nèi)突擊學(xué)習(xí),也可以臨時偷師,但是如果你審美不行,你永遠(yuǎn)都不可能做出好的設(shè)計,因為在你的眼里的高級和在高水平設(shè)計師眼里的高級,可能是天差地別。審美和眼界就像是一種設(shè)計師的隱藏屬性,會在你日常的設(shè)計當(dāng)中不自然的流露出來,你不需要去調(diào)動它,它自然而然的就會在你的工作中不斷地幫助你。

但是往往很多設(shè)計師不把這個當(dāng)一回事。其實你只要每天堅持不停地看優(yōu)秀的作品,堅持幾個月或者半年一年的,你的審美肯定都會有質(zhì)的飛躍。以前你覺得設(shè)計很棒的作品,可能你以后看起來就會嗤之以鼻了。

看作品這件事其實很簡單,你只要每天打開 behance,打開首頁推薦的十個作品,花個十幾二十分鐘細(xì)細(xì)看下來,覺得好的就分類收藏一下,以備以后可以用來做設(shè)計的參考。

但是,關(guān)鍵是堅持。

五、重拾英語,不讓自己做井底之蛙

別總看國內(nèi)的設(shè)計網(wǎng)站了,外面的世界更精彩。

為什么要重新學(xué)習(xí)英語?(我就是想萬一以后牛X了,可以混到國際舞臺上,嗯,這個可以有)

一開始決定重拾英語的契機(jī),這還要感謝砂姐組織的翻譯小組。我也只是想試試看,能不能把英語重新?lián)炱饋怼S谑菑?7年2月份開始我給自己定了個目標(biāo),每個月翻一篇英語的設(shè)計類文章,很慶幸自己堅持下來了。同時在工作中遇到的不少問題,會逼著我去看一些外文的資料,讓我覺得我必須得更努力地把英語撿起來,于是最近幾個月同時也開始背單詞,每天堅持讀英語的設(shè)計文章,跟一開始比,感覺還是很有收獲的,看文章的速度越來越快,閱讀時的語感也越來越好(這個越來越好是相對于自己很糟糕時候的狀態(tài))。

慢慢地,我感覺,學(xué)好英語,對于一個設(shè)計師的長遠(yuǎn)發(fā)展是很有幫助的。

如果你想去了解世界上更多優(yōu)秀設(shè)計師的想法,學(xué)習(xí)他們的經(jīng)驗,那么就得親自去獲取第一手的信息,而不是等著其他人的翻譯,而且很多各種設(shè)計領(lǐng)域的優(yōu)秀的教材和資料都只有英文版本,如果不把英語學(xué)好,自己學(xué)到的不僅僅是很多殘缺不全的二手資料,甚至連學(xué)習(xí)的機(jī)會都沒有。把英語學(xué)好,是給自己打開通往更廣闊領(lǐng)域的鑰匙。你的眼界,決定了你成就的上限。

六、接觸代碼,發(fā)現(xiàn)一個新世界

學(xué)習(xí)從來都不是件輕松愉快的事情。

做界面的同學(xué)有沒有遇到過這樣的情況:我明明是設(shè)計成這樣的,為什么開發(fā)出來之后就變成那樣了?

這就是我下定決心想學(xué)習(xí)代碼的導(dǎo)火索。我就想,為什么我不能自己學(xué)習(xí)代碼自己實現(xiàn)自己的設(shè)計么?這不是很厲害么?加上我之前也斷斷續(xù)續(xù)地對前端技術(shù)有過學(xué)習(xí)的念頭,于是一鼓作氣下定決心就開始學(xué)了。

出于想給自己開發(fā)個人網(wǎng)站的初衷,我就選擇了前端的開發(fā)語言作為我的學(xué)習(xí)內(nèi)容。我目前主要學(xué)習(xí)的是 Javascript(html 和 css 已經(jīng)學(xué)了個大概)。

一開始學(xué)習(xí)的時候真的是痛苦不堪,但是在度過了一兩個月的痛苦的煎熬之后,已經(jīng)慢慢地發(fā)現(xiàn)學(xué)習(xí)代碼的樂趣,但同時,發(fā)現(xiàn)這個坑是越來越大,感覺要學(xué)的東西是自己預(yù)想的要多太多了。雖然過程很糾結(jié)也很痛苦(我估計這種痛苦的感覺還會持續(xù)好長時間),學(xué)習(xí)代碼的過程對于提高設(shè)計師的邏輯思維確實很有幫助,因為編程思維和設(shè)計工作的思維相比,更注重邏輯性(設(shè)計工作也很注重邏輯性)。同時,多了解一些編程的知識(編程開發(fā)的語言很多,但是思維方式是類似的)對于理解開發(fā)人員的工作內(nèi)容和工作方式,也會有很大的幫助?;ヂ?lián)網(wǎng)的設(shè)計師,我覺得在學(xué)有余力的情況下,都應(yīng)該多多少少學(xué)習(xí)一些代碼的知識,因為這畢竟也是產(chǎn)品開發(fā)的其中的一個重要環(huán)節(jié),你不需要擅長,但懂一些,可以讓你更好地和開發(fā)人員進(jìn)行有效的溝通,知己知彼,減少撕逼。但是不建議設(shè)計工作經(jīng)驗較少的同學(xué)學(xué)習(xí)代碼,畢竟這需要很多的時間去學(xué)習(xí),不要把自己變成什么都是半桶水,在不影響設(shè)計工作之余可以抽出時間的話讓自己嘗試一下,說不定你也會喜歡上編程這件事。

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

如何從0到1建立設(shè)計規(guī)范

資深UI設(shè)計者


如果您想訂閱本博客內(nèi)容,每天自動發(fā)到您的郵箱中, 請點這里


最近一段時間一直在建立APP的設(shè)計規(guī)范,從一開始的立項到現(xiàn)在落地上線,可以說是從零開始進(jìn)行APP全部細(xì)節(jié)的梳理并且規(guī)定規(guī)范,這一路走過來還是能總結(jié)出很多心得,本文將分為3個部分,闡述如何從0到1建立設(shè)計規(guī)范。


目錄:

一、如何確定內(nèi)容,規(guī)范里要寫什么

二、如何寫

三、如何推動規(guī)范落地


一、如何確定內(nèi)容?


這里我總結(jié)了三步:


Image title



1)確定目標(biāo)用戶、用戶目標(biāo)、設(shè)計目標(biāo)

根據(jù)不同的用途和目標(biāo),不同的團(tuán)隊對設(shè)計規(guī)范的制定是不一樣。比如為了指導(dǎo)與規(guī)范全球第三方開發(fā)者進(jìn)行設(shè)計和開發(fā),Google建立的Material Design覆蓋面廣,每個組件細(xì)節(jié)寫得非常細(xì)致。Ant Design則是直接做出了組件,方便直接進(jìn)行調(diào)用。有些國內(nèi)設(shè)計團(tuán)隊的規(guī)范則是主要描述常用控件和色值。因此我們需要確立用戶目標(biāo)和設(shè)計目標(biāo),這樣才能確定我們的規(guī)范側(cè)重點是什么,需要做成怎么樣的形式。


在這里我列舉了自己撰寫規(guī)范時的用戶與目標(biāo):


Image title



2)模范大平臺,先列全

一個規(guī)范里面的東西是很多的,那么我們究竟需要做什么呢?假如一開始我們沒有方向,找一個,列一個,這樣我們很容易疏漏很多情況。在這里我采用的的一個辦法是:首先熟讀iOS,Material Design規(guī)范,并且模范他們,在腦圖中,把規(guī)范中應(yīng)含有的所有內(nèi)容羅列出來,羅列一個大綱。


這里我列舉當(dāng)時自己做的一個腦圖大綱,覆蓋了主流規(guī)范中的所有細(xì)節(jié),大家可以進(jìn)行參考并模仿:

Image title



3)針對自己情況進(jìn)行刪減

列完齊全的大綱后,我們需回顧設(shè)計目標(biāo),對大綱里的內(nèi)容進(jìn)行刪減。(比如在組件、模式這些地方,可以對著自己的APP,進(jìn)行挨個尋找,看自己的APP當(dāng)前是不是運(yùn)用了這個組件,沒有的話就進(jìn)行刪減。)


在這里我列舉了針對自身APP的情況刪減后的大綱圖:

Image title

二、如何寫

進(jìn)過了以上的三步,我們基本得出了要寫什么的框架了,接下來就是如何寫規(guī)范的階段。


這里我總結(jié)了3步:

Image title


1)確定優(yōu)先級

我們可以通過版本迭代計劃+性價比+重要性(該組件在頁面出現(xiàn)的場景次數(shù)以及當(dāng)前的不統(tǒng)一對APP體驗影響程度)這幾個維度分別確定每塊內(nèi)容的優(yōu)先級和分工?;A(chǔ)的、必要的、高性價比的放在第一期,復(fù)雜的向后放,隨著產(chǎn)品的迭代,我們的規(guī)范也會越來越完整。


同時需要留意版本規(guī)劃,了解即將要做的功能或即將要改版的頁面。我們可以提高這里面牽涉到的控件、組件等內(nèi)容的優(yōu)先級。龐大復(fù)雜,牽涉到很多頁面的,我們可以先降低其優(yōu)先級:比如全局提示框的規(guī)范,toast的規(guī)范。


同時,我們也需常與開發(fā)溝通,爭取把可復(fù)用性高、組件日后變化幅度少的組件做成開發(fā)組件庫。


2)確定規(guī)范書寫格式

我們制定的規(guī)范本身也是設(shè)計的交付物,假如每個設(shè)計師都按照自己的喜好來編寫規(guī)范,那么這個規(guī)范本身也會變得不規(guī)范,規(guī)范自身保持一致性是提高規(guī)范閱讀效率的一部分。


我們可以回歸我們之前制定的用戶目標(biāo)和設(shè)計目標(biāo)來制定我們規(guī)范的書寫格式。規(guī)范的用戶群是誰,主要想達(dá)到什么作用,是通過文檔展示還是網(wǎng)上展示,確定了這些問題后,就可確定規(guī)范的詳細(xì)程度、主要的展示形式(比如前文說到的Ant Design和Material Design)。


這里我的思考點是:假如規(guī)范寫太多字就會變得很臃腫,沒有人喜歡慢慢仔細(xì)的閱讀你寫的規(guī)范,所以我們應(yīng)該做到寫得簡明扼要,再輔以例子說明(根據(jù)開發(fā)的習(xí)慣,都是喜歡直接看例子,看標(biāo)注)。


我的書寫格式是:先寫描述這個組件是什么,再列舉出現(xiàn)的場景,然后編寫交互規(guī)則,最后給出視覺標(biāo)注+例子。


3)逐步對單個規(guī)范進(jìn)行整理與書寫

當(dāng)確定了要寫什么東西和格式之后,我們開始進(jìn)入到細(xì)節(jié),對每個內(nèi)容進(jìn)行整理,制定規(guī)范了。


通過對每個內(nèi)容制定規(guī)范規(guī)范也是有方法的:


Image title


下面我通過整理“列表”這個規(guī)范來講解:


1.收集出現(xiàn)的所有的場景。

當(dāng)一個產(chǎn)品已經(jīng)趨于成熟,這個組件出現(xiàn)的場景就會非常多,比如對話框,toast,列表這些組件出現(xiàn)的地方很多,需要我們自己仔細(xì)地體驗產(chǎn)品,把所有頁面都找出來。


2.提取共性,歸納分類

我們需要分析每個頁面的特點并且把相同特點的頁面歸納一起,眾多的頁面場景就能整理成幾個典型的種類,然后只需對這幾個典型的種類進(jìn)行定義和描述即可。

在列表中,我分為了大封面列表、小封面列表、用戶列表、單行列表


3.編寫規(guī)則

在分類好后,我們可以對每個種類編寫規(guī)則,在這里我們需要描述好每個種類有什么特點或?qū)傩?,什么時候場景下適用,并且給出標(biāo)注和例子,方便閱讀者理解。


4.多與組內(nèi)成員討論修改

在制定好初稿后,我們可以與組內(nèi)成員宣講下自己制定的規(guī)范。多從別人的角度出來,確保你編寫的規(guī)范是否易懂,是否包含了全部的情況,是否容易執(zhí)行落實。


三、如何推動規(guī)范落地

寫完內(nèi)容后,最重要的一步就是推動落地,規(guī)范要真正有人用才能體現(xiàn)價值,在這里我給出幾點幫助推動規(guī)范落地的小建議:

1.制定規(guī)范推進(jìn)進(jìn)度表

表格里面應(yīng)該包含規(guī)范制定的優(yōu)先級,分工進(jìn)度,分工人員,并且確定每一期進(jìn)度的交付時間,開會討論的時間,作為負(fù)責(zé)人,也可以適時提醒成員每次的開會時間(畢竟deadline是第一生產(chǎn)力)。


2.編寫過程中多與其他成員討論,達(dá)成一致性共識

制定規(guī)范后,與部門其他人員進(jìn)行宣講,灌輸概念,針對如何更好的落實進(jìn)行討論調(diào)整。在設(shè)計中都不可能一次就完美,我們需要不斷的在修改中逐漸完善。


3.規(guī)范建成后放在網(wǎng)上

同步在網(wǎng)上,方便部門內(nèi)的其他成員能隨時查看和團(tuán)隊成員對規(guī)范的更新修改、同步。


4.強(qiáng)制性制定規(guī)則要求團(tuán)隊成員執(zhí)行。

有明確的懲罰機(jī)制和要求才能更好的執(zhí)行,不然在規(guī)范制定后很容易健忘此事。(我們組的懲罰機(jī)制就是罰錢)。


5.規(guī)范保持持續(xù)的更新迭代。

規(guī)范推動落地后并不是完全了事,要根據(jù)產(chǎn)品的迭代,保持規(guī)范的更新。

這整個制定規(guī)范的項目中,還是有不少反思的地方,值得我們深思和注意:


1.切記不要為設(shè)計規(guī)范而做規(guī)范

規(guī)范最重要的點是能推動落地,能確確實實改善產(chǎn)品,達(dá)到統(tǒng)一性。因此我們在設(shè)計規(guī)范時,并不需要“高大上”術(shù)語,給出一大堆的設(shè)計理念用來提升設(shè)計逼格。而是真正的回歸到我們的設(shè)計目標(biāo),針對目標(biāo)用戶制定規(guī)范,做到簡樸、易懂、能落地。

2.沒人愿意閱讀長篇文字

我們應(yīng)該盡量控制文案長度,做到通俗易懂即可。

3.要時刻圍繞我們的目標(biāo)做規(guī)范

比如,我這次做的規(guī)范中有一項是去工具化,在制定控件中,空白頁面中就會加入很多趣味化的設(shè)計。


4.靈活變通

規(guī)范只是適合大多時候的場景,對于一些規(guī)范中沒有包含或者不符合規(guī)范的場景,我們可以靈活變通,積極創(chuàng)新或者是補(bǔ)充新的規(guī)范(前提是與組內(nèi)積極溝通,達(dá)成共識)。


總結(jié):

再來回顧如何從0到1建立規(guī)范


一、確定內(nèi)容

1.確定用戶目標(biāo)和設(shè)計目標(biāo)

2.模仿大平臺,列全

3.針對自己情況進(jìn)行縮減


二、寫

1.確定優(yōu)先級

2.確定規(guī)范書寫格式

3.逐步對單個內(nèi)容進(jìn)行整理與書寫:a.收集全部情況 b.分類歸納 c.提取共性,編寫規(guī)則

三、推動

1.制定規(guī)范推進(jìn)進(jìn)度表

2.編寫過程中多與其他成員討論

3.把規(guī)范建成后放在網(wǎng)上

4.強(qiáng)制性制定規(guī)則要求團(tuán)隊成員執(zhí)行

5.規(guī)范保持持續(xù)的更新迭代


今天分享的內(nèi)容就是這些了,希望能幫助到大家,感謝閱讀~



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


想用設(shè)計化腐朽為神奇,你得先想明白這10個問題

資深UI設(shè)計者


如果您想訂閱本博客內(nèi)容,每天自動發(fā)到您的郵箱中, 請點這里


今天的譯文同樣來自設(shè)計師 Eugen E?anu,他將經(jīng)典設(shè)計書《Don‘t Make Me Think》中的內(nèi)容梳理出來供你參考。這些老問題依然能夠給我們今天的新局面以啟發(fā)。

「好設(shè)計應(yīng)該是顯而易見的」,這句老話在過去的幾個世紀(jì)當(dāng)中影響到了各個不同的領(lǐng)域,從美食到音樂,從建筑到哲學(xué),我們?nèi)缃竦纳顜缀跏窃谶@句話的影響下被逐漸被塑造出來的。

但是同樣的,人類的進(jìn)化并沒有我們想象中那么快速,我們的思維和本能仍然被深刻地影響著我們的決策。換句話來說,人類的行為模式有著很長的保質(zhì)期,在許多事情上,20年前很難做,在今天依然不那么容易去執(zhí)行。

重溫《Don’t Make Me Think》

Steve Krug 的這本《Don’t Make Me Think》中文譯本名字是《點石成金:訪客至上的網(wǎng)頁設(shè)計秘籍》,譯名可能沒有它的原名那么直接,但是也傳遞出這本書所要表達(dá)的核心概念。

這本書成于2000年第一次互聯(lián)網(wǎng)泡沫時代之后,Krug 在這次浪潮之后提出了不少實用的設(shè)計原則,直到今天仍然有著極高的價值。這本書隨后多次再版和修訂,其中的設(shè)計案例幾經(jīng)迭代升級,我們可以看到現(xiàn)代網(wǎng)頁設(shè)計的提升和進(jìn)步,同時也能從中感受到,用戶——人類行為本身的模式化。「訪客至上」的表述太過客氣,「不要讓我思考」這一表述更能表現(xiàn)用戶行為的特征,而今天我們所面對的絕大多數(shù)的優(yōu)秀產(chǎn)品,無論是手機(jī)電腦還是汽車,同樣遵循著這一原則。

這本書的成功是建立在無數(shù)痛徹心扉的教訓(xùn)之上,這也使得它本身的價值無與倫比。今天的文章本質(zhì)上也是一篇讀書筆記,設(shè)計師應(yīng)該對于用戶、人性有足夠的認(rèn)知,方可作出足夠優(yōu)秀的設(shè)計。下面的10個總結(jié),既是常見的認(rèn)知錯誤,也是成就好設(shè)計的契機(jī),就看你怎么把握了。

1. 對于內(nèi)容,用戶從來都是掃視,而非用心閱讀

當(dāng)我們在查看內(nèi)容和信息的時候,絕大多數(shù)情況下我們都會下意識尋找讓自己感興趣的東西。比如,我們很少會完整地瀏覽網(wǎng)站上所有的文本和內(nèi)容,為什么?絕大多數(shù)的用戶打開網(wǎng)站都是在試圖完成某項任務(wù),達(dá)成某個目標(biāo),而網(wǎng)頁中的不同部分的內(nèi)容往往是服務(wù)于不同的功能和目標(biāo)的,我們努力達(dá)成目標(biāo)即可,并沒有閱讀全部的必要。不過,作為網(wǎng)站的設(shè)計者,我們往往還是提供了足夠豐富的內(nèi)容和完善的功能,一方面是因為我們覺得人們需要知道,另一方面也是應(yīng)對不同用戶的需求。正如有的設(shè)計師所說的,它們「增加了體驗」。

所以,通常而言,我們可以作出下列優(yōu)化:

  • 大量使用標(biāo)題:通過標(biāo)題告訴用戶這些內(nèi)容都是和什么相關(guān)的,確保用戶能夠在掃視的時候快速明白并做選取。
  • 保持段落精簡:在長段落中,用戶可能稍分神就迷失了,而短段落更容易閱讀,也更容易汲取其中的信息。
  • 使用列表展示:幾乎所有的信息都可以分割為列表來展示,甚至一個使用多個逗號分割的句子,都可以制作成為列表。當(dāng)然,值得注意的是,注意列表之間的行間距,確??勺x性。
  • 突出關(guān)鍵信息:用戶在掃視的時候,主要是在定位關(guān)鍵詞。將關(guān)鍵詞使用粗體等方式標(biāo)注出來,便于用戶掃視和定位。不要強(qiáng)調(diào)太多的內(nèi)容,這樣會失去強(qiáng)調(diào)的作用。

2. 創(chuàng)建卓有成效的視覺層次

視覺層次是確保用戶快速掃視能夠獲取到信息的重要助力。視覺層次能夠呈現(xiàn)出頁面中不同元素之間的優(yōu)先級和關(guān)系,在設(shè)計的時候,同樣需要遵循下面的幾個原則:

  • 重要性越高,越突出。最重要的元素,要么越大,要么越醒目,使用特定的色彩標(biāo)注出來。
  • 在邏輯上有關(guān)聯(lián)的元素,在視覺上應(yīng)該相關(guān)的,例如使用相同的色彩或者相同的視覺樣式。

3. 不要重新發(fā)明輪子

我們明白,用戶總會期望看到新東西,但是,市面上有太多的工具和應(yīng)用,如果各行其是,忽略約定俗成的規(guī)則,特立獨行地采用自己的規(guī)則,會讓每個應(yīng)用的學(xué)習(xí)成本都提高,這對于用戶幾乎是毫無益處的。

當(dāng)設(shè)計師被要求設(shè)計某個東西的時候,內(nèi)心是充滿重新發(fā)明的沖動的,這個我們都明白。而設(shè)計出和別人相似的東西看起來又有點「政治不正確」,甲方總會希望設(shè)計作出點不一樣的東西。更何況,這還是一個少有鼓勵和贊揚(yáng)的行業(yè),也很少為「最貼合用戶需求」的產(chǎn)品頒設(shè)計獎。

但是設(shè)計仍然需要在各方之間作出最佳的平衡。

在重新發(fā)明輪子之前,你必須了解破壞和創(chuàng)新所意味著的真實的價值(時間,體驗,耗費(fèi)的精力和所需的知識)。

4. 產(chǎn)品說明沒必要存在了

我們的工作是要讓產(chǎn)品清晰明了,讓事情便捷易行。即使做不到明顯,也應(yīng)該盡力向著不言自明的設(shè)計靠攏。說明書這種東西是沒有人會主動去看的,它們的存在意義本身就不大,你需要通過合理的設(shè)計,讓產(chǎn)品本身發(fā)揮指引性的效果。即使說明書必須存在,也盡量讓它簡短明了。

如果功能并不明顯,我們應(yīng)該盡量讓它明顯一點,讓目標(biāo)更明顯。

以宜家為例,一個需要買回家組裝的柜子,絕大多數(shù)的用戶可以在簡短的指引之下就可以輕松正確地組裝,為什么?因為絕大多數(shù)情況下,一個柜子長什么樣,用戶眼前有清晰的畫面,哪怕說明只有幾張簡單的圖片,用戶也不會犯錯。

5. 用戶并不在意產(chǎn)品是怎么運(yùn)作的

絕大多數(shù)的用戶并沒有興趣了解你的產(chǎn)品的工作方式,并不是因為他們不夠聰明,僅僅是因為他們不在乎。所以,一旦他們確定你的產(chǎn)品是能用的,就很少會去注意其他的部分。

以蘋果的無線耳機(jī) AirPods 為例,從價格上來說,它并不親民,但是它的交互方式和使用體驗確實非常的獨特和優(yōu)秀,這也不難理解許多用戶會選擇它。用戶在購買它之后,并不會去思考它是如何運(yùn)作的,其中所包含的諸多新技術(shù),對于用戶而言,只是潤物細(xì)無聲地發(fā)揮著作用而已。

我的母親就使用的 AirPods ,她從來不會問我它的原理,但是她很清楚,耳機(jī)需要放在充電盒中充電,和手機(jī)配對之后就能用了,并不復(fù)雜。

6. 來去匆忙的人們,從不主動尋找「微妙的線索」

這一條可能是我最喜歡的。我們設(shè)計師總喜歡為用戶帶來微妙的視覺效果,來給用戶帶來樂趣。對吧?可是如果我告訴你,用戶并不關(guān)心它們,你會怎么想呢?他們也根本不會告訴你他們有多在意或者多不在意,也不會在一次又一次看到的時候?qū)τ谶@些設(shè)計有多少感覺。

為什么會這樣?生活環(huán)境賦予每個用戶以復(fù)雜多變的情境,他們很少有機(jī)會去感受微妙的設(shè)計所帶來的奇妙情緒。風(fēng)在吼,狗在叫,小孩還在滿屋跑,水壺里面水開了,老婆在耳邊抱怨著工作中的細(xì)微末節(jié),而你正在填寫著表單準(zhǔn)備預(yù)訂明天的高鐵票,在那個時刻,APP 當(dāng)中微妙的動效和視覺線索,手一抖,你可能還會多買一個沒有必要的捆綁銷售的酒店折扣券。

但是另外一方面,對于優(yōu)秀體驗的追求不應(yīng)該因此而放棄,還有很多用戶會從中受益,這也是促成優(yōu)秀產(chǎn)品的必須因素。只不過確實有很多用戶沒法去在意它們罷了。

7. 焦點小組的任務(wù)不是做可用性測試

焦點小組是做什么的?一小群人圍坐在桌子旁邊,討論他們對于產(chǎn)品的看法,他們過去的經(jīng)歷,它們的感受和對于新概念的理解。焦點小組的作用是幫你更好地界定目標(biāo)用戶,目標(biāo)用戶的感受等等。

可用性測試則是另外一回事。做可用性測試的時候,通常是為了測試產(chǎn)品而觀察一個特定的用戶使用產(chǎn)品的過程。在測試中,你需要測試人員執(zhí)行特定的操作,以此來查看整個設(shè)計中的概念是否直觀,功能是否需要完善。面對焦點小組的時候,你需要傾聽觀點,梳理思路,在進(jìn)行可用性測試的時候,更多需要的是觀察,并且解決具體的問題。

8. 不要讓個人情感替代整個用戶歷程

我們在設(shè)計產(chǎn)品的時候,常常會從自己的需求出發(fā):「我也是一個用戶,所以我知道什么好什么不好?!刮覀儗τ谧约旱南埠糜兄鴱?qiáng)烈的感受。

我們會說,當(dāng)我們的產(chǎn)品具備_____的時候,我們會很喜歡,又或者,我們認(rèn)為_____是一個巨大的痛點。當(dāng)我們真正和團(tuán)隊成員坐在一起討論產(chǎn)品的時候,大家都有各自的看法和各自的情緒,所有人的都有著極強(qiáng)的個性和獨特的看法,這個情況就很尷尬了。因為我們常常會傾向于認(rèn)為絕大多數(shù)的用戶和我們自己一樣。事實上并不一定如此。

9. 問對問題,才能讓產(chǎn)品走向?qū)Φ姆较?

無論是設(shè)計產(chǎn)品功能還是測試產(chǎn)品的時候,問對問題都很重要。測試的時候,問用戶「你們喜歡下拉菜單嗎」這樣的問題,不僅銷量不高,而且不會帶來價值。這個問題,應(yīng)該這么問:「在這個情況下,在這個頁面上,下拉菜單這種設(shè)計是否能夠給你帶來良好的用戶體驗?哪里讓人覺得不舒服?」

諸如「用戶喜歡這個產(chǎn)品嗎」這樣寬泛的問題意義不大,用戶也很難提供針對性的、具體的回復(fù)。

而且,作為設(shè)計師我們不應(yīng)當(dāng)專注于用戶是否喜歡這樣的問題,這樣會失去動力和專注力??捎眯詼y試可以幫你消除各種「喜歡」相關(guān)的問題,并且?guī)湍阏业秸嬲龅氖虑?。這才是重點。

10. 不要讓用戶思考問題

我在哪?我要干嘛?

我應(yīng)該點哪里開始?

他們在這放的這個控件是干啥的?

這個頁面是用來做什么的?

他們?yōu)槭裁催@么稱呼這個功能?

這個是廣告還是內(nèi)置的功能?

在使用產(chǎn)品的時候,如果觸發(fā)用戶大腦中的各種問題,只會增加用戶的心理負(fù)荷和工作量,分散用戶注意力并不是好事,而且用戶本身并不喜歡解決各種難題。

每當(dāng)用戶點擊某個控件而不起作用,或者它看起來是個鏈接實際上并不是,會消耗用戶對你的信任感,降低產(chǎn)品的可靠度。

One more thing

炫酷的概念和新穎的趨勢不僅吸引用戶,同樣是設(shè)計師的心頭好。但是我們在新的時代,新的局面之下,始終面對的是以往的用戶,看似千變?nèi)f化的需求背后是不變的人性。

至少《Don’t Make Me Think》這本書一直在探討的問題,經(jīng)過20年的世事變遷,幾次互聯(lián)網(wǎng)浪潮,在這個號稱互聯(lián)網(wǎng)4.0時代,仍然發(fā)揮著作用,依然是那么具有啟發(fā)性。

新狀況之下潛藏著老問題,想要洞悉本質(zhì),設(shè)計師要懂心理學(xué)和行為學(xué)。在之前的幾篇文章當(dāng)中,我一直在試圖梳理出不會隨著時間改變,而一直存在的、亟待解決的問題以及可供使用的原理。

《為何如今的產(chǎn)品總給人千人一面的感覺?》揭示的是「特征蔓延」和「競爭驅(qū)動式設(shè)計」是如何讓產(chǎn)品走向平庸和毀滅,解決方案藏在結(jié)尾。

《熟知用戶行為的這7個層面,你的設(shè)計才會走進(jìn)人心》則介紹了唐納德諾曼的用戶行為的7個層面,這是一套分析用戶行為,設(shè)計產(chǎn)品流程的有效方法,擁有持久生命力的產(chǎn)品的設(shè)計策略,和這套方法不謀而合。

《這7種廣泛存在的認(rèn)知偏差,影響了我們太多的決策》 則幫你梳理了7種常見的認(rèn)知偏差,認(rèn)識自己了解用戶,這些知識能消除誤解,同樣能夠幫你洞悉真相,是不可多得的利器。

設(shè)計的方法和工具成千上萬,想明白道理,問對問題,接下來的路更容易走通。


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



日歷

鏈接

個人資料

存檔