欧美乱伦图片区,国产日韩欧美一区二区三区四区五区,欧美性色爽,乱伦小说网站免费观看视频,啊用力啊好深啊H在线观看,男女做哎爱过程图片

信息動(dòng)態(tài)

網(wǎng)站設(shè)計(jì)是技術(shù)與創(chuàng)意的完美融合!

建站常識(shí)

信息架構(gòu)中的常見模型

2010-05-12 08:20:00

《信息架構(gòu)中的常見模型》是整個(gè)“web交互設(shè)計(jì)方法”中的一部分:

本期的內(nèi)容目的是分享和總結(jié)信息架構(gòu)中一部分基本的交互模型。信息架構(gòu)需要考慮內(nèi)容和功能的建構(gòu), 首先需要考慮怎樣組織內(nèi)容和功能的關(guān)系,也就是切分內(nèi)容,如何把一些動(dòng)作和對(duì)象跟主題順暢的結(jié)合起來(lái);第二步就是考慮怎樣引導(dǎo)用戶通過界面達(dá)成他們的目標(biāo),也就是用”物理結(jié)構(gòu)”把內(nèi)容用頁(yè)面窗口面板等元素將信息表達(dá)出來(lái),交互模型正是針對(duì)第二個(gè)步驟來(lái)說(shuō)的,這些模式幫助我們?cè)诒磉_(dá)信息的時(shí)候能夠有一些常用的思路和出發(fā)點(diǎn)。

1.  雙面板展示(Two-panel Selector)

【形式】把兩個(gè)相鄰的面板放在界面上,在第一個(gè)面板顯示一組對(duì)象,用戶可以從中任意選擇,在第二個(gè)面板上顯示選中對(duì)象的內(nèi)容。

【優(yōu)點(diǎn)】

這種模式由于兩個(gè)面板相鄰擺放,用戶可以很快把他們的注意力換來(lái)?yè)Q去,一會(huì)看著列表的整個(gè)結(jié)構(gòu)(比如圖中顯示了哪些是最新的應(yīng)用),一會(huì)查看一個(gè)對(duì)象的詳細(xì)信息(這個(gè)應(yīng)用是做什么的,有哪些內(nèi)容等等)。與單個(gè)窗口相比,這種緊密地集成有幾個(gè)突出的好處:

減少體力開支,兩個(gè)面板距離很近,用戶的眼睛不需要進(jìn)行長(zhǎng)距離的穿梭,可以通過用一次鼠標(biāo)單擊或按鍵來(lái)改變選擇的項(xiàng)目,而不是首先要在窗口和屏幕之間選擇;

減少了可視化的認(rèn)知負(fù)擔(dān),當(dāng)一個(gè)窗口彈出到最上面,或當(dāng)一個(gè)頁(yè)面的內(nèi)容完全改變時(shí),用戶就得花額外的注意力到現(xiàn)在要看的東西上,如果窗口本身一直不變,用戶就可以把注意力集中在一個(gè)較小的變化范圍內(nèi);

它也減少了記憶負(fù)擔(dān),這里左側(cè)的列表充當(dāng)了“路標(biāo)”的角色,因此用戶完全明白自己當(dāng)前是在哪個(gè)應(yīng)用下。

【用法】

整體布局:把可以進(jìn)行選擇的列表放在上面或左邊的面板上,顯示詳細(xì)內(nèi)容的面板放在下面或右邊,這樣做利用了絕大多數(shù)用戶的視線流動(dòng)方向,根據(jù)用戶從左到右的語(yǔ)言閱讀習(xí)慣讓用戶方便找到自己需要得到的信息。

列表的布局:一般有四種布局方式:線性列表,通常是排序的;二維表格,可以排序,也可以讓用戶通過列或行的標(biāo)題進(jìn)行過濾;空間組織方式,如地圖、圖表以及類似桌面的區(qū)域,讓用戶可以按自己的需要放置對(duì)象。

操作:當(dāng)用戶單擊列表中的一個(gè)對(duì)象時(shí),在第二個(gè)面板中立即顯示它的內(nèi)容或詳細(xì)信息。同時(shí)最好能支持鍵盤操作以改變選擇的方式,如上下箭頭鍵;

