中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

對于大部分缺乏經(jīng)驗的初級交互設計師而言，拿到需求文檔以后，很容易按照固有的僵化思維，著手最容易感知的部分而忽略主次，未經(jīng)思考就直接畫線框圖，然后隨意添加無邏輯關聯(lián)的交互動畫，試圖用繁雜手法遮掩空虛的內(nèi)涵。其實這時最該做的是從用戶角度考量信息架構，構建良好的用戶體驗。如果作為設計師忽略掉這些細枝末節(jié)，那么產(chǎn)品的用戶體驗可想而知。

在這里，筆者希望各位同行都明確一個觀點：在這個動不動就用AI說事的時代，可量化的工作總有一天被人工智能代替，淪為“線框仔”的交互設計師，終將被行業(yè)淘汰。

所以拿到需求之后，針對需求搭建思維框架，遠遠勝于上手畫原型圖。原型圖只是思維的展現(xiàn)方式，只要能將思維明確地表現(xiàn)出來，甚至可以用手繪代替。在日常工作中，思考和原型圖的精力分配大致是7:3，而杰出的設計師，這個比例甚至可以達到8:2。

如果我們將產(chǎn)品設計中各個環(huán)節(jié)按照權重大小進行排列的話，那么從大到小可以排列為：信息架構設計、功能結構設計、交互設計、視覺設計。所以這一章需要解決的恰恰是如何設計信息架構，而不是上手線框圖。

一、用戶體驗五要素

在開始了解信息架構前，先來回顧一個大名鼎鼎的模型吧——用戶體驗五要素。

筆者更喜歡將其稱為產(chǎn)品設計五要素，這是因為它不僅讓我們對產(chǎn)品有了初步的整體認識，在后續(xù)工作中還能對細節(jié)進行分解。在交互設計師的眼中，也許最先看到、優(yōu)先著力的是局部設計，比如結構層和框架層。

當你既能把握好整體布局，又能優(yōu)化局部體驗時，設計作品可以將點、線、面連成一體由零到整再化整為零，那么你才是一位可以從用戶體驗的角度掌控產(chǎn)品的優(yōu)秀交互設計師。

二、信息來源

既然是信息架構設計，巧婦難為無米之炊，那么米（信息）是從哪里來呢？

1.戰(zhàn)略層-產(chǎn)品信息的方向

筆者戲稱這一層稱為“老板層”，因為通常這一層的決策者是老板，而非產(chǎn)品經(jīng)理，于是會出現(xiàn)以下趣味場景：（以筆者所在的互聯(lián)網(wǎng)金融行業(yè)為例）老板突發(fā)奇想、大手一揮決定公司未來要賣基金，產(chǎn)品經(jīng)理有了新的工作內(nèi)容——做基金產(chǎn)品。這時候，產(chǎn)品經(jīng)理開始琢磨了，老板想要的到底是個啥？我需要得到老板準確的需求呀！所以一個合格的產(chǎn)品經(jīng)理，要從老板嘴里套出兩個基本要素：

1. 用戶能從這個產(chǎn)品獲得什么？
2. 公司能從這個產(chǎn)品獲得什么？

這里需要插一句，當時的背景是這樣的：公司的理財產(chǎn)品缺少債權，大量用戶無法將手中的錢進行投資、也無法獲得收益，因此產(chǎn)品的用戶流失率很高。

如果公司新上線的基金產(chǎn)品運作得當?shù)脑?，用戶不但可以減小資金站崗風險，還能獲取適當收益。同時，對于公司而言，產(chǎn)品線擴展，豐富業(yè)務領域，可拉攏用戶投資獲得利潤，還增加了公司在行業(yè)的影響力，差異化的服務使公司在行業(yè)競爭中更具優(yōu)勢。

明確了這兩個問題，也就完成了戰(zhàn)略層的最基本任務。所有產(chǎn)品的出發(fā)點都須基于這兩點：即用戶痛點和解決方案，二者的契合度高低決定產(chǎn)品是否成功。

2.范圍層-產(chǎn)品信息的產(chǎn)生

有了產(chǎn)品方向，接下來就會涉及到這個產(chǎn)品會完成什么功能，提供什么信息，所以我們將范圍層比作兩個筐：一個功能筐，另一個是信息筐。二者之間互相交叉，并沒有明顯的界線。

（1）功能筐

筆者將功能筐分為兩部分，常規(guī)功能，如注冊和登錄等，和體驗友好型功能，比如篩選、排序。需要強調(diào)的一點，產(chǎn)品經(jīng)理的需求文檔可能不會關注到體驗友好型功能，很多情況下是交互設計師通過競品分析、用戶調(diào)研、甚至是場景腦補出來的。

