很可惜 T 。T 您現(xiàn)在還不是作者身份,不能自主發(fā)稿哦~
如有投稿需求,請(qǐng)把文章發(fā)送到郵箱tougao@appcpx.com,一經(jīng)錄用會(huì)有專(zhuān)人和您聯(lián)系
咨詢(xún)?nèi)绾纬蔀榇河鹱髡哒?qǐng)聯(lián)系:鳥(niǎo)哥筆記小羽毛(ngbjxym)
作為一個(gè)產(chǎn)品經(jīng)理與設(shè)計(jì)師頻繁打交道不可避免,一個(gè)好的UI作品,很多時(shí)候都是設(shè)計(jì)師與產(chǎn)品兩個(gè)共同完成,但人是個(gè)體,對(duì)于設(shè)計(jì)師來(lái)說(shuō),設(shè)計(jì)的UI圖有自己的想法,產(chǎn)品也會(huì)站在自己角度來(lái)思考問(wèn)題。
所以需要常常溝通,如果這個(gè)過(guò)程只是單純的設(shè)計(jì)圖,就變成簡(jiǎn)單任務(wù)交付的方式,失去了一體的意義。
當(dāng)面對(duì)對(duì)不合格的UI圖時(shí),或者在設(shè)計(jì)之前進(jìn)行溝通和說(shuō)明的時(shí)候,就需要對(duì)設(shè)計(jì)圖的要求描述具體,哪怕覺(jué)得UI圖不好看,也需要讓對(duì)方清楚你在表達(dá)什么,盡量把抽象化的東西具像化描述出來(lái),而不是表達(dá)一些模糊概念的詞匯,更不能只表達(dá)自己的感受,這樣失去了專(zhuān)業(yè)性,削減了設(shè)計(jì)師對(duì)我們的信任感。
比如:“感覺(jué)不好看、顏色太淡了、字體太小了、要有品牌主題色等等”,這些表達(dá)方式都是不夠具體,而且偏主觀感受,換一種方式,我們可以這樣來(lái)表達(dá),比如:“希望突出按鈕點(diǎn)擊效果,按鈕的顏色加深,需要與背景色有層次分明。
這個(gè)副標(biāo)題的文案太大、顏色頁(yè)太深,導(dǎo)致主標(biāo)題弱化了,我們可以調(diào)成xx號(hào)的字體,顏色用灰色調(diào)一下試試”
所以作為一個(gè)產(chǎn)品經(jīng)理懂UI知識(shí)變得是一個(gè)必備技能,如果沒(méi)有自己的方法論,在溝通的時(shí)候可能會(huì)顯得不專(zhuān)業(yè),可能會(huì)憑感覺(jué)走,不由自主的代入更多主觀感受,缺少客觀事實(shí)的表達(dá)方式,面向UI圖思考時(shí)有一些簡(jiǎn)單的方法,在這里羅列幾條,供參考。
在使用分割線(xiàn)時(shí),我們常常會(huì)使用貫穿和非貫穿分割線(xiàn)兩種:
使用非貫穿分割線(xiàn)的主要原因是,這些消息是一體的,都是消息,但同時(shí)又是每個(gè)個(gè)體發(fā)送過(guò)來(lái)的消息,如果是用貫穿分割線(xiàn),會(huì)讓內(nèi)容分割,有失整體性,比如:“支付的消息,使用的就是非貫穿分割線(xiàn)”。
(圖來(lái)自支付寶頁(yè)面截圖)
使用貫穿分割線(xiàn)時(shí),一般會(huì)用在這些消息不屬于一類(lèi),會(huì)用貫穿分割線(xiàn),比如:“今日頭條的新聞閱讀,微頭條和文章就會(huì)有貫穿分割線(xiàn)進(jìn)行分割”,不過(guò)有的時(shí)候,我們也會(huì)使用卡片的方式進(jìn)行分割,比如:“支付寶的首頁(yè),滑動(dòng)到下方的時(shí)候,會(huì)用卡片的樣式進(jìn)行分類(lèi)?!?/p>
(圖來(lái)自支付寶和今日頭條頁(yè)面的截圖)
文字顏色的對(duì)比,感受的細(xì)節(jié),信息類(lèi)別與內(nèi)容同時(shí)出現(xiàn)多文字時(shí),內(nèi)容更為重要,用戶(hù)關(guān)心的是自己的信息,而類(lèi)別是平臺(tái)為產(chǎn)生的信息作出的一種解釋?zhuān)蛘哒f(shuō)平臺(tái)自己想表達(dá)的信息,比如:“我們?cè)谑褂弥Ц豆ぞ邥r(shí),支付完成后會(huì)有一個(gè)頁(yè)面提供具體明細(xì)”
(圖來(lái)自支付寶交易頁(yè)面截圖)
這種屬于強(qiáng)弱的對(duì)比方式,還有一種是顏色深淺的方式,常用的就是對(duì)文字進(jìn)行標(biāo)注紅色、藍(lán)色等字體來(lái),這種比較醒目,常常是應(yīng)用到需要用戶(hù)特別注意到什么內(nèi)容才會(huì)使用,比如“支付寶在付款成功后,會(huì)有一個(gè)藍(lán)色字體引導(dǎo)用戶(hù)做下一步動(dòng)作?!?/p>
(圖來(lái)自支付寶交易頁(yè)面截圖)
不同的圖文順序?qū)τ脩?hù)閱讀體驗(yàn)有很大的影響,我們需要根據(jù)用戶(hù)的閱讀習(xí)慣來(lái)確定合理的順序,比如我們閱讀新聞資訊、還有公眾號(hào)文章,文字的信息會(huì)高于圖片,往往文字會(huì)排在前面。
(圖來(lái)自36氪APP頁(yè)面截圖)
對(duì)于新聞資訊如此,但是對(duì)于圖片類(lèi)型的網(wǎng)站,還有電商類(lèi)型的網(wǎng)站,視覺(jué)高于文字,因此圖片和文字的排版方式就會(huì)有所改變。
(圖來(lái)自京東APP商品列表頁(yè)截圖)
很多設(shè)計(jì)師在設(shè)計(jì)圖片的時(shí)候,都會(huì)使用與業(yè)務(wù)相同的icon,因?yàn)檫@樣識(shí)別起來(lái)就減少阻礙,比如“飛豬口令兌換,使用的圖標(biāo)與其接近”,現(xiàn)在很多平臺(tái)直接使用類(lèi)似的圖片設(shè)計(jì)成icon,識(shí)別起來(lái)更簡(jiǎn)單,比如:“美團(tuán)買(mǎi)菜、叮咚買(mǎi)菜。”
(圖來(lái)自飛豬APP和叮咚買(mǎi)菜APP頁(yè)面截圖)
除了圖標(biāo)icon的相關(guān)性,從顏色上也可考慮做到相關(guān)性,不過(guò)顏色的相關(guān)性一般從兩個(gè)維度,大家強(qiáng)調(diào)的品牌色,另外一個(gè)就是從業(yè)務(wù)角度考慮,這樣也能快速傳遞信息,比如:“現(xiàn)在在健康碼,通過(guò)紅黃綠三種”。
(圖來(lái)自i深圳小程序頁(yè)面的截圖)
通過(guò)層次對(duì)比來(lái)彰顯重要信息,層次對(duì)比一般在關(guān)鍵詞時(shí)刻做得比較多,目前個(gè)類(lèi)APP、網(wǎng)站應(yīng)用非常廣泛,比如我們熟悉的電商平臺(tái),當(dāng)用戶(hù)在下單時(shí),會(huì)將下單按鈕的顏色做得特別深,比如:“下方為非豬APP和騰訊理財(cái)通,在瀏覽頁(yè)面時(shí)下單按鈕比較醒目”。
視覺(jué)層次對(duì)比除了色塊上,有的時(shí)候文字上也會(huì)用到,通過(guò)加深重點(diǎn)信息來(lái)達(dá)到傳遞目的,比如:“拼多多APP會(huì)在用戶(hù)下單未完成選擇返回時(shí)的攔截提醒”。
相似性的原理構(gòu)成部分,主要是為“形狀、顏色、方向、紋理”,比如:“相同形狀但是不同顏色的圓形圖案,就屬于相似,不同形狀但是顏色相同,也屬于相似?!北热纾骸拔覀兛达w豬APP首頁(yè)的設(shè)計(jì),在金剛區(qū)的下方,出現(xiàn)了很多黃色的icon圖標(biāo),這類(lèi)一般都會(huì)把它歸為一類(lèi),這是因?yàn)樗麄冾伾嗤薄?/p>
在UI設(shè)計(jì)規(guī)范中的控件組合成的組件,大部分會(huì)使用到相似原則,這樣統(tǒng)一視覺(jué)樣式,來(lái)表達(dá)功能的統(tǒng)一性,比如“標(biāo)簽欄,app底部的4個(gè)菜單欄”。
但是有的時(shí)候,我們想要凸顯其中一個(gè)元素出來(lái),就會(huì)選擇不一樣的視覺(jué)來(lái)呈現(xiàn),以此達(dá)到凸顯的效果,比如下方圖中:“抖音極速版的底部中間菜單欄就用一個(gè)大紅色的錢(qián)袋來(lái)區(qū)分,頭條在icon旁邊增加標(biāo)簽”,現(xiàn)在很多平臺(tái)會(huì)利用不同的手段來(lái)進(jìn)行區(qū)分,像小紅點(diǎn)、顏色加深、數(shù)字、動(dòng)效等方式來(lái)提醒用戶(hù)點(diǎn)擊?!?/p>
面對(duì)離散的碎片時(shí),我們的視覺(jué)會(huì)更傾向于感知連續(xù)性的內(nèi)容,好的設(shè)計(jì)指引,會(huì)引導(dǎo)用戶(hù)感知事物的形狀和運(yùn)動(dòng)的方向。
尤其是,我們?cè)谝粋€(gè)頁(yè)面無(wú)法表達(dá)完全部信息時(shí),這個(gè)時(shí)候一般都會(huì)應(yīng)用到連續(xù)性,目前連續(xù)性應(yīng)用已非常廣泛,比如:“多張banner圖滑動(dòng)的互動(dòng)模塊、以及滑動(dòng)組件和進(jìn)度條等等”,大概通過(guò)這幾類(lèi)方式來(lái)引導(dǎo)用戶(hù)瀏覽被隱藏的內(nèi)容。
下方案例為“同程APP,頂部多張圖片banner,以及文字菜單可往左滑動(dòng)的”。
人們?cè)谟^察一個(gè)事物時(shí),會(huì)傾向于把一個(gè)不完整的局部當(dāng)作一個(gè)整體來(lái)感知,會(huì)將不連續(xù)性的信息和物體,以及敞開(kāi)的圖形形自動(dòng)補(bǔ)充,從而感知到它是完整的物體。因?yàn)?,我們?huì)將一個(gè)不完整等物體與我們認(rèn)知中的原型進(jìn)行相匹配,從而達(dá)成認(rèn)知。
當(dāng)如果我們應(yīng)用在設(shè)計(jì)圖中,就需要主義把握不完整的物體尺寸,避免太過(guò)于零散,導(dǎo)致用戶(hù)認(rèn)知時(shí)出現(xiàn)混亂,比如:“知名蘋(píng)果公司的logo,缺了一個(gè)口但是還能識(shí)別出是蘋(píng)果”。
封閉性的方式,會(huì)應(yīng)用在比較私密性的設(shè)計(jì)中,比如:“我們銀行卡賬戶(hù),往往都會(huì)對(duì)部分?jǐn)?shù)字打星號(hào),但是不會(huì)讓用戶(hù)不理解這是賬號(hào),包括卡片的露半原則”,這樣其實(shí)有利于節(jié)省空間。
關(guān)于對(duì)設(shè)計(jì)圖的一些思考整理到此,當(dāng)然知識(shí)遠(yuǎn)不止這些。最近還在閱讀一本書(shū),叫做《設(shè)計(jì)心理學(xué)》,里面強(qiáng)調(diào)了從用戶(hù)習(xí)慣來(lái)思考,另外當(dāng)用戶(hù)來(lái)到這個(gè)頁(yè)面時(shí),需要告訴用戶(hù)能干什么,以及在哪里干,而且需要在3秒的時(shí)間內(nèi)讓用戶(hù)知道,否則用戶(hù)會(huì)選擇離開(kāi),用一個(gè)詞來(lái)表達(dá)就是“意符”。
所以好的設(shè)計(jì),都離不開(kāi)告訴用戶(hù)干什么?在我們?nèi)粘.a(chǎn)品設(shè)計(jì)中,比如:“輸入框就知道輸入內(nèi)容、選擇框就知道是做選擇、這個(gè)>符號(hào)就知道還是可以點(diǎn)擊的等等”這些都是告訴用戶(hù)可以干什么比較好的例子。
不過(guò)這些比較寬泛,我們需要更具體的描述內(nèi)容,在日常設(shè)計(jì)師對(duì)接過(guò)程中,最忌諱的就是表達(dá)不清晰、過(guò)多強(qiáng)調(diào)與主觀感受,而不是用客觀事實(shí)的方式來(lái)進(jìn)行溝通。
當(dāng)遇到問(wèn)題的時(shí)候,一定要把抽象化的東西具象化表達(dá)出來(lái),這樣才有理說(shuō)服對(duì)方,不然表達(dá)的內(nèi)容會(huì)空洞無(wú)力,站不住腳。
本文為作者獨(dú)立觀點(diǎn),不代表鳥(niǎo)哥筆記立場(chǎng),未經(jīng)允許不得轉(zhuǎn)載。
《鳥(niǎo)哥筆記版權(quán)及免責(zé)申明》 如對(duì)文章、圖片、字體等版權(quán)有疑問(wèn),請(qǐng)點(diǎn)擊 反饋舉報(bào)
我們致力于提供一個(gè)高質(zhì)量?jī)?nèi)容的交流平臺(tái)。為落實(shí)國(guó)家互聯(lián)網(wǎng)信息辦公室“依法管網(wǎng)、依法辦網(wǎng)、依法上網(wǎng)”的要求,為完善跟帖評(píng)論自律管理,為了保護(hù)用戶(hù)創(chuàng)造的內(nèi)容、維護(hù)開(kāi)放、真實(shí)、專(zhuān)業(yè)的平臺(tái)氛圍,我們團(tuán)隊(duì)將依據(jù)本公約中的條款對(duì)注冊(cè)用戶(hù)和發(fā)布在本平臺(tái)的內(nèi)容進(jìn)行管理。平臺(tái)鼓勵(lì)用戶(hù)創(chuàng)作、發(fā)布優(yōu)質(zhì)內(nèi)容,同時(shí)也將采取必要措施管理違法、侵權(quán)或有其他不良影響的網(wǎng)絡(luò)信息。
一、根據(jù)《網(wǎng)絡(luò)信息內(nèi)容生態(tài)治理規(guī)定》《中華人民共和國(guó)未成年人保護(hù)法》等法律法規(guī),對(duì)以下違法、不良信息或存在危害的行為進(jìn)行處理。
1. 違反法律法規(guī)的信息,主要表現(xiàn)為:
1)反對(duì)憲法所確定的基本原則;
2)危害國(guó)家安全,泄露國(guó)家秘密,顛覆國(guó)家政權(quán),破壞國(guó)家統(tǒng)一,損害國(guó)家榮譽(yù)和利益;
3)侮辱、濫用英烈形象,歪曲、丑化、褻瀆、否定英雄烈士事跡和精神,以侮辱、誹謗或者其他方式侵害英雄烈士的姓名、肖像、名譽(yù)、榮譽(yù);
4)宣揚(yáng)恐怖主義、極端主義或者煽動(dòng)實(shí)施恐怖活動(dòng)、極端主義活動(dòng);
5)煽動(dòng)民族仇恨、民族歧視,破壞民族團(tuán)結(jié);
6)破壞國(guó)家宗教政策,宣揚(yáng)邪教和封建迷信;
7)散布謠言,擾亂社會(huì)秩序,破壞社會(huì)穩(wěn)定;
8)宣揚(yáng)淫穢、色情、賭博、暴力、兇殺、恐怖或者教唆犯罪;
9)煽動(dòng)非法集會(huì)、結(jié)社、游行、示威、聚眾擾亂社會(huì)秩序;
10)侮辱或者誹謗他人,侵害他人名譽(yù)、隱私和其他合法權(quán)益;
11)通過(guò)網(wǎng)絡(luò)以文字、圖片、音視頻等形式,對(duì)未成年人實(shí)施侮辱、誹謗、威脅或者惡意損害未成年人形象進(jìn)行網(wǎng)絡(luò)欺凌的;
12)危害未成年人身心健康的;
13)含有法律、行政法規(guī)禁止的其他內(nèi)容;
2. 不友善:不尊重用戶(hù)及其所貢獻(xiàn)內(nèi)容的信息或行為。主要表現(xiàn)為:
1)輕蔑:貶低、輕視他人及其勞動(dòng)成果;
2)誹謗:捏造、散布虛假事實(shí),損害他人名譽(yù);
3)嘲諷:以比喻、夸張、侮辱性的手法對(duì)他人或其行為進(jìn)行揭露或描述,以此來(lái)激怒他人;
4)挑釁:以不友好的方式激怒他人,意圖使對(duì)方對(duì)自己的言論作出回應(yīng),蓄意制造事端;
5)羞辱:貶低他人的能力、行為、生理或身份特征,讓對(duì)方難堪;
6)謾罵:以不文明的語(yǔ)言對(duì)他人進(jìn)行負(fù)面評(píng)價(jià);
7)歧視:煽動(dòng)人群歧視、地域歧視等,針對(duì)他人的民族、種族、宗教、性取向、性別、年齡、地域、生理特征等身份或者歸類(lèi)的攻擊;
8)威脅:許諾以不良的后果來(lái)迫使他人服從自己的意志;
3. 發(fā)布垃圾廣告信息:以推廣曝光為目的,發(fā)布影響用戶(hù)體驗(yàn)、擾亂本網(wǎng)站秩序的內(nèi)容,或進(jìn)行相關(guān)行為。主要表現(xiàn)為:
1)多次發(fā)布包含售賣(mài)產(chǎn)品、提供服務(wù)、宣傳推廣內(nèi)容的垃圾廣告。包括但不限于以下幾種形式:
2)單個(gè)帳號(hào)多次發(fā)布包含垃圾廣告的內(nèi)容;
3)多個(gè)廣告帳號(hào)互相配合發(fā)布、傳播包含垃圾廣告的內(nèi)容;
4)多次發(fā)布包含欺騙性外鏈的內(nèi)容,如未注明的淘寶客鏈接、跳轉(zhuǎn)網(wǎng)站等,誘騙用戶(hù)點(diǎn)擊鏈接
5)發(fā)布大量包含推廣鏈接、產(chǎn)品、品牌等內(nèi)容獲取搜索引擎中的不正當(dāng)曝光;
6)購(gòu)買(mǎi)或出售帳號(hào)之間虛假地互動(dòng),發(fā)布干擾網(wǎng)站秩序的推廣內(nèi)容及相關(guān)交易。
7)發(fā)布包含欺騙性的惡意營(yíng)銷(xiāo)內(nèi)容,如通過(guò)偽造經(jīng)歷、冒充他人等方式進(jìn)行惡意營(yíng)銷(xiāo);
8)使用特殊符號(hào)、圖片等方式規(guī)避垃圾廣告內(nèi)容審核的廣告內(nèi)容。
4. 色情低俗信息,主要表現(xiàn)為:
1)包含自己或他人性經(jīng)驗(yàn)的細(xì)節(jié)描述或露骨的感受描述;
2)涉及色情段子、兩性笑話(huà)的低俗內(nèi)容;
3)配圖、頭圖中包含庸俗或挑逗性圖片的內(nèi)容;
4)帶有性暗示、性挑逗等易使人產(chǎn)生性聯(lián)想;
5)展現(xiàn)血腥、驚悚、殘忍等致人身心不適;
6)炒作緋聞、丑聞、劣跡等;
7)宣揚(yáng)低俗、庸俗、媚俗內(nèi)容。
5. 不實(shí)信息,主要表現(xiàn)為:
1)可能存在事實(shí)性錯(cuò)誤或者造謠等內(nèi)容;
2)存在事實(shí)夸大、偽造虛假經(jīng)歷等誤導(dǎo)他人的內(nèi)容;
3)偽造身份、冒充他人,通過(guò)頭像、用戶(hù)名等個(gè)人信息暗示自己具有特定身份,或與特定機(jī)構(gòu)或個(gè)人存在關(guān)聯(lián)。
6. 傳播封建迷信,主要表現(xiàn)為:
1)找人算命、測(cè)字、占卜、解夢(mèng)、化解厄運(yùn)、使用迷信方式治?。?br /> 2)求推薦算命看相大師;
3)針對(duì)具體風(fēng)水等問(wèn)題進(jìn)行求助或咨詢(xún);
4)問(wèn)自己或他人的八字、六爻、星盤(pán)、手相、面相、五行缺失,包括通過(guò)占卜方法問(wèn)婚姻、前程、運(yùn)勢(shì),東西寵物丟了能不能找回、取名改名等;
7. 文章標(biāo)題黨,主要表現(xiàn)為:
1)以各種夸張、獵奇、不合常理的表現(xiàn)手法等行為來(lái)誘導(dǎo)用戶(hù);
2)內(nèi)容與標(biāo)題之間存在嚴(yán)重不實(shí)或者原意扭曲;
3)使用夸張標(biāo)題,內(nèi)容與標(biāo)題嚴(yán)重不符的。
8.「飯圈」亂象行為,主要表現(xiàn)為:
1)誘導(dǎo)未成年人應(yīng)援集資、高額消費(fèi)、投票打榜
2)粉絲互撕謾罵、拉踩引戰(zhàn)、造謠攻擊、人肉搜索、侵犯隱私
3)鼓動(dòng)「飯圈」粉絲攀比炫富、奢靡享樂(lè)等行為
4)以號(hào)召粉絲、雇用網(wǎng)絡(luò)水軍、「養(yǎng)號(hào)」形式刷量控評(píng)等行為
5)通過(guò)「蹭熱點(diǎn)」、制造話(huà)題等形式干擾輿論,影響傳播秩序
9. 其他危害行為或內(nèi)容,主要表現(xiàn)為:
1)可能引發(fā)未成年人模仿不安全行為和違反社會(huì)公德行為、誘導(dǎo)未成年人不良嗜好影響未成年人身心健康的;
2)不當(dāng)評(píng)述自然災(zāi)害、重大事故等災(zāi)難的;
3)美化、粉飾侵略戰(zhàn)爭(zhēng)行為的;
4)法律、行政法規(guī)禁止,或可能對(duì)網(wǎng)絡(luò)生態(tài)造成不良影響的其他內(nèi)容。
二、違規(guī)處罰
本網(wǎng)站通過(guò)主動(dòng)發(fā)現(xiàn)和接受用戶(hù)舉報(bào)兩種方式收集違規(guī)行為信息。所有有意的降低內(nèi)容質(zhì)量、傷害平臺(tái)氛圍及欺凌未成年人或危害未成年人身心健康的行為都是不能容忍的。
當(dāng)一個(gè)用戶(hù)發(fā)布違規(guī)內(nèi)容時(shí),本網(wǎng)站將依據(jù)相關(guān)用戶(hù)違規(guī)情節(jié)嚴(yán)重程度,對(duì)帳號(hào)進(jìn)行禁言 1 天、7 天、15 天直至永久禁言或封停賬號(hào)的處罰。當(dāng)涉及欺凌未成年人、危害未成年人身心健康、通過(guò)作弊手段注冊(cè)、使用帳號(hào),或者濫用多個(gè)帳號(hào)發(fā)布違規(guī)內(nèi)容時(shí),本網(wǎng)站將加重處罰。
三、申訴
隨著平臺(tái)管理經(jīng)驗(yàn)的不斷豐富,本網(wǎng)站出于維護(hù)本網(wǎng)站氛圍和秩序的目的,將不斷完善本公約。
如果本網(wǎng)站用戶(hù)對(duì)本網(wǎng)站基于本公約規(guī)定做出的處理有異議,可以通過(guò)「建議反饋」功能向本網(wǎng)站進(jìn)行反饋。
(規(guī)則的最終解釋權(quán)歸屬本網(wǎng)站所有)