視覺:讓已經(jīng)選中的對(duì)象在視覺上突出顯示,如給選中的列表對(duì)象換一種顏色和亮度。

【例子】

Qzone中的雙面板應(yīng)用,當(dāng)從左側(cè)列表選擇出信息以后,右側(cè)會(huì)顯示該對(duì)象的詳細(xì)內(nèi)容,并且采用了主題類別的信息切分形式,如果從常用模式的基本應(yīng)用模式來(lái)看,當(dāng)用戶選中左側(cè)列表對(duì)象后,如果在視覺上能夠?qū)υ搶?duì)象進(jìn)行突出顯示,可能會(huì)更友好一些。

2.  畫布加工具條(Canvas Plus Palette)

【形式】

用于圖形編輯器上,把一個(gè)帶圖標(biāo)的工具條放在空白畫布旁邊,用戶單擊調(diào)色板工具條上的按鈕,在畫布上創(chuàng)建對(duì)象。通常工具條用來(lái)創(chuàng)建對(duì)象,畫布用來(lái)擺放對(duì)象。

【優(yōu)點(diǎn)】

這個(gè)模式來(lái)自于人們的日常生活經(jīng)驗(yàn),畫布、調(diào)色板,就是這樣的樣式,因此用戶在使用時(shí)容易理解;同時(shí)畫布加工具條也利用了可視化識(shí)別的好處,最常用的圖標(biāo)(畫筆、手型圖標(biāo)、放大鏡等)在各種不同的應(yīng)用系統(tǒng)中一次又一次的得到重用,而且每次都是同樣的用法,減少了用戶記憶和學(xué)習(xí)的成本。

【用法】

工具條本身應(yīng)該是一個(gè)圖標(biāo)按鈕或者看起來(lái)像按鈕的網(wǎng)格,由于中文本身詞匯的表達(dá)比較強(qiáng),所以工具條里用圖標(biāo)加文字的形式會(huì)更容易理解。

工具條放在畫布的左邊或者上面,當(dāng)工具比較多時(shí),可以吧工具條的圖標(biāo)分成幾個(gè)小組,比如用(card stack)模式的TAB來(lái)表示這些分組。

【例子】

QQ秀泡泡日志的編輯框正是一個(gè)畫布加工具條的用戶, 通過Icon加文字的形式組成了工具條,并用分割線將工具進(jìn)行了分組。

3.  向?qū)В╓izard)

【形式】

在界面上一步步引導(dǎo)用戶按預(yù)定的順序完成任務(wù),把任務(wù)分成一系列步驟,在每個(gè)步驟里讓用戶集中處理一件事情。如,Qzone個(gè)人空間的注冊(cè)頁(yè)面:

【優(yōu)點(diǎn)】

對(duì)于較長(zhǎng)的任務(wù),在設(shè)計(jì)用戶界面時(shí)如何讓用戶明白操作的步驟,向?qū)У膬?yōu)點(diǎn)正是讓用戶按照預(yù)先規(guī)劃的路線圖來(lái)組織這項(xiàng)任務(wù),而不用了解整個(gè)任務(wù)的結(jié)構(gòu),用戶要做就是按順序執(zhí)行每個(gè)步驟,相信他們?nèi)绻裱甘荆蜁?huì)成功完成。

【用法】

把組成任務(wù)的操作分成幾個(gè)部分或幾組操作,各個(gè)部分的次序排列可能必須是嚴(yán)格限制的,也可以是能夠由用戶選擇的。

Qzone的的注冊(cè)過程包括 選擇風(fēng)格樣式、填寫個(gè)人信息、補(bǔ)充資料和完成四步,用戶必須依次填寫,而不能先填寫后面的步驟再回來(lái)寫前面的;而對(duì)于一些在線支付類的流程,從產(chǎn)品挑選、支付信息、支付地址、送貨地址等步驟,它們的順序并不重要,因?yàn)楹竺娴倪x擇并不依賴前面的選擇,把相關(guān)的選擇放在一起只是簡(jiǎn)化了人們填寫表單的工作。