（2）信息筐

信息筐則來自于三部分：

• 首先，從功能來的信息，比如登錄會涉及手機號和密碼等信息。
• 其次，本身存在的信息，例如幫助信息。
• 以及體驗友好型信息，同樣是來自于交互設計師的設計。

拿筆者做的基金產(chǎn)品舉例，功能筐包括下載、注冊等功能。信息筐包含基金名稱、基金代碼、凈值，漲跌幅等一系列繁多且無序的信息，如下圖。此時就需要設計一種結構讓信息元更易查看、且更高效有序。

既然是信息架構信息架構設計主要研究“信息的呈現(xiàn)”，即用戶認知信息。不同的信息組合和選擇，對應不同的理解成本。如何讓展現(xiàn)給用戶的信息更加合理且有意義，就是信息架構的意義。同時信息架構的設計還會向下呼應戰(zhàn)略層的策略：

1. 滿足用戶需求。讓用戶可以在一定的“信息規(guī)劃”下更易找到想要的“東西”。
2. 滿足產(chǎn)品目標。通過“信息架構設計”教育、說服、通知用戶使用產(chǎn)品，以到達盈利的目標。

3.信息架構設計流程

有了米之后，那煮飯的完整流程是什么呢？擁有完整信息元后，主要分為信息處理和信息檢索兩個部分。具體步驟是決定信息元之間的關系分類（組織系統(tǒng)），制定合理的類別標簽（標簽系統(tǒng)）。

通過邏輯順序組合成有意義的路徑（導航系統(tǒng)），最后給核心信息設計快捷查找的方式（搜索系統(tǒng)）。

三、組織系統(tǒng)（Organization Systems）

組織系統(tǒng)是信息架構的核心，尋找信息元之間的關聯(lián)，并進行分類。分類涉及到分類依據(jù)、分類方式、分類結果。

1.分類依據(jù)

組織體系（Organization Schemes）即分類的依據(jù)，分為精確性組織體系（Exact Organization Schemes）和模糊性組織體系（Ambiguous Organization Schemes）。具體的分類依據(jù)有很多，比如地理位置、時間是精確性組織體系，主題、用戶群、任務是模糊性組織體系。

在基金項目中是操作和按照主題分類的，細化為登錄注冊、基金主題、個人信息主題、安全主題等等。

2.分類方式

分類的方式又叫組織方式，共分為三種。

（1）自下而上（Top-Down）

通常應用于ToC類的產(chǎn)品。在實際的設計中，可以采用卡片分類法（Card Sorting），即將所有的信息元用一張張卡片寫下來，讓“目標用戶”參與到信息分類中并且給出分類的依據(jù)，以此作為產(chǎn)品設計師梳理信息架構時的參考。

基金項目的主組織方式就是采用的自下而上，如下圖，將所有的信息元按照組織體系分類后，會形成很多父類節(jié)點，父類節(jié)點間也存在著某種關聯(lián)，進而形成新的父類節(jié)點。依此類推，最終會匯集到頂級節(jié)點，即戰(zhàn)略層的決策。

（2）自上而下（Bottom-Up）

通常應用于ToB的產(chǎn)品。最先從最廣泛的、可能滿足決策目標的內(nèi)容與功能開始進行分類，然后在按邏輯細分出次級分類，這樣的“主要分類”和“次級分類”就構成了“一個個空槽”，再設想各種內(nèi)容和功能按順序一一填入。

自上而下組織后的層級多是從戰(zhàn)略層出發(fā)，與戰(zhàn)略目標緊密相連，與目標用戶看著并不那么關聯(lián)緊密，所以很多To B產(chǎn)品都需要向用戶宣導。而自下而上恰恰相反，先有基于用戶需求的內(nèi)容和功能，再逐層往上分類組織，所以To C產(chǎn)品通常學習成本更低。

（3）超文本（Hypertext）

超文本是一種非線性的方式，通常不作為一種主組織方式，只作為彌補自下而上和自上而下兩種方式不足的一種輔助方式，用來建立非同類或非同級信息元之間的關聯(lián)，為組織結構的多樣性創(chuàng)造可能，并提供更高的靈活性。

基金項目中對于綁卡、實名等操作都采用了超文本的組織方式，比如添加超文本方式后的組織系統(tǒng)。

添加超文本方式后的組織系統(tǒng)

3.分類結果

采用一種或多種分類方式，會輸出對應的分類結果，包括以下幾種類型：

（1）層級結構（Hierarchical Structure）

