2021-4-19 ui設(shè)計(jì)分享達(dá)人
在工作中常常被問(wèn)到如何表達(dá)講述自己的設(shè)計(jì),為了讓自己的設(shè)計(jì)有理可依,對(duì)接上下游匯報(bào)工作的時(shí)候,總結(jié)以下一些方法和觀點(diǎn),幫助不知從何講述自己設(shè)計(jì)的人一些語(yǔ)言技巧。
以下僅是個(gè)人觀點(diǎn),用作探討交流,文中所有舉例均為本人工作設(shè)計(jì)輸出。
設(shè)計(jì)師能做出好的設(shè)計(jì),卻缺乏系統(tǒng)化的語(yǔ)言包裝,“如何講設(shè)計(jì)”不該讓它成為難題,做一個(gè)有產(chǎn)品思維的設(shè)計(jì)師,讓你的設(shè)計(jì)以理服人,我們要不止停留在視覺(jué)表層,更要從多緯度看待產(chǎn)品設(shè)計(jì),本文將從以下三點(diǎn)簡(jiǎn)述:01.產(chǎn)品設(shè)計(jì)的五個(gè)層面,02.講述設(shè)計(jì)的流程,03.關(guān)于本次總結(jié)
做好產(chǎn)品設(shè)計(jì)的第一步,是了解產(chǎn)品, 要對(duì)于產(chǎn)品的需求如何確定、產(chǎn)品定位如何決定有一個(gè)基本的認(rèn)識(shí),在產(chǎn)品常識(shí)里面最重要也最常用的就是產(chǎn)品設(shè)計(jì)的五個(gè)層面,也簡(jiǎn)稱用戶體驗(yàn)五要素——
作為UI設(shè)計(jì)師,所處的視覺(jué)設(shè)計(jì)是表現(xiàn)層,是確定產(chǎn)品的最終形態(tài),因此也處于產(chǎn)品設(shè)計(jì)的頂層(能被看到),是一個(gè)具象畫(huà)的呈現(xiàn);其次,往里推框架層,是確定產(chǎn)品外觀,將界面信息和導(dǎo)航設(shè)計(jì)有序歸類,讓用戶使用或者理解;結(jié)構(gòu)層是為用戶設(shè)計(jì)一個(gè)結(jié)構(gòu)化的體驗(yàn),將零散的元素轉(zhuǎn)化為有序立體的空間;范圍層確定產(chǎn)品的功能和需求;最后戰(zhàn)略層是確定產(chǎn)品目標(biāo)和用戶需求;底層邏輯結(jié)構(gòu)決定上層意識(shí)形態(tài)表現(xiàn),因此在設(shè)計(jì)前我們要知道產(chǎn)品是屬于洞察階段,設(shè)計(jì)中是屬于產(chǎn)品設(shè)計(jì)解決方案階段,整體的產(chǎn)品設(shè)計(jì)是一個(gè)概念通過(guò)無(wú)數(shù)個(gè)層面的努力,經(jīng)過(guò)時(shí)間,轉(zhuǎn)化為具象表現(xiàn)的過(guò)程,所以我們?cè)谕瓿梢豁?xiàng)設(shè)計(jì)時(shí),應(yīng)該講述一個(gè)完整的設(shè)計(jì)思路 ,不要讓自己的設(shè)計(jì)思路僅停留在表面。
整個(gè)產(chǎn)品的設(shè)計(jì)產(chǎn)出是一個(gè)抽象到具象化的過(guò)程,設(shè)計(jì)的前期屬于產(chǎn)品洞察階段,這個(gè)時(shí)候一般由團(tuán)隊(duì)的老板領(lǐng)導(dǎo)結(jié)合當(dāng)下市場(chǎng)需要,有用戶的需求就有商機(jī),想出產(chǎn)品大致的方向(戰(zhàn)略層)然后通過(guò)產(chǎn)品經(jīng)理整合梳理高層的意見(jiàn)確定產(chǎn)品大致的功能和內(nèi)容輸出原型(范圍層),交給交互設(shè)計(jì)師優(yōu)化產(chǎn)品細(xì)節(jié)邏輯和信息具體框架,經(jīng)過(guò)研發(fā)評(píng)估能夠技術(shù)實(shí)現(xiàn)產(chǎn)出交互稿(結(jié)構(gòu)、框架層),這里已經(jīng)過(guò)渡到設(shè)計(jì)解決問(wèn)題執(zhí)行階段,最后是給到界面設(shè)計(jì)師美化視覺(jué)產(chǎn)出高保真(表現(xiàn)層)。
也就是到我們自己設(shè)計(jì)輸出之前要經(jīng)歷這么多,如果能在講述自己設(shè)計(jì)的時(shí)候,提前去了解這些,那么設(shè)計(jì)內(nèi)容就不愁沒(méi)法兒講,光是闡述自己的設(shè)計(jì)思路就可以講出一個(gè)故事,這也是為什么現(xiàn)在很多品牌賣貨都開(kāi)始營(yíng)銷產(chǎn)品背后的故事由來(lái)。我們?cè)O(shè)計(jì)能做好,也要會(huì)用語(yǔ)言推銷自己的設(shè)計(jì)成果。
設(shè)計(jì)是對(duì)于某件事精心準(zhǔn)備的過(guò)程。好的設(shè)計(jì)作品,應(yīng)該擁有完整的設(shè)計(jì)流程,因此我們?cè)谥v述自己設(shè)計(jì)作品的時(shí)候,有一套完整系統(tǒng)化的方式是非常有效的。完整的設(shè)計(jì)流程包含以下4個(gè)步驟:
第一是我們需要去了解設(shè)計(jì)的需求背景,知道大概的方向——
來(lái)源(簡(jiǎn)單理解就是誰(shuí)提出的問(wèn)題)需求有可能是你的老板、你的產(chǎn)品經(jīng)理、或者交互設(shè)計(jì)、或者視覺(jué)上的問(wèn)題···
背景(籠統(tǒng)一點(diǎn),就是這個(gè)需求是新需求還是原來(lái)有然后進(jìn)行改版優(yōu)化)需求的基層性質(zhì)是什么,原本調(diào)性是什么,我們要做什么樣的產(chǎn)品···
目標(biāo)(目標(biāo)一般都是需要解決什么問(wèn)題)搞清楚為什么做這個(gè)需求,能解決什么痛點(diǎn),不做無(wú)用功。
誰(shuí)提出的問(wèn)題,是新的需求還是舊的問(wèn)題,或者我們要解決什么?圍繞這幾個(gè)方向?qū)⒛愕脑O(shè)計(jì)概述出來(lái),會(huì)讓非專業(yè)的人也能聽(tīng)懂你做了什么,舉個(gè)簡(jiǎn)單的例子,我們公司后臺(tái)一個(gè)很小的產(chǎn)品bug需求,往往這種需求就是產(chǎn)品經(jīng)理的一個(gè)截圖和他標(biāo)注的兩句話——
然后你完成了這個(gè)需求單,在傳達(dá)給非產(chǎn)品經(jīng)理以外的人的時(shí)候,你有可能是以下轉(zhuǎn)述方式——
毫無(wú)疑問(wèn),你就是將需求者的意思一字不落的轉(zhuǎn)達(dá)了,但是對(duì)于其他的聽(tīng)者來(lái)說(shuō),你的轉(zhuǎn)述平平無(wú)奇、毫無(wú)意義,甚至都沒(méi)有印象你做了什么,所以你應(yīng)該講清楚這個(gè)需求的背景——
設(shè)計(jì)需求來(lái)源是誰(shuí),原本屬于產(chǎn)品哪個(gè)模塊(來(lái)源),他原來(lái)功能是怎么樣的,界面上展示的結(jié)構(gòu)哪里有問(wèn)題(背景),視覺(jué)用了什么樣的方式改成什么樣,解決了什么痛點(diǎn)(目標(biāo))
講清楚誰(shuí)給的需求,需要解決什么問(wèn)題,是在原來(lái)的基礎(chǔ)上不變動(dòng)邏輯的情況下增加了什么達(dá)到了什么目的,才讓你的敘述更完整,聽(tīng)起來(lái)更有邏輯。如果是一項(xiàng)新的需求,沒(méi)有背景,那還得從設(shè)計(jì)分析說(shuō)起,設(shè)計(jì)分析就是讓你更專業(yè)的去做事,設(shè)計(jì)分析分為——用戶分析,設(shè)計(jì)目標(biāo),和設(shè)計(jì)手段三個(gè)要點(diǎn):
首先用戶分析就是,分析你做的東西給誰(shuí)看,而用戶又分為群體用戶和獨(dú)立用戶,在c端常見(jiàn)的就是獨(dú)立用戶,他們通常不定性,且有很多特征;在b端,目標(biāo)用戶一般是群體,他們大多數(shù)是有場(chǎng)景特性和行業(yè)特性,針對(duì)獨(dú)立用戶和群體用戶,我們得出的用戶特征、基本信息、需求結(jié)論也是不一致的,所以我們應(yīng)該結(jié)合產(chǎn)品的調(diào)性分析一下我們做出來(lái)的設(shè)計(jì)究竟給誰(shuí)看給誰(shuí)用。常見(jiàn)的用戶分析方法有:用戶畫(huà)像、用戶訪談、問(wèn)卷調(diào)查、焦點(diǎn)小組、眼動(dòng)測(cè)試、用戶反饋以及大數(shù)據(jù)分析,這些方法中最簡(jiǎn)單的是用戶畫(huà)像,就是舉實(shí)際的例子列出真實(shí)用戶的特征信息及使用場(chǎng)景。B端用戶分析方法常用大數(shù)據(jù)分析和用戶反饋,這兩種方式通過(guò)對(duì)接需求的上下游就可以得知。
通過(guò)用戶分析得出需求結(jié)論,滿足需求就能達(dá)成設(shè)計(jì)目標(biāo)——
設(shè)計(jì)目標(biāo)結(jié)合卡諾模型來(lái)分析,卡諾模型—反應(yīng)產(chǎn)品性能和解決用戶需求的滿意度的一種非線性關(guān)系,具體想了解的可以自行百度,站在巨人的肩膀上我們看得更遠(yuǎn)。 卡諾模型具備4種屬性 :1.必備屬性:滿足這個(gè)需求,用戶滿意度不會(huì)上升,但不滿足這個(gè)需求,用戶不滿意會(huì)大幅度降低 ;2.期望屬性:提供個(gè)性化需求,用戶滿意度會(huì)上升,不提供此需求,用戶滿意度會(huì)降低; 3.魅力屬性:用戶意想不到的效果,提供此屬性,用戶滿意度大幅提升,不提供也不會(huì)降低 ;4.無(wú)差異:無(wú)論提不提供,用戶滿意度都不會(huì)改變,根本不在意;因此在做需求的時(shí)候我們應(yīng)該盡力滿足基本需求和期望需求,而可有可無(wú)的需求盡量不去做,降低效率。幸福需求是不容易達(dá)到的,如果能滿足是非常棒的~這里就像是滿足了設(shè)計(jì)心理學(xué)的三個(gè)層次——本能、行為、反思。
接下來(lái)是大家都熟知的設(shè)計(jì)手段,適當(dāng)?shù)闹v一些述專業(yè)的設(shè)計(jì)技法,用不同的手段去實(shí)現(xiàn)的主畫(huà)面,最后達(dá)到完成設(shè)計(jì)目標(biāo)這樣的結(jié)果,會(huì)讓你顯得更專業(yè)。設(shè)計(jì)的手段有很多種,這里主要講述常用的三種,構(gòu)圖排版(采用什么構(gòu)圖方式,為什么這樣構(gòu)圖是因?yàn)槭裁丛O(shè)計(jì)原則)、色彩運(yùn)用(為什么使用這個(gè)顏色,因?yàn)檫@個(gè)顏色給人的心里感知是什么樣的)、設(shè)計(jì)風(fēng)格(采用什么風(fēng)格最貼近產(chǎn)品調(diào)性,為什么用這個(gè)風(fēng)格),但是講設(shè)計(jì)時(shí)一定要記住產(chǎn)品的調(diào)性,不能偏離產(chǎn)品本身,不要盲目套用絢麗的技法,否則是不合適的。
很多時(shí)候面對(duì)非專業(yè)需求方收稿時(shí),可能看到如下話語(yǔ)————
(心里是不是xxxx····“萬(wàn)馬奔騰”,用個(gè)文明點(diǎn)的詞)
非專業(yè)人士無(wú)法理解這二者的區(qū)別,他們認(rèn)為他們的設(shè)計(jì)手段能達(dá)成設(shè)計(jì)目標(biāo),而作為專業(yè)設(shè)計(jì)師的我們就應(yīng)該引導(dǎo)對(duì)方說(shuō)出設(shè)計(jì)目標(biāo),再用我們專業(yè)的手段去滿足對(duì)方的目標(biāo),去實(shí)現(xiàn)減少改稿次數(shù),而不是讓非專業(yè)人士去指導(dǎo)專業(yè)人士修改設(shè)計(jì)手段。分清這兩者的區(qū)別,我們就可以在設(shè)計(jì)引導(dǎo)中更加主動(dòng)。用設(shè)計(jì)分析的方法來(lái)講述設(shè)計(jì),舉個(gè)例子——
會(huì)議管理——會(huì)議預(yù)約移動(dòng)端優(yōu)化,因?yàn)檫@是我們?cè)挟a(chǎn)品EKP里面的模塊,PC端和移動(dòng)端都有,因此用戶可能是群體也可能是個(gè)人。所以針對(duì)獨(dú)立用戶和群體用戶都做一個(gè)用戶畫(huà)像,得出他們的一些需求結(jié)論,然后目前幸福需求是沒(méi)有的,純屬個(gè)人建議,日后如果有此功能,想必用戶的滿意程度也會(huì)大大提升。
概括一下已完成的整體主要頁(yè)面,分析設(shè)計(jì)目標(biāo):
頭部屬于流量量較高的區(qū)域,采用卡片式設(shè)計(jì),將會(huì)議內(nèi)容置于此處,作為頁(yè)面信息關(guān)鍵層,采用左對(duì)齊方式排版,突出會(huì)議標(biāo)題和時(shí)間提醒用戶。
通過(guò)不同的顏色標(biāo)簽,區(qū)分參會(huì)人員狀態(tài)——
待進(jìn)行未有操作反饋,選用橙色,屬于可以持續(xù)進(jìn)行并有明顯提醒作用
已做反饋屬于成功操作,選用已有用戶認(rèn)知心理的綠色
已知信息拒絕參與,是不太重要的,屬于不再進(jìn)行的階段,選用灰色
接下來(lái)是設(shè)計(jì)作品的產(chǎn)出過(guò)程,一般情況下不可見(jiàn)的過(guò)程,為什么要去講, 因?yàn)橐粋€(gè)東西從無(wú)到有是很不容易的一件事,如果能講述過(guò)程,就可以引燃情緒共鳴,讓別人記住,讓自己的設(shè)計(jì)作品也能有始有終——
設(shè)計(jì)過(guò)程一般分為四個(gè)階段:初期階段、中期階段、最終定稿;具體的關(guān)鍵詞和描述可以通過(guò)以下方式提煉出來(lái),這里就不做詳細(xì)說(shuō)明了。
拿運(yùn)營(yíng)宣傳來(lái)舉個(gè)例子,我們公司中秋節(jié)月餅禮盒包裝主視覺(jué)設(shè)計(jì)——整個(gè)過(guò)程應(yīng)該是有一個(gè)系統(tǒng)化的說(shuō)明的,省略為寫(xiě)字的地方是我們可以插入的具體圖片和過(guò)程,步驟差不多就是上述這些,可以有最初階段的頭腦風(fēng)暴-提取關(guān)鍵詞-清晰定位到中期階段的團(tuán)隊(duì)合作—風(fēng)格擬定-精選方案-細(xì)節(jié)刻畫(huà)以及和物料方溝通對(duì)接的打樣確定工藝等等過(guò)程…再到最后定稿的體驗(yàn)還原-問(wèn)題優(yōu)化…主畫(huà)面的誕生是不容易的,強(qiáng)化這種過(guò)程參與,讓不被看見(jiàn)的事也能展現(xiàn)。如果實(shí)在不好記錄,你可以從一開(kāi)始就截圖你繪制的過(guò)程——
上圖是用PS截圖,再用時(shí)間軸將每一幀動(dòng)態(tài)循壞播放,導(dǎo)出GIF然后截一張不變的底圖合成就可以了。
最后是數(shù)據(jù)驗(yàn)證階段,這個(gè)是設(shè)計(jì)落地的直觀證實(shí),包含主觀認(rèn)可和客觀數(shù)據(jù),具體內(nèi)容就是通過(guò)用戶或者專業(yè)的人士反饋給你設(shè)計(jì)落地的好壞,來(lái)判定你做的是否優(yōu)秀成功。通常這一塊的數(shù)據(jù)決定你驗(yàn)證你前面所有的過(guò)程,只要按照該流程認(rèn)真做了,最后效果通常不會(huì)太差,如果出現(xiàn)很大的偏差也往往是意料之外的,因該尋求團(tuán)隊(duì)一起解決,不是某一個(gè)人的問(wèn)題。
根據(jù)以上最后我們總結(jié),好的設(shè)計(jì)就是滿足以下4個(gè)方面:好看,好用,好記,能實(shí)現(xiàn)。設(shè)計(jì)師要考慮的維度不僅僅在視覺(jué)層面,什么是有產(chǎn)品思維的設(shè)計(jì)師,就是在執(zhí)行時(shí)候要考慮上下游不同職能的工作內(nèi)容,如果你的設(shè)計(jì)不能實(shí)現(xiàn),再好看也是白費(fèi)功夫的~從產(chǎn)品交互視覺(jué)多層面談設(shè)計(jì),會(huì)讓你的設(shè)計(jì)包裝顯得不那么單調(diào),系統(tǒng)化的方法總結(jié)到此,不足之處多多包含~謝謝你的閱讀!
文章來(lái)源:站酷 作者:YiVi_eleven
藍(lán)藍(lán)設(shè)計(jì)( www.teruid.com )是一家專注而深入的界面設(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ù)
藍(lán)藍(lán)設(shè)計(jì)的小編 http://www.teruid.com