用戶體驗(yàn)要素-筆記總結(jié)(下)


4.框架層 界面設(shè)計(jì)、導(dǎo)航設(shè)計(jì)贪绘、信息設(shè)計(jì)界面設(shè)計(jì)

框架層(圖中交互設(shè)計(jì)應(yīng)為界面設(shè)計(jì))

界面設(shè)計(jì):提供用戶做某些事的能力税灌,通過(guò)它苞也,用戶能真正接觸到那些“在結(jié)構(gòu)層的交互設(shè)計(jì) 中”確定的“具體功能粘秆。”

導(dǎo)航設(shè)計(jì):提供給用戶去某個(gè)地方的能力氓涣,通過(guò)它劳吠,用戶可以在結(jié)構(gòu)中自由穿行痒玩。

信息設(shè)計(jì):給用戶傳達(dá)想法蠢古〔菅龋跨越了“以任務(wù)為導(dǎo)向”的功能型產(chǎn)品和以“信息為導(dǎo)向”的信息型產(chǎn)品的邊界炉菲。是界面設(shè)計(jì)和信息設(shè)計(jì)的基礎(chǔ)拍霜。

界面設(shè)計(jì)

? ? ? 選擇正確的界面元素。這些界面元素能幫助用戶完成他們的任務(wù)越驻,還能通過(guò)適當(dāng)?shù)姆椒ㄗ屗鼈內(nèi)菀妆焕斫夂褪褂玫劳怠D男┕δ茉谀膫€(gè)界面上完成试疙,是我們?cè)诮Y(jié)構(gòu)層的交互設(shè)計(jì)中決定的抠蚣;而這些功能在界面上如何被用戶認(rèn)知到,則屬于界面設(shè)計(jì)的范疇距贷。設(shè)計(jì)復(fù)雜系統(tǒng)的界面所面臨的最大挑戰(zhàn)之一:弄清楚用戶不需要知道哪些東西忠蝗,并減少它們的可發(fā)現(xiàn)行阁最。界面設(shè)計(jì)可以采用各種各樣的技巧速种,使用戶完成目標(biāo)的過(guò)程變得容易低千。一個(gè)簡(jiǎn)單的技巧示血,在這個(gè)界面第一次呈現(xiàn)給用戶的時(shí)候难审,仔細(xì)考慮每一個(gè)選項(xiàng)的默認(rèn)值告喊。

復(fù)選框(checkbox):允許用戶獨(dú)立地選擇各個(gè)選項(xiàng)葱绒。

單選框(radio button):允許用戶從一組互斥的選項(xiàng)中選擇一個(gè)地淀。

文本框(text field):允許用戶---等待著用戶---輸入文字。

下拉菜單(dropdown list):在緊湊的空間中实苞,讓用戶從一組互斥的選項(xiàng)中選擇一個(gè)黔牵。

多選菜單(list box):在緊湊的空間中猾浦,允許用戶獨(dú)立地選擇各個(gè)選項(xiàng)金赦。

按鈕(action button):告訴體統(tǒng)接受用戶通過(guò)其他界面元素提交的所有信息,并用這些信息來(lái)做一些事情---采取動(dòng)作绳慎。

導(dǎo)航設(shè)計(jì)

滿足3個(gè)要點(diǎn)

1.給用戶提供一種在網(wǎng)站間跳轉(zhuǎn)的方法杏愤。

2.傳達(dá)出導(dǎo)航與他們所包含內(nèi)容之間的關(guān)系声邦。

3.傳達(dá)出它的內(nèi)容和用戶當(dāng)前瀏覽頁(yè)面之間的關(guān)系

假設(shè)用戶不會(huì)將上一頁(yè)的信息帶到下一頁(yè)中亥曹。

1.全局導(dǎo)航:提供了覆蓋整個(gè)網(wǎng)站的通路

2.局部導(dǎo)航:提供給用戶在這個(gè)架構(gòu)中到“附近地點(diǎn)”的通路媳瞪。

3.輔助導(dǎo)航:提供了全局全局導(dǎo)航或局部導(dǎo)航不能快速到相關(guān)內(nèi)容的快捷途徑蛇受,提供了一些分類方面的好處兢仰,同時(shí)能保持網(wǎng)站的主要層級(jí)結(jié)構(gòu)。

4.上下文導(dǎo)航:嵌入頁(yè)面自身內(nèi)容的導(dǎo)航忆矛,即文本的超鏈接導(dǎo)航。

5.友好導(dǎo)航:提供給用戶他們通常不會(huì)需要的鏈接洽议。

6.網(wǎng)站地圖:作為網(wǎng)站的一個(gè)分級(jí)概要出現(xiàn)亚兄,提供所有以及導(dǎo)航的鏈接,并與縮進(jìn)顯示的采驻、主要二級(jí)導(dǎo)航鏈接起來(lái)审胚。

7.索引表:按字母順序排列的匈勋、鏈接到相關(guān)頁(yè)面的列表。

信息設(shè)計(jì)

