起點課堂會員權(quán)益
職業(yè)體系課特權(quán)
線下行業(yè)大會特權(quán)
個人IP打造特權(quán)
30+門專項技能課
1300+專題課程
12場職場軟技能直播
12場求職輔導(dǎo)直播
12場專業(yè)技能直播
會員專屬社群
榮耀標識網(wǎng)站如何做好用戶體驗（三）
建議先閱讀：
結(jié)構(gòu)層：交互設(shè)計與信息架構(gòu)
1. 結(jié)構(gòu)層是五個層面中的第三層，適當(dāng)?shù)膶⑽覀兊年P(guān)注點從抽象的決策與范圍問題，轉(zhuǎn)移到更能影響最后的用戶體驗的具體因素。它是范圍層的上面一層，為網(wǎng)站創(chuàng)建一個概念結(jié)構(gòu)，將分散的片段組成一個整體。
交互設(shè)計：關(guān)注于描述“可能的用戶行為”，同時定義“系統(tǒng)如何配合與響應(yīng)”這些用戶行為。
概念模型（conceptual model）：用戶對于“交互組件將怎樣工作”的觀點成為稱為概念模型。一個概念模型可以反映系統(tǒng)的一個組件或是整個系統(tǒng)，用于在交互設(shè)計的開發(fā)過程中保持使用方式的一致性。
2. 錯誤處理：系統(tǒng)要如何防止人們繼續(xù)犯錯？
（1）將系統(tǒng)設(shè)計成不可能犯錯的
（2）使錯誤難以發(fā)生。萬一發(fā)生，系統(tǒng)應(yīng)該幫助用戶找出錯誤并改正它們。
（3）系統(tǒng)應(yīng)該為用戶提供從錯誤中恢復(fù)的方式。最著名的是Undo（重做）。
3. 信息架構(gòu)：著重于設(shè)計組織分類和導(dǎo)航的結(jié)構(gòu)，從而讓用戶可以高效率、有效率地瀏覽網(wǎng)站的內(nèi)容。
（1）信息架構(gòu)要求創(chuàng)建分類體系，該分類體系將會對應(yīng)并符合網(wǎng)站目標、希望滿足用戶需，以及將被合并在網(wǎng)站中的內(nèi)容。創(chuàng)建的方式：
- 從上到下（top-down approach）：從“網(wǎng)站目標與用戶需求的理解”開始直接進行結(jié)構(gòu)設(shè)計，先從最廣泛的滿足決策目標的潛在內(nèi)容與功能開始分類，然后再依據(jù)邏輯細分出次級分類。?局限性：導(dǎo)致內(nèi)容的重要細節(jié)被忽略。
- 從下到上（bottom-up approach）：根據(jù)“內(nèi)容和功能需求的分析”而來，從已有資料開始，把該資料放到最低級別分類中，然后將它們分別歸屬到高一級的類別。局限性：導(dǎo)致架構(gòu)過于精確地反映了現(xiàn)有內(nèi)容，而不能靈活的容納未來內(nèi)容的變化或增加。
一個有效結(jié)構(gòu)的特點，具備“容納成長和適應(yīng)變動”的能力。
（2）信息架構(gòu)的基本單位是節(jié)點（node），可以對應(yīng)任意的信息片段或組合。
節(jié)點的安排方式：
- 層級結(jié)構(gòu)（hierarchical structure）：節(jié)點與其他相關(guān)節(jié)點之間存在父/子級關(guān)系。
- 矩陣結(jié)構(gòu)（matrix structure）：允許用戶在節(jié)點與節(jié)點之間沿著兩個或更多的“維度”移動。
- 自然結(jié)構(gòu)（organic structures）：不會遵循任何一致的模式。
- 線性結(jié)構(gòu)（sequential structures）：連貫的語言流程。
節(jié)點的組織原則（organizing principle）：哪些節(jié)點要編成一組，哪些要保持獨立的標準。一般來說，在網(wǎng)站最高層級使用的組織原則應(yīng)該緊密與“網(wǎng)站目標”和“用戶需求”相關(guān)，而在結(jié)構(gòu)中較低的層級，內(nèi)容與功能需求的考慮將對你所采用的組織原則產(chǎn)生很大影響。
（3）語言與元數(shù)據(jù)：
命名原則（nomenclature）：描述、標簽和網(wǎng)站使用的其他術(shù)語。
要注意“使用用戶的語言”且“保持一致性”，常用來強調(diào)一致性的工具被稱為“控制性詞典”（controlled vocabulary），即網(wǎng)站使用的一套標準語言。還有種方式是創(chuàng)造類詞詞典（thesaurus），即提供常用的、但未納入該網(wǎng)站標準用語的詞匯以供選擇。
使用控制性詞典或類詞詞典對于建立包含有元數(shù)據(jù)（metadata）的系統(tǒng)特別有用。元數(shù)據(jù)簡單的說就是“關(guān)于信息的信息”，以一種結(jié)構(gòu)化的方式來描述內(nèi)容。
好的元數(shù)據(jù)能幫助我們迅速地運用已有的內(nèi)容創(chuàng)造出適應(yīng)用戶需求的一個新部分，還能提供更可靠的搜索結(jié)果。
（4）團隊角色和流程
文檔：
視覺辭典（the Visual Vocabulary）
界面設(shè)計、導(dǎo)航設(shè)計和信息設(shè)計
框架層：什么樣的功能形式來實現(xiàn)，處理更精準的細節(jié)問題。
界面：提供給用戶做某些事情的能力。通過它用戶能真正接觸到那些“在結(jié)構(gòu)層的交互設(shè)計中”確定的“具體功能”。
導(dǎo)航設(shè)計：提供給某個用戶區(qū)某個地方的能力。用戶能通過它在“結(jié)構(gòu)中自由穿行”。
信息設(shè)計：傳達想法，它是這個層面中范圍最廣的一個要素。
1. 界面設(shè)計要尊重習(xí)慣，但非死守。當(dāng)一種不同的方式有很明顯的益處時，應(yīng)試著違背習(xí)慣，但要求在做每一個決定的時候都有充分的明確的理由。
要抵制在網(wǎng)站四周建立起比喻（metaphor）的沖動。比喻往往不能揭示特性的本質(zhì)，反而會混淆。避免比喻，減少對用戶“在理解和使用網(wǎng)站功能”時的心理要求。
2. 成功的界面設(shè)計能讓用戶一眼就看到“最重要的東西”。
（1）程序員要改變思考問題的方式。
好的程序員總要考慮到“邊緣情況”，但界面設(shè)計中，一個設(shè)計良好的界面是要組織好用戶最常采用的行為，同時讓這些界面元素用最容易的方式獲取和使用。
TIPS：第一次呈現(xiàn)給用戶時，考慮每個選項的默認值；能自動記住某個用戶最后一次選擇狀態(tài)的系統(tǒng)。
（2）HTML和FLASH
HTML最初是用于簡單的超級文本信息，后來它的一小部分元素就成為了標準界面元素：
復(fù)選框、單選框、文本框、下拉菜單、多選菜單、按鈕
Flash靈活性更強，界面對用戶的響應(yīng)更積極。
3. 導(dǎo)航設(shè)計
（1）必須同時完成以下3個目標：
- 導(dǎo)航設(shè)計必須提供給用戶一種在網(wǎng)站間跳轉(zhuǎn)的方法，必須選擇能促進用戶行為的。
- 導(dǎo)航設(shè)計必須傳達出這些元素和它們所包含內(nèi)容之間的關(guān)系，對于用戶理解“哪些選擇對他們是有效的”非常必要。
- 導(dǎo)航設(shè)計必須傳達出它的內(nèi)容和用戶當(dāng)前瀏覽頁面之間的關(guān)系，幫助用戶理解“哪個有效的選擇會最好的支持他們的任務(wù)或他們想要達到的目標”。
（2）多重的導(dǎo)航系統(tǒng)（navigation system）
全局導(dǎo)航、局部導(dǎo)航、輔助導(dǎo)航、上下文導(dǎo)航、友好導(dǎo)航、遠程導(dǎo)航
4. 信息設(shè)計：如何呈現(xiàn)這些信息。
指示標識（wayfinding)：導(dǎo)航、顏色、圖標等
線框圖（wireframe）/頁面示意圖：它是整合在結(jié)構(gòu)層的全部三要素的方法。通過安排和選擇界面元素來整合界面設(shè)計；通過識別和定義核心導(dǎo)航系統(tǒng)來整合導(dǎo)航設(shè)計；通過放置和排列信息組成部分的優(yōu)先級來整合信息設(shè)計。線框圖可以確定一個建立在基本概念結(jié)構(gòu)上的架構(gòu)，同時指出了視覺設(shè)計應(yīng)該前進的方向。
作者：王洛堇
文章轉(zhuǎn)自：http://www.wangxuntian.com/
- 目前還沒評論，等你發(fā)揮！