這種結構是最常用的結構，幾乎所有產(chǎn)品的主結構都是層級結構。層級結構可以視作是一種父子級關系，一個父級可以有幾個子級，子級還有它的子級，直至包含了所有信息。而構成層級結構的方式也就是從上而下和從下而上為主。

基金項目的主結構很顯然就是層級結構。

（2）自然結構（Organic Structures）

得益于超文本方式，很多信息元可以從多個路徑獲得，所以自然結構沒有太強烈的分類概念。

其通常被應用于探索行為，比如訪問視頻A和C后，系統(tǒng)都同樣推薦了視頻B，那么對于視頻B，就會有至少兩種探索路徑：一種來自視頻A，一種來自視頻C。

很顯然，自然結構不適合作為主組織結構。如果任何信息元都以探索的方式獲得，那么對于任務型用戶來說，查詢的成本會大大增加，相應的用戶體驗也會很差，所以自然結構多作為輔助結構出現(xiàn)。

從組織系統(tǒng)看，基金項目還有部分采用自然結構，比如實名的路徑就有兩種。

（3）矩形結構（Matrix Structures）

矩形結構同樣來自于超文本方式，它的信息元的來源路徑有多種。但是與自然結構不同的是，矩形結構更具規(guī)律，每一條來源路徑有固定的操作，而非自然結構那樣不可控。

有個經(jīng)典的例子，如果某些用戶想通過顏色來找到某個產(chǎn)品，而另一些用戶希望通過尺寸搜尋，若使用矩陣結構就可以同時兼容這兩種不同的用戶需求。

（4）線性結構（Sequential Structures）

線性結構非常好理解，平時我們看的h5頁面基本上都是線性結構，用戶不能進行跳轉，只能一步一步按順序找到所要的信息元。

基金項目中，評測部分采用的就是線性結構，用戶需要一步一步完成評測，無法跳轉。

四、標簽系統(tǒng)（Labeling Systems）

確立了組織系統(tǒng)，父類節(jié)點又該如何命名？怎樣按照用戶容易接受的方式命名？這就是接下來標簽系統(tǒng)要解決的問題。

互聯(lián)網(wǎng)經(jīng)過幾十年發(fā)展，很多標簽已經(jīng)形成固定模板，比如“首頁”、“搜索”、“登錄”、“注冊”、“關于我們”等等，這些都成為了用戶心理模型的一部分，按照慣例命名是標簽系統(tǒng)的首要原則。

除此之外，為了確保標簽能夠更具表達力，在設計標簽的時候，需要注意以下幾點：

1.盡量使用用戶語言

非用戶語言通常會出現(xiàn)在一些專業(yè)性很強的產(chǎn)品上。筆者所做的基金類產(chǎn)品中有很多專業(yè)術語，對于非專業(yè)人士來說很難理解，所以在設計標簽系統(tǒng)的時候，盡量使用用戶易理解的表述。

當遇到無法替代的專業(yè)詞匯時，比如認購和申購，那就需要做好注釋，不能讓用戶因為標簽的問題而茫然。

2.保持一致性

標簽的一致性代表著可預測性。對于同樣的標簽，用戶會產(chǎn)生相同的認知，用戶學習成本大大降低的同時，也能快速理解其背后對應的操作或信息。

五、導航系統(tǒng)（Navigation Systems）

在信息架構的概念里，導航就像大海里的燈塔，可以照亮來時的路，也可以指引前往的方向，所以導航系統(tǒng)是指從頂端節(jié)點到某個信息的路徑。

需要注意的是結構層的導航系統(tǒng)和框架層的導航設計不完全相同：結構層導航系統(tǒng)還局限在組織結構的層面；而框架層導航設計是可視化設計，即界面設計，主要表現(xiàn)為標簽和頁面的跳轉。結構層導航系統(tǒng)可以視為框架層導航設計的跳轉路徑；但在框架層的導航設計時，仍然會根據(jù)實際頁面情況反向優(yōu)化結構層導航系統(tǒng)。

結合框架層的導航設計，可以將導航系統(tǒng)分為兩部分：

1.嵌入式導航系統(tǒng)

包括全站、區(qū)域和情景式導航：

• 全站導航：即無論用戶走到哪里都可以看到的導航標簽，也是最高級父類節(jié)是查看所有信息的路徑起點。
• 區(qū)域導航：是用戶在某次級父類節(jié)點下瀏覽的子類導航，其影響的只是該次級父類節(jié)點一下的信查看路徑。
• 情景式導航：即超文本的鏈接，是嵌入在信息元的導航。