信息設(shè)計(jì)的分類依據(jù):1.反應(yīng)用戶的思路菲盾,2.支持用戶的任務(wù)和目標(biāo)颓影。由于界面不僅僅只是用來(lái)收集用戶信息各淀,它還需要向用戶呈現(xiàn)信息懒鉴,所以信息設(shè)計(jì)在解決界面設(shè)計(jì)的問(wèn)題中扮演重要角色。

指示標(biāo)示

用來(lái)幫助用戶理解“他們?cè)谀摹薄八麄兡苋ツ摹?/p>

圖標(biāo)碎浇、標(biāo)簽系統(tǒng)和排版是另外的信息設(shè)計(jì)方式临谱,有時(shí)幫助用戶加強(qiáng)“你在這里的”感覺(jué)奴璃。

線框圖

線框圖/頁(yè)面示意圖:將信息設(shè)計(jì)、界面設(shè)計(jì)和導(dǎo)航設(shè)計(jì)防止在一起,形成一個(gè)統(tǒng)一的、有內(nèi)在凝聚力的架構(gòu)的地方僵蛛。

線框圖是整合在框架層的全部三種要素的方法:

1.通過(guò)安排和選擇界面元素來(lái)整合界面設(shè)計(jì)

2.通過(guò)識(shí)別和定義核心導(dǎo)航系統(tǒng)來(lái)整合導(dǎo)航設(shè)計(jì)

3.通過(guò)防止和排列信息組成部分的優(yōu)先級(jí)來(lái)整合信息設(shè)計(jì)喉酌。

5.表現(xiàn)層 感知設(shè)計(jì)

表現(xiàn)層:解決“產(chǎn)品框架層的邏輯排布”的感知呈現(xiàn)問(wèn)題相速。

視覺(jué)

視覺(jué)設(shè)計(jì)應(yīng)關(guān)注的點(diǎn):

應(yīng)該把注意力集中在設(shè)計(jì)的“運(yùn)作是否良好”

之前就確定的目標(biāo),視覺(jué)設(shè)計(jì)應(yīng)的支持如何?

忠于眼睛

評(píng)估一個(gè)產(chǎn)品視覺(jué)的簡(jiǎn)單方法:你的視線首先落在上面地方?哪個(gè)設(shè)計(jì)要素在第一時(shí)間吸引用戶的注意力?他們是對(duì)于戰(zhàn)略目標(biāo)來(lái)講很重要的東西嗎?或者用戶第一時(shí)間注意到的東西與他們的目標(biāo)是背道而馳的么?

如果你的設(shè)計(jì)師成功的,用戶眼睛的移動(dòng)軌跡應(yīng)該滿足一下兩點(diǎn)

1.有一條流暢的路徑指引用戶

2.這條路徑引導(dǎo)用戶去完成某個(gè)目標(biāo)和任務(wù)。

對(duì)比和一致性

對(duì)比是一個(gè)重要手段,能幫助用戶理解頁(yè)面導(dǎo)航元素之間的關(guān)系。對(duì)比還可以傳達(dá)信息設(shè)計(jì)中的概念群組。一致性:能使你的設(shè)計(jì)有效得傳達(dá)信息,而不會(huì)導(dǎo)致用戶迷惑或者焦慮恬汁。

基于柵格線:使用“母版”來(lái)確保設(shè)計(jì)的一致性约巷。

內(nèi)部和外部的一致性

內(nèi)部產(chǎn)品和外部產(chǎn)品不統(tǒng)一

解決辦法:確定有可能在產(chǎn)品各種各樣的界面囚聚、導(dǎo)航和信息設(shè)計(jì)等不同環(huán)境中反復(fù)出現(xiàn)的設(shè)計(jì)元素料皇,進(jìn)行一個(gè)方案設(shè)計(jì),病將這個(gè)方案應(yīng)用到整個(gè)產(chǎn)品中去军洼。

配色方案和排版

核心的配色方案通常是一個(gè)更廣泛的配色方案的一部分甘桑,這套配色方案要在一個(gè)企業(yè)的所有材料中得到應(yīng)用德谅。對(duì)比和一致性對(duì)于創(chuàng)建配色方案也扮演了重要角色。

排版:字體的選擇

設(shè)計(jì)合成品和風(fēng)格指南

風(fēng)格指南:匯總確定了視覺(jué)設(shè)計(jì)的每個(gè)方面惫确,從最大到最小的范圍的所有元素揍鸟,比如設(shè)計(jì)柵格谈撒、配色方案、字體標(biāo)準(zhǔn)或標(biāo)志應(yīng)用指南

要素的應(yīng)用

創(chuàng)建良好的用戶體驗(yàn)最重要的內(nèi)容是大量收集亟待解決的非常細(xì)微的問(wèn)題溯乒。1.了解你正在試著去解決的問(wèn)題:你已經(jīng)知道主頁(yè)的紫色的大按鈕是個(gè)問(wèn)題,那這個(gè)問(wèn)題是表現(xiàn)層灯帮?框架層迎献?還是結(jié)構(gòu)層伴奥?2.了解這些解決辦法所造成的成果:在你的產(chǎn)品某個(gè)部分運(yùn)作得非常好的導(dǎo)航設(shè)計(jì)尼啡,可能完全不符合結(jié)構(gòu)層的另一個(gè)部分。