任務(wù)拆分后步驟的數(shù)量和粒度往往需要很好的權(quán)衡,如果只有兩步,那會(huì)顯得很傻,如果有十五步,就會(huì)顯得乏味枯燥;但是每個(gè)步驟也需要保證不能太復(fù)雜,不然失去了向?qū)У囊饬x。

#p#

【頁(yè)面表現(xiàn)】

1)多頁(yè)面表現(xiàn)形式

從頁(yè)面表現(xiàn)上來(lái)看,最簡(jiǎn)單的實(shí)現(xiàn)方式就是將每個(gè)步驟放在一個(gè)單獨(dú)的頁(yè)面上,用前進(jìn)和后退按鈕進(jìn)行控制,但這種形式也有缺點(diǎn),每個(gè)獨(dú)立的界面不能顯示上下文,用戶不知道前面和后面分別顯示的是什么,因此這樣的形式最好能夠允許用戶在進(jìn)行過程中能夠隨時(shí)向前或者向后移動(dòng)。因?yàn)槿绻荒茏層脩艨梢愿淖兦懊娴倪x項(xiàng)而必須重新開始那就會(huì)讓人受不了。從這點(diǎn)來(lái)說(shuō),如果是多頁(yè)面的向?qū)?,它的?biāo)準(zhǔn)的配置應(yīng)該是:

或者結(jié)合雙面板選擇模式:

2) 單一頁(yè)面表現(xiàn)形式:

第一種 帶標(biāo)題的欄目:標(biāo)題上有固定編號(hào),因?yàn)橐谎劬涂梢钥吹剿械牟襟E,所以這個(gè)模式適合用在分支不多的任務(wù)上。

第二種 響應(yīng)式允許或響應(yīng)式展開:在用戶完成前面一個(gè)步驟之后才把后面的步驟顯示在頁(yè)面上,如果向?qū)У牟襟E不多,采用這樣的方式會(huì)讓頁(yè)面更簡(jiǎn)潔一些。

總結(jié):

以上三種常用的模式:雙面板選擇、畫布加工具條以及向?qū)俏覀兘?jīng)常會(huì)在網(wǎng)頁(yè)設(shè)計(jì)中見到的模式,平時(shí)的使用中我們已經(jīng)在不知不覺中認(rèn)識(shí)并習(xí)慣它們了,通過這些基本的模式,在設(shè)計(jì)加以變形和創(chuàng)新就可以創(chuàng)造出更有趣和方便的交互方式。下面的例子是一個(gè)綜合了以上三種交互模式的例子:

顯而易見的,這個(gè)工具運(yùn)用了畫布加工具條的模式,由兩組工具條和一個(gè)畫布組成。同時(shí),這個(gè)網(wǎng)頁(yè)工具還結(jié)合了雙面板選擇模式,通過TAB把工具條進(jìn)行了分類,當(dāng)單擊“face”、“noses”、“l(fā)ips”時(shí),工具條一次變化,并顯示這些對(duì)象:

并且在操作步驟的提示上,采用了向?qū)J降捻憫?yīng)式展開:當(dāng)用戶第一次選擇TAB中的類型是,會(huì)提示用戶從工具條中選擇合適的元素到畫布當(dāng)中,而當(dāng)用戶作出選擇之后,則會(huì)顯示下一個(gè)步驟的提示:

0532-85810878 473587358 掃碼添加微信

掃碼添加微信

掃碼關(guān)注公眾號(hào)

官方公眾號(hào)

2054585360
大悟县| 屏南县| 根河市| 义马市| 青冈县| 乐陵市| 乌兰察布市| 乃东县| 景洪市| 华阴市| 定日县| 高雄市| 金沙县| 石阡县| 西和县| 鲁甸县| 萨迦县| 确山县| 通州市| 兰西县| 鲜城| 沿河| 板桥市| 呼伦贝尔市| 舒兰市| 旌德县| 枝江市| 安图县| 辉县市| 高唐县| 苏尼特左旗| 中超| 宿州市| 尚义县| 泸水县| 汾阳市| 井冈山市| 杭锦旗| 呼和浩特市| 涡阳县| 梁河县|