在基金項目中，設計師運用了這幾種導航，使得整個產(chǎn)品的靈活性更高。每一個頂層的父類都可以作為全站導航的一個標簽，分別跳轉進入父類的子類信息。在個人信息的部分，需要設計一個區(qū)域導航，將總資產(chǎn)、已買基金、交易明細和個人信息設置分別作為導航標簽放置在個人信息中。

2.輔助性導航系統(tǒng)

包括網(wǎng)站地圖、索引、指南：

• 網(wǎng)站地圖：通常包含最高級父類節(jié)點和頂端的幾層次級父類節(jié)點，提供更寬廣的感知視角。
• 網(wǎng)站索引：索引就像用戶直接在信息筐里檢索，跳過組織結構的概念，全部是平鋪的信息元，用戶通過信息元的關鍵詞檢索信息。
• 網(wǎng)站指南：通常是為新用戶介紹信息和功能的工具，包括演示、教程等等，總之都是為用戶提供一種瀏覽的路徑。

六、搜索系統(tǒng)（Search Systems）

筆者始終認為，假設導航系統(tǒng)足夠強大，用戶通過導航指示的路徑可以找到任何需要的信息，那么搜索將毫無意義，然而現(xiàn)實中這種情況是極理想化的。所以與導航系統(tǒng)一樣，搜索系統(tǒng)也是尋找信息的一種方式。

對于搜索系統(tǒng)，需要強調(diào)兩點：

1.是否真的需要搜索系統(tǒng)？

可以基于兩點去判斷是否需要設置搜索系統(tǒng)：

1. 當信息的分類非常多、或某幾類信息的信息員過多時，可以考慮設計搜索系統(tǒng)，幫助用戶快速找到相應的信息。
2. 如果組織結構比較深的時候，為了減少用戶的操作負擔，也可以設置搜索系統(tǒng)，以便用戶快速找到信息。

2.搜索的內(nèi)容是什么？

搜索的內(nèi)容應該是核心信息，是產(chǎn)品主要想表達的信息，也是用戶經(jīng)常查看的信息。

在基金項目中，由于涉及到數(shù)百只基金，所以將基金名稱和基金代碼作為搜索內(nèi)容，用戶可以直接通過搜索系統(tǒng)直達基金信息。

在了解信息架構的四大組件后，我們發(fā)現(xiàn)可以將其分為兩部分：

• 一部分是信息本身的處理，即將信息本身按照某種方式組織結構，然后給各節(jié)點命名；
• 另一部分是對信息的檢索，用戶通過導航或搜索可以找到信息元。

顯然最核心的部分是組織結構，其優(yōu)劣會影響標簽是否易理解，以及導航路徑是否簡短高效，以及檢索的效率。因此在設計信息架構的時候，要將關注度更多放在組織系統(tǒng)。

同時在設計組織系統(tǒng)的時候，要考慮實際使用場景，不同場景下用戶的需求不同，對應的解決方案自然也有所區(qū)別，比如一個瀏覽型的用戶，使用自然結構很合理，但如果是任務型用戶，就要嘗試層級結構。除此之外，在設計信息架構的時候還需要遵循以下幾點原則：

1. 與“產(chǎn)品目標”和“用戶需求”相對應；
2. 具有一定的延展性，添加信息元盡量不破壞原有的組織結構；
3. 保證分類依據(jù)的一致性、相關性和獨立性，避免信息元分類模糊；
4. 有效平衡信息架構的“廣度”和“深度”，避免寬而淺和窄而深的組織結構；
5. 使用“用戶語言”，同時避免“語義歧義或不解”。

七、產(chǎn)出信息架構圖

在設計信息架構的同時，我們會發(fā)現(xiàn)有些組件會和用戶直接交互，比如搜索系統(tǒng)，而一些組件則躲在幕后，例如組織系統(tǒng)，用戶可能無法感知其存在。所以對于那些無法感知的部分，我們需要將通過可視化的方式表現(xiàn)出來，給框架層的界面設計做鋪墊。

在設計組織結構時，我們已經(jīng)有了一個層級結構圖，而信息架構圖就是以此作為基礎。從頂級節(jié)點到每一個信息元的路徑即為導航路徑，最上層的父級節(jié)點可以作為導航標簽的參考，同時在圖中標出可應用于搜索的信息元，如圖6.6。

此時最基本的信息結構圖就完成了，在接下來框架層設計時，頁面實際情況可能會反向影響結構層，所以信息架構圖會有一定程度的迭代優(yōu)化，最終可以產(chǎn)出基于頁面的信息架構圖。

本文由 @芥子未末 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉載。

題圖來自 pexels，基于CC0協(xié)議