用戶體驗(yàn)的決策體現(xiàn)在這些場(chǎng)景之中:1.由現(xiàn)狀決定的設(shè)計(jì)。2.由模仿決定設(shè)計(jì)核畴。3.由領(lǐng)導(dǎo)決定的設(shè)計(jì)膝但。


用戶體驗(yàn)要素

必須要同時(shí)考慮五個(gè)層面的全部因素,這是對(duì)創(chuàng)建成功的用戶體驗(yàn)至關(guān)重要的谤草。

面對(duì)哪些設(shè)計(jì)用戶體驗(yàn)時(shí)需要解決的糾纏不清的小問(wèn)題跟束,有時(shí)會(huì)是一件令人氣餒的事情。有時(shí)需要作出妥協(xié)并評(píng)估利弊進(jìn)行取舍丑孩,也很容易讓人沮喪冀宴、懷疑。正確的做法是:每一個(gè)決定都建立在對(duì)其背后議題理解的基礎(chǔ)之上温学,問(wèn)自己:你為什么要這么做略贮?

用戶體驗(yàn)設(shè)計(jì)是一場(chǎng)馬拉松,可能在短期內(nèi)花費(fèi)一定的時(shí)間,但是它們將在一個(gè)更長(zhǎng)時(shí)期中節(jié)省更多的時(shí)間逃延。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末览妖,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子揽祥,更是在濱河造成了極大的恐慌黄痪,老刑警劉巖,帶你破解...
    沈念sama閱讀 210,978評(píng)論 6 490
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件盔然,死亡現(xiàn)場(chǎng)離奇詭異桅打,居然都是意外死亡,警方通過(guò)查閱死者的電腦和手機(jī)愈案,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 89,954評(píng)論 2 384
  • 文/潘曉璐 我一進(jìn)店門挺尾,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái),“玉大人站绪,你說(shuō)我怎么就攤上這事遭铺。” “怎么了恢准?”我有些...
    開(kāi)封第一講書(shū)人閱讀 156,623評(píng)論 0 345
  • 文/不壞的土叔 我叫張陵魂挂,是天一觀的道長(zhǎng)。 經(jīng)常有香客問(wèn)我馁筐,道長(zhǎng)涂召,這世上最難降的妖魔是什么? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 56,324評(píng)論 1 282
  • 正文 為了忘掉前任敏沉,我火速辦了婚禮果正,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘盟迟。我一直安慰自己秋泳,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,390評(píng)論 5 384
  • 文/花漫 我一把揭開(kāi)白布攒菠。 她就那樣靜靜地躺著迫皱,像睡著了一般。 火紅的嫁衣襯著肌膚如雪辖众。 梳的紋絲不亂的頭發(fā)上卓起,一...
    開(kāi)封第一講書(shū)人閱讀 49,741評(píng)論 1 289
  • 那天,我揣著相機(jī)與錄音赵辕,去河邊找鬼既绩。 笑死,一個(gè)胖子當(dāng)著我的面吹牛还惠,可吹牛的內(nèi)容都是我干的饲握。 我是一名探鬼主播,決...
    沈念sama閱讀 38,892評(píng)論 3 405
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼救欧!你這毒婦竟也來(lái)了衰粹?” 一聲冷哼從身側(cè)響起,我...
    開(kāi)封第一講書(shū)人閱讀 37,655評(píng)論 0 266
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤笆怠,失蹤者是張志新(化名)和其女友劉穎铝耻,沒(méi)想到半個(gè)月后,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體蹬刷,經(jīng)...
    沈念sama閱讀 44,104評(píng)論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡瓢捉,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,451評(píng)論 2 325
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了办成。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片泡态。...
    茶點(diǎn)故事閱讀 38,569評(píng)論 1 340
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖迂卢,靈堂內(nèi)的尸體忽然破棺而出某弦,到底是詐尸還是另有隱情,我是刑警寧澤而克,帶...
    沈念sama閱讀 34,254評(píng)論 4 328
  • 正文 年R本政府宣布靶壮,位于F島的核電站,受9級(jí)特大地震影響员萍,放射性物質(zhì)發(fā)生泄漏腾降。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,834評(píng)論 3 312
  • 文/蒙蒙 一充活、第九天 我趴在偏房一處隱蔽的房頂上張望蜂莉。 院中可真熱鬧,春花似錦混卵、人聲如沸。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 30,725評(píng)論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至宿接,卻和暖如春赘淮,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背睦霎。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 31,950評(píng)論 1 264
  • 我被黑心中介騙來(lái)泰國(guó)打工梢卸, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人副女。 一個(gè)月前我還...
    沈念sama閱讀 46,260評(píng)論 2 360
  • 正文 我出身青樓蛤高,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子戴陡,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,446評(píng)論 2 348

推薦閱讀更多精彩內(nèi)容