熱評(píng) 肆柒

這一篇真的要多看幾次

本文從信息架構(gòu)的定義、構(gòu)建方式、構(gòu)成、影響因素、設(shè)計(jì)原則6個(gè)方面,幫你完整吃透信息架構(gòu)的知識(shí)體系。

更多信息架構(gòu)設(shè)計(jì)干貨:

前言

第一次認(rèn)識(shí)「信息架構(gòu)」,還是剛?cè)胄械臅r(shí)候。當(dāng)時(shí)做 B 端產(chǎn)品,經(jīng)常會(huì)研究產(chǎn)品的信息架構(gòu),利用思維導(dǎo)圖工具輸出一份關(guān)于功能的結(jié)構(gòu)圖。

萬(wàn)字干貨!一篇文章吃透產(chǎn)品信息架構(gòu)完整知識(shí)體系

當(dāng)時(shí)信息架構(gòu)主要應(yīng)用在兩個(gè)方面:

① 競(jìng)品分析

信息架構(gòu)基本是競(jìng)品分析的必備環(huán)節(jié)。主要是將競(jìng)品產(chǎn)品功能(側(cè)重導(dǎo)航系統(tǒng)),采用腦圖的形式羅列出來(lái)(顆粒度有時(shí)粗有時(shí)細(xì)),勾畫(huà)出產(chǎn)品的功能體系,展示出信息組織結(jié)構(gòu)。根據(jù)前輩的經(jīng)驗(yàn),將架構(gòu)大致會(huì)分為「寬而淺」和「窄而深」兩種形式進(jìn)行一通分析,得出一個(gè)比較主觀的結(jié)論。

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

在實(shí)際的設(shè)計(jì)應(yīng)用時(shí),信息架構(gòu)更偏向于導(dǎo)航菜單的組織結(jié)構(gòu)。設(shè)計(jì)師需要將產(chǎn)品功能清單進(jìn)行結(jié)構(gòu)化梳理,曾經(jīng)嘗試過(guò)卡片分類法等,搭建起整個(gè)產(chǎn)品的導(dǎo)航菜單結(jié)構(gòu),并對(duì)菜單命名做出一定的優(yōu)化建議。

總體來(lái)說(shuō),對(duì)信息架構(gòu)的理解還是比較淺薄的。

今天我們來(lái)系統(tǒng)地了解下信息架構(gòu)的知識(shí)。

萬(wàn)字干貨!一篇文章吃透產(chǎn)品信息架構(gòu)完整知識(shí)體系

一、信息架構(gòu)的定義

信息架構(gòu)(information architecture,縮寫(xiě)為 IA)是指對(duì)某一特定內(nèi)容里的信息進(jìn)行統(tǒng)籌、規(guī)劃、設(shè)計(jì)、安排等一系列有機(jī)處理的想法。

IA 的主體對(duì)象是信息,由信息架構(gòu)師來(lái)加以設(shè)計(jì)結(jié)構(gòu)、決定組織方式以及歸類,好讓使用者與用戶容易尋找與管理的一項(xiàng)藝術(shù)與科學(xué)?!俣劝倏?/p>

定義都是概括性極強(qiáng)的,讀起來(lái)會(huì)比較晦澀難懂。但是我們可以從中獲得一些關(guān)鍵信息。

1. 對(duì)于產(chǎn)品

信息架構(gòu)是產(chǎn)品信息的組織、歸類方式。需要能夠真實(shí)地反映出產(chǎn)品的核心價(jià)值、展現(xiàn)出主線功能、特色功能,提升用戶對(duì)產(chǎn)品的認(rèn)知。

2. 對(duì)于用戶

信息架構(gòu)要方便用戶理解,并能夠幫助用戶順利地找到對(duì)應(yīng)的功能完成操作。在信息架構(gòu)設(shè)計(jì)時(shí),要充分考慮用戶的理解能力、操作習(xí)慣、目標(biāo)內(nèi)容使用頻率等因素,符合用戶認(rèn)知從而提升用戶體驗(yàn)。

二、信息架構(gòu)與交互設(shè)計(jì)

在用戶體驗(yàn) 5 要素中,信息架構(gòu)歸屬于結(jié)構(gòu)層,主要是面向信息型產(chǎn)品。功能型產(chǎn)品的結(jié)構(gòu)層主要指的是交互設(shè)計(jì)。

交互設(shè)計(jì)和信息架構(gòu)都強(qiáng)調(diào)?個(gè)重點(diǎn):確定各個(gè)將要呈現(xiàn)給?戶的元素的“模式(patterns)”和“順序(sequences)”。交互設(shè)計(jì)關(guān)注于將影響?戶執(zhí)?和完成任務(wù)的元素。信息架構(gòu)則關(guān)注如何將信息表達(dá)給?戶的元素?!队脩趔w驗(yàn)要素:以用戶為中心的產(chǎn)品設(shè)計(jì)》

萬(wàn)字干貨!一篇文章吃透產(chǎn)品信息架構(gòu)完整知識(shí)體系

兩種產(chǎn)品類型為什么會(huì)有交互設(shè)計(jì)和信息架構(gòu)的區(qū)分呢?說(shuō)一下我個(gè)人理解。

1. 信息型產(chǎn)品

信息型產(chǎn)品就是我們常見(jiàn)的各類網(wǎng)站,例如門(mén)戶網(wǎng)站、品牌官網(wǎng)、知乎、今日頭條、或者騰訊視頻等內(nèi)容類產(chǎn)品。這些產(chǎn)品主要是為用戶提供各類信息,任務(wù)類操作比較少。

網(wǎng)站最終的任務(wù)是給予用戶足夠可用、有效的信息,確保用戶在產(chǎn)品中不會(huì)迷失或者無(wú)法找相應(yīng)的信息入口,所以結(jié)構(gòu)層的主要任務(wù)是構(gòu)建符合用戶認(rèn)知的信息架構(gòu),便于在框架層以此架構(gòu)為基礎(chǔ)完成界面、導(dǎo)航設(shè)計(jì)。

2. 功能型產(chǎn)品

功能型產(chǎn)品更多的是中后臺(tái)管理系統(tǒng),目的是幫助特定的用戶完成各種任務(wù),包含了各種流程。在產(chǎn)品中用戶會(huì)有大量的操作,功能之間可能互為前置條件或者相互協(xié)同。

例如用戶在商品加購(gòu)之前,需要完成登錄?;蛘吖芾韱T在增加用戶之前,需要提前設(shè)定系統(tǒng)用戶角色。所以對(duì)于功能型產(chǎn)品,除了確定信息架構(gòu),還要明確好功能之間的交互邏輯關(guān)系。

我認(rèn)為在結(jié)構(gòu)層中,交互設(shè)計(jì)和信息架構(gòu)并不是絕對(duì)割裂的,功能型產(chǎn)品同樣需要制定信息架構(gòu),只不過(guò)信息架構(gòu)相對(duì)固定,需要遵從用戶的業(yè)務(wù)場(chǎng)景、工作流程等,設(shè)計(jì)師不能根據(jù)自己的理解隨意更改。

另外隨著業(yè)務(wù)場(chǎng)景和功能的發(fā)展迭代,有些產(chǎn)品已經(jīng)不能通過(guò)簡(jiǎn)單信息型產(chǎn)品或者功能型產(chǎn)品進(jìn)行劃分。例如電商網(wǎng)站,既要提供商品信息供用戶選購(gòu),還要提供購(gòu)物車(chē)、下單、支付、物流、售后等一系列的環(huán)節(jié),每個(gè)環(huán)節(jié)之間都是環(huán)環(huán)相扣。因此,在結(jié)構(gòu)層需要信息架構(gòu)和交互設(shè)計(jì)并重。

三、信息架構(gòu)的構(gòu)建方式

信息架構(gòu)最核心的是確定產(chǎn)品信息的組織形式,我們可以采用以下兩種?式來(lái)建?分類體系:「自上而下」或「自下而上」。

萬(wàn)字干貨!一篇文章吃透產(chǎn)品信息架構(gòu)完整知識(shí)體系

1. 自上而下

這種分類方法從“戰(zhàn)略層”(產(chǎn)品目標(biāo))出發(fā)去考慮內(nèi)容分類。即根據(jù)產(chǎn)品目標(biāo)與用戶需求直接進(jìn)行結(jié)?構(gòu)設(shè)計(jì)。最先從最廣泛的、可能滿足決策目標(biāo)的內(nèi)容與功能開(kāi)始進(jìn)行分類,然后在按邏輯細(xì)分出次級(jí)分類,這樣的“主要分類”和“次級(jí)分類”就構(gòu)成了“一個(gè)個(gè)空槽”,將想要的內(nèi)容和功能按順序一一填入即可。

萬(wàn)字干貨!一篇文章吃透產(chǎn)品信息架構(gòu)完整知識(shí)體系

我理解這樣的方式是從產(chǎn)品視角出發(fā),根據(jù)功能清單,結(jié)合用戶場(chǎng)景,逐級(jí)建立起信息分類形成產(chǎn)品的信息架構(gòu),最后將功能/內(nèi)容放入到信息架構(gòu)中。

這種方法比較適合 B 端產(chǎn)品,產(chǎn)品功能和用戶業(yè)務(wù)場(chǎng)景比較明確,并且是緊密結(jié)合在一起的。比如財(cái)務(wù)報(bào)銷(xiāo)需要包括提單、審批、支付、消息、記錄等等環(huán)節(jié)。信息架構(gòu)也要按照這些場(chǎng)景和流程進(jìn)行歸類,便于用戶理解和找尋。

此外對(duì)于 C 端產(chǎn)品,某些用戶需求和場(chǎng)景并是不特別明確,需要產(chǎn)品主動(dòng)構(gòu)建信息架構(gòu)引導(dǎo)用戶需求,此時(shí)也需要自上而下建立信息架構(gòu)。例如電商產(chǎn)品中引入短視頻,首頁(yè)的訂閱方式等,短視頻產(chǎn)品中的同城、興趣等功能。這些是基于用戶洞察,產(chǎn)品自上而下推進(jìn)信息結(jié)構(gòu)的優(yōu)化升級(jí)。

2. 自下而上

這種分類方法是根據(jù)對(duì)“內(nèi)容和功能需求的分析”?來(lái)的。先從已有的資料(或者當(dāng)?站發(fā)布后將存在的資料)開(kāi)始,我們把這些資料統(tǒng)統(tǒng)放到最低級(jí)別的分類中,然后再將它們分別歸屬到較??級(jí)的類別,從?逐漸構(gòu)建出能反映我們的產(chǎn)品?標(biāo)和?戶需求的結(jié)構(gòu)。

萬(wàn)字干貨!一篇文章吃透產(chǎn)品信息架構(gòu)完整知識(shí)體系

當(dāng)產(chǎn)品已經(jīng)擁有了內(nèi)容,但是并不明確如何進(jìn)行歸類,才符合用戶的認(rèn)知和需求。這是就可以采用自下而上的方法倒推,建立信息架構(gòu)。對(duì)于信息量不大的產(chǎn)品,可以做幾版方案,找些用戶進(jìn)行測(cè)試就可以得出結(jié)論。對(duì)于信息量會(huì)比較大的產(chǎn)品,可以采用卡片分類法,讓用戶參與其中,為信息架構(gòu)設(shè)計(jì)提供參考依據(jù)。

我個(gè)人認(rèn)為,在實(shí)際的應(yīng)用中自上而下的創(chuàng)建方式居多,這種方式從產(chǎn)品和用戶兩個(gè)維度出發(fā),可以搭建出比較平衡的一套信息架構(gòu)。

四、信息架構(gòu)的構(gòu)成

在《信息架構(gòu)——超越Web設(shè)計(jì)》一書(shū)中,將信息架構(gòu)定義為:

  • 共享信息環(huán)境的結(jié)構(gòu)化設(shè)計(jì);
  • 數(shù)字、物理和跨渠道生態(tài)系統(tǒng)中的組織、標(biāo)簽、搜索和導(dǎo)航系統(tǒng)的合成;
  • 創(chuàng)建信息產(chǎn)品和體驗(yàn)的藝術(shù)及科學(xué),以提供可用性、可尋性和可理解性;
  • 一種新興的實(shí)踐性科學(xué)群體,目的是把設(shè)計(jì)和建筑學(xué)的原理理導(dǎo)?入數(shù)字領(lǐng)域中。

——《信息架構(gòu)——超越Web設(shè)計(jì)》

這就意味著信息架構(gòu)不僅僅是我們看到的導(dǎo)航菜單,只不過(guò)由于導(dǎo)航菜單是信息架構(gòu)的直觀表現(xiàn)形式,所以常常被理解為“信息架構(gòu)就是導(dǎo)航菜單”。

信息架構(gòu)包含了 4 大系統(tǒng):組織系統(tǒng)、標(biāo)簽系統(tǒng)、導(dǎo)航系統(tǒng)、搜索系統(tǒng)。

萬(wàn)字干貨!一篇文章吃透產(chǎn)品信息架構(gòu)完整知識(shí)體系

1. 組織系統(tǒng)

組織系統(tǒng)是信息架構(gòu)的根基,決定了信息架構(gòu)的基礎(chǔ)邏輯,可以拆解為組織方案與組織結(jié)構(gòu)兩個(gè)模塊。

① 組織方案

組織方案就是產(chǎn)品信息的分類邏輯,需要根據(jù)用戶、場(chǎng)景和業(yè)務(wù)邏輯進(jìn)行組織和定義,在產(chǎn)品中信息的歸屬有不同維度和標(biāo)準(zhǔn),大致可分為精確信息和模糊信息 2 類。

有些信息可以按照精確的維度進(jìn)行劃分。例如首字母、時(shí)間、行政區(qū)、組織結(jié)構(gòu)、文件類型等。精準(zhǔn)的信息組織方式可以保證將信息分成定義明確且互斥的區(qū)域,容易設(shè)計(jì)與維護(hù)。

萬(wàn)字干貨!一篇文章吃透產(chǎn)品信息架構(gòu)完整知識(shí)體系

但是一些信息缺少明確的劃分標(biāo)準(zhǔn),屬于模糊信息。例如網(wǎng)站欄目的劃分、電影的分類等,更多的是按照業(yè)務(wù)和用戶認(rèn)知習(xí)慣確定組織形式。

常見(jiàn)的模糊組織方案主要有以下幾種方式:

主題組織方案

當(dāng)我們無(wú)法按照精確分類時(shí),可以按照用戶場(chǎng)景、業(yè)務(wù)邏輯歸納為符合用戶認(rèn)知的主題(頻道),搭建信息架構(gòu)的基礎(chǔ)分類。例如品牌官網(wǎng)的信息歸類方式。

萬(wàn)字干貨!一篇文章吃透產(chǎn)品信息架構(gòu)完整知識(shí)體系

任務(wù)導(dǎo)向方案

任務(wù)導(dǎo)向的組織方案通常用在對(duì)操作要求較高的工具型產(chǎn)品中,信息架構(gòu)的基礎(chǔ)分類是各種功能的集合。例如 WPS 工具欄就是按照任務(wù)導(dǎo)向分類的。

萬(wàn)字干貨!一篇文章吃透產(chǎn)品信息架構(gòu)完整知識(shí)體系

特定受眾方案

特定受眾的組織方案即根據(jù)不同類型的訪問(wèn)者呈現(xiàn)不同類型的信息。以受眾為導(dǎo)向的信息組織方案會(huì)把網(wǎng)站切分成更小、以受眾為主的小型網(wǎng)站,可以在網(wǎng)頁(yè)上呈現(xiàn)特定用戶感興趣的內(nèi)容,避免網(wǎng)頁(yè)的雜亂。

例如 Boss 直聘中用戶可以擁有“牛人”和“Boss”兩種角色身份,信息內(nèi)容、組織形式有著明顯的差別。

萬(wàn)字干貨!一篇文章吃透產(chǎn)品信息架構(gòu)完整知識(shí)體系

另外隨著老齡化人口比重越來(lái)越大,無(wú)障礙設(shè)計(jì)成為了產(chǎn)品設(shè)計(jì)的重要組成部分。無(wú)障礙設(shè)計(jì)并不僅僅是將字體變大,在產(chǎn)品內(nèi)容、信息結(jié)構(gòu)上也會(huì)有一定的優(yōu)化調(diào)整,內(nèi)容更加精簡(jiǎn)、聚焦于產(chǎn)品核心功能。

萬(wàn)字干貨!一篇文章吃透產(chǎn)品信息架構(gòu)完整知識(shí)體系

總的來(lái)說(shuō),特定受眾方案應(yīng)用還是比較少的。有的 C 端產(chǎn)品會(huì)根據(jù)用戶角色劃分為多個(gè)產(chǎn)品,例如滴滴出行有乘客端和司機(jī)端兩款產(chǎn)品。

而在 B 端產(chǎn)品中,角色劃分通常比較多,并且不同的角色間有著比較強(qiáng)的業(yè)務(wù)關(guān)聯(lián)。因此用戶會(huì)共用一個(gè)產(chǎn)品,通過(guò)角色權(quán)限區(qū)分不同的信息架構(gòu)。

混合方案

在一款產(chǎn)品中,單一的分類模式很難滿足所有場(chǎng)景的需要,信息架構(gòu)應(yīng)該根據(jù)實(shí)際情況,靈活地采用多種方式混合分類。

萬(wàn)字干貨!一篇文章吃透產(chǎn)品信息架構(gòu)完整知識(shí)體系

② 組織結(jié)構(gòu)

組織結(jié)構(gòu)指的信息架構(gòu)內(nèi)在的邏輯結(jié)構(gòu),分為以下四種組織方式:

萬(wàn)字干貨!一篇文章吃透產(chǎn)品信息架構(gòu)完整知識(shí)體系

層級(jí)結(jié)構(gòu)

在層級(jí)結(jié)構(gòu)中,節(jié)點(diǎn)與其他相關(guān)節(jié)點(diǎn)之間存在父級(jí)/子級(jí)的關(guān)系。子節(jié)點(diǎn)代表著更狹義的概念,從屬于代表著更廣義類別的父節(jié)點(diǎn)。不是每個(gè)節(jié)點(diǎn)都有子節(jié)點(diǎn),但是每個(gè)節(jié)點(diǎn)都有一個(gè)父節(jié)點(diǎn),一直往上直到整個(gè)結(jié)構(gòu)的父節(jié)點(diǎn)。

萬(wàn)字干貨!一篇文章吃透產(chǎn)品信息架構(gòu)完整知識(shí)體系

層級(jí)結(jié)構(gòu)是信息架構(gòu)中最常見(jiàn)的形式,信息多級(jí)逐層展開(kāi)。因此具有很強(qiáng)的拓展性和包容性,可以承載復(fù)雜的信息量。并且節(jié)點(diǎn)之間是相互獨(dú)立的,內(nèi)容的歸屬比較明確,構(gòu)建的單個(gè)信息空間也比較清晰簡(jiǎn)潔。

層級(jí)結(jié)構(gòu)會(huì)存在廣度和深度的問(wèn)題。在信息總量一定的情況下,可以分為「寬而淺」和「窄而深」2 種不同的形式。

「寬而淺」的結(jié)構(gòu)意味著父節(jié)點(diǎn)越多,子節(jié)點(diǎn)層級(jí)就會(huì)變少。「窄而深」的結(jié)構(gòu)意味著父節(jié)點(diǎn)比較少,子節(jié)點(diǎn)的層級(jí)就會(huì)變多。

萬(wàn)字干貨!一篇文章吃透產(chǎn)品信息架構(gòu)完整知識(shí)體系

信息架構(gòu)增加廣度,意味著信息的入口增多,用戶不太容易辨別目標(biāo)點(diǎn)的歸屬,就會(huì)增加尋找和記憶成本。最上層的信息入口,我們一般會(huì)遵循 7±2 原則,Web 端產(chǎn)品控制在 7 個(gè)以內(nèi),移動(dòng)端產(chǎn)品控制在 5 個(gè)以內(nèi)。

子節(jié)點(diǎn)層級(jí)一般為 3 層,最多不超過(guò) 5 層。過(guò)深的層級(jí)會(huì)造成信息難以查找,同時(shí)用戶到達(dá)目標(biāo)點(diǎn)的路徑會(huì)變長(zhǎng),操作成本也會(huì)相應(yīng)的增加。

矩陣結(jié)構(gòu)

矩陣結(jié)構(gòu)允許用戶在節(jié)點(diǎn)與節(jié)點(diǎn)之間沿著兩個(gè)或更多的“維度”移動(dòng)。由于每一個(gè)用戶的需求都可以和矩陣中的一個(gè)“軸”聯(lián)系在一起,因此矩陣結(jié)構(gòu)通常能幫助那些“帶著不同需求而來(lái)”的用戶,使他們能在相同內(nèi)容中尋找各自想要的東西。

萬(wàn)字干貨!一篇文章吃透產(chǎn)品信息架構(gòu)完整知識(shí)體系

矩陣式結(jié)構(gòu)是一種多維度結(jié)構(gòu),可以讓用戶在相同的內(nèi)容中按照個(gè)人需求找尋自己所需的信息,最典型的就是產(chǎn)品首頁(yè)信息。作為產(chǎn)品內(nèi)容聚合、分發(fā)的頁(yè)面,可以滿足用戶的不同需求。目前不少 C 端產(chǎn)品都采用的是「主題+推薦」的模式,通過(guò)算法實(shí)現(xiàn)產(chǎn)品內(nèi)容與用戶需求的高度匹配。

萬(wàn)字干貨!一篇文章吃透產(chǎn)品信息架構(gòu)完整知識(shí)體系

B 端首頁(yè)則是依靠「角色+場(chǎng)景」構(gòu)建起產(chǎn)品的矩陣結(jié)構(gòu),實(shí)現(xiàn)功能的快捷直達(dá),以及重要信息的清晰展示。

萬(wàn)字干貨!一篇文章吃透產(chǎn)品信息架構(gòu)完整知識(shí)體系

另外矩陣式結(jié)構(gòu)還體現(xiàn)在鏈路關(guān)系上,沒(méi)有層級(jí)和中心的概念,更加強(qiáng)調(diào)信息之間的互聯(lián)互通。通過(guò)這種連接關(guān)系甚至可以將跨領(lǐng)域、跨層級(jí)的信息關(guān)聯(lián)起來(lái)。

比較典型的就是電商 App,通過(guò)商品詳情頁(yè)可以到達(dá)店鋪、到達(dá)同類推薦產(chǎn)品、到達(dá)客服、到達(dá)購(gòu)物車(chē)、到達(dá)活動(dòng)頁(yè)面,甚至是搭配商品等等。這種結(jié)構(gòu)具有很強(qiáng)的自由度和靈活性,既可以避免用戶行為進(jìn)入「死胡同」,又可以通過(guò)多重的信息連接,豐富產(chǎn)品的運(yùn)營(yíng)場(chǎng)景,帶給用戶更多的可能。

當(dāng)然這種結(jié)構(gòu)的前提是信息必須是關(guān)系緊密的功能場(chǎng)景,否則信息會(huì)出現(xiàn)錯(cuò)亂,并增加用戶的認(rèn)知負(fù)擔(dān)。

自然結(jié)構(gòu)

自然結(jié)構(gòu)不會(huì)遵循任何一致的模式。節(jié)點(diǎn)是逐一被連接起來(lái)的,同時(shí)這種結(jié)構(gòu)沒(méi)有太強(qiáng)烈的分類概念。自然結(jié)構(gòu)對(duì)于探索一系列關(guān)系不明確或一直在演變的主題是很合適的。但是自然結(jié)構(gòu)沒(méi)有給用戶提供一個(gè)清晰的指示,從而讓用戶能感覺(jué)他們?cè)诮Y(jié)構(gòu)中的哪個(gè)部分。

萬(wàn)字干貨!一篇文章吃透產(chǎn)品信息架構(gòu)完整知識(shí)體系

自然結(jié)構(gòu)具有隨機(jī)性和不確定性,隨著算法的提升,這種結(jié)構(gòu)應(yīng)用越來(lái)越廣泛。最常見(jiàn)的就是各種推薦信息流,電商平臺(tái)、音視頻、資訊平臺(tái)等產(chǎn)品都主打推薦頻道,透過(guò)投喂的方式,吸引沒(méi)有明確需求的用戶,給他們更多的選擇。

不過(guò)自然結(jié)構(gòu)的隨機(jī)性意味著用戶無(wú)法建立固定的信息架構(gòu)認(rèn)知,所以自然結(jié)構(gòu)不會(huì)單獨(dú)存在,只是對(duì)信息架構(gòu)的補(bǔ)充。另外在 B 端產(chǎn)品中,用戶通常具有明確的任務(wù)和目標(biāo),所以自然結(jié)構(gòu)并不適用于 B 端產(chǎn)品。

線性結(jié)構(gòu)

線性結(jié)構(gòu)來(lái)自于你最熟悉的線下媒體。連貫的語(yǔ)言流程是最基本的信息結(jié)構(gòu)類型,而且處理它的裝置早已被深深地植入我們的大腦中了。書(shū)、文章、音像和錄像全部都被設(shè)計(jì)成一種線性的體驗(yàn)。

萬(wàn)字干貨!一篇文章吃透產(chǎn)品信息架構(gòu)完整知識(shí)體系

線性結(jié)構(gòu)是比較單一的信息結(jié)構(gòu),信息有先后順序要求,逐層向下遞進(jìn),并且沒(méi)有交叉。這種組織形式?jīng)Q定了線形結(jié)構(gòu)主要用在簡(jiǎn)單產(chǎn)品或者產(chǎn)品信息構(gòu)架的末端場(chǎng)景中。

例如在微信讀書(shū)中,打開(kāi)書(shū)籍后用戶只能一頁(yè)頁(yè)翻看,不會(huì)與其他書(shū)籍有交叉關(guān)聯(lián)。在 OA,電子郵箱等產(chǎn)品中,每一個(gè)流程,每一封郵件都是線性的、相互獨(dú)立的,信息之間不會(huì)增加不必要的關(guān)聯(lián)。

2. 標(biāo)簽系統(tǒng)

標(biāo)簽系統(tǒng)指的是整個(gè)產(chǎn)品信息節(jié)點(diǎn)的命名體系,靜態(tài)展示產(chǎn)品信息架構(gòu)的具體內(nèi)容,包含文字和圖片(圖標(biāo))2 種信息。標(biāo)簽系統(tǒng)需要符合用戶的認(rèn)知習(xí)慣,減少用戶的學(xué)習(xí)成本。在日常設(shè)計(jì)工作中,標(biāo)簽系統(tǒng)需要注意以下 3 個(gè)方面:

① 標(biāo)簽內(nèi)容的準(zhǔn)確性

標(biāo)簽定義時(shí),需要準(zhǔn)確地表達(dá)信息的內(nèi)容項(xiàng)。舉兩個(gè)例子:

在 C 端領(lǐng)域?yàn)榱颂岣哂脩舻狞c(diǎn)擊率,經(jīng)常會(huì)遇到一些信息融合累加的設(shè)計(jì)形式。例如宣傳用語(yǔ)是“立享 300 元福利”,用戶點(diǎn)開(kāi)一看,或許只是 10 張優(yōu)惠券。這種設(shè)計(jì)利用了用戶“貪便宜”的心理,已經(jīng)成為了行業(yè)約定俗成的表達(dá)形式,倒也可以接受。

不過(guò)之前有個(gè)營(yíng)銷(xiāo)彈窗的案例,用戶點(diǎn)擊后跳轉(zhuǎn)到活動(dòng)頁(yè)面,然后逐個(gè)領(lǐng)券。彈窗中按鈕有兩種方案,A 方案是“開(kāi)心收下”,B 方案是“立即領(lǐng)取”。

萬(wàn)字干貨!一篇文章吃透產(chǎn)品信息架構(gòu)完整知識(shí)體系

雖然后臺(tái)有歷史數(shù)據(jù)顯示,“開(kāi)心收下”的文案用戶點(diǎn)擊率比較高,并不意味著這個(gè)文案可以用在所有場(chǎng)景下。“開(kāi)心收下”意味著完成領(lǐng)取并入賬,“立即領(lǐng)取”則是需要繼續(xù)操作才能完成領(lǐng)取,兩者適用于不同的場(chǎng)景。

標(biāo)簽系統(tǒng)首先要考慮表達(dá)的準(zhǔn)確性,要符合用戶的心智模型以及所代表的行為模式。

② 優(yōu)先選用行業(yè)通用的術(shù)語(yǔ)或圖標(biāo)

尼爾森十大可用性原則中要求「貼近用戶真實(shí)環(huán)境」。在標(biāo)簽定義的時(shí)候,盡量使用目標(biāo)用戶的語(yǔ)言。尤其在 B 端產(chǎn)品中,不少名詞對(duì)設(shè)計(jì)師而言比較陌生。但是對(duì)專業(yè)領(lǐng)域的用戶,這些都是日常工作術(shù)語(yǔ),早已達(dá)成了共識(shí)。如果做出改變,反而會(huì)增加用戶認(rèn)知成本。

所以設(shè)計(jì)師要克服自己的認(rèn)知缺陷。一方面要了解業(yè)務(wù)、通過(guò)用戶調(diào)研,建立更符合用戶認(rèn)知的標(biāo)簽系統(tǒng),另一方面也可以參考競(jìng)品來(lái)學(xué)習(xí)和應(yīng)用信息標(biāo)簽。

為了保證新、老用戶的快速了解系統(tǒng),最大程度地降低學(xué)習(xí)成本,可以在標(biāo)簽旁邊添加注釋進(jìn)一步說(shuō)明。例如英文縮寫(xiě)術(shù)語(yǔ)、容易引起歧義的指標(biāo)、不易理解的標(biāo)簽等等。

對(duì)于圖標(biāo),有些是各個(gè)產(chǎn)品通用的形式,用戶很容理解。例如「設(shè)置」、「刪除」、「幫助」等。還有相當(dāng)大一部分圖標(biāo)很難準(zhǔn)確表達(dá)出內(nèi)在信息,就需要增加文字信息,輔助信息表達(dá)。

③ 標(biāo)簽信息簡(jiǎn)潔高效

標(biāo)簽系統(tǒng)既要完整表達(dá)信息,也要注意信息的簡(jiǎn)潔高效。

例如下圖中菜單命名,大量重復(fù)的信息增加了信息識(shí)別的難度,并且名稱字?jǐn)?shù)沒(méi)有控制導(dǎo)致內(nèi)容截?cái)啵矔?huì)增加用戶的操作成本。

萬(wàn)字干貨!一篇文章吃透產(chǎn)品信息架構(gòu)完整知識(shí)體系

3. 導(dǎo)航系統(tǒng)

導(dǎo)航系統(tǒng)是信息架構(gòu)的動(dòng)態(tài)交互邏輯。一方面能夠告訴用戶當(dāng)前所處于的位置,頁(yè)面信息的層級(jí)歸屬,讓用戶不會(huì)在產(chǎn)品中迷失方向。另一方面導(dǎo)航系統(tǒng)實(shí)現(xiàn)了信息的動(dòng)態(tài)聯(lián)接,用戶可以依靠導(dǎo)航系統(tǒng)在不同的層級(jí)結(jié)構(gòu)中「閃轉(zhuǎn)騰挪」,高效操作。

導(dǎo)航系統(tǒng)分為 4 大類:全局導(dǎo)航、局部導(dǎo)航、情景式導(dǎo)航、輔助導(dǎo)航。

萬(wàn)字干貨!一篇文章吃透產(chǎn)品信息架構(gòu)完整知識(shí)體系

① 全局導(dǎo)航

全局導(dǎo)航是面向整個(gè)產(chǎn)品的導(dǎo)航形式,通常位于系統(tǒng)的整體框架中,實(shí)現(xiàn)在所有頁(yè)面中可見(jiàn)、可操作。所以全局導(dǎo)航也只是對(duì)產(chǎn)品的核心、關(guān)鍵功能和部分即時(shí)功能開(kāi)放。

例如信息框架中的一、二級(jí)的信息,或者消息、用戶管理這類即時(shí)、強(qiáng)管理的內(nèi)容。

② 局部導(dǎo)航

局部導(dǎo)航是全局導(dǎo)航的補(bǔ)充,對(duì)于復(fù)雜的產(chǎn)品,局部導(dǎo)航非常有必要,避免全局導(dǎo)航變得臃腫復(fù)雜,有利于信息逐級(jí)有序地展開(kāi)。

③ 情景式導(dǎo)航

情景式導(dǎo)航又稱為上下文導(dǎo)航,指的是根據(jù)當(dāng)前場(chǎng)景或者內(nèi)容產(chǎn)生的信息鏈接關(guān)系。例如文章內(nèi)的超鏈接,或者是標(biāo)題信息等,點(diǎn)擊可以跳轉(zhuǎn)新的網(wǎng)頁(yè)、下載文件或指定某個(gè)對(duì)象等。情景導(dǎo)航中可以承載產(chǎn)品外部的內(nèi)容鏈接,不必完全是本產(chǎn)品中的內(nèi)容。

④ 輔助導(dǎo)航

輔助導(dǎo)航包括網(wǎng)站地圖,網(wǎng)站索引,網(wǎng)站指南等輔助類型的導(dǎo)航。

4. 搜索系統(tǒng)

搜索系統(tǒng)解決的是大容量、高密度信息的定位問(wèn)題。大到全產(chǎn)品范圍內(nèi)的搜索,小到當(dāng)前列表搜索,基本成了產(chǎn)品中的必備功能。即使有些產(chǎn)品中搜索功能,用戶的使用頻率不高,也是需要配備的,方便用戶的不時(shí)之需。

「搜索」系統(tǒng)對(duì)外呈現(xiàn)或許是一個(gè)帶著圖標(biāo)的輸入框,甚至只是一個(gè)圖標(biāo)。但是操作則是一個(gè)多種狀態(tài)的融合的交互過(guò)程,包括了輸入前、輸入中、搜索結(jié)果展示等內(nèi)容。系統(tǒng)比較復(fù)雜,大家可以去找一些專門(mén)的文章學(xué)習(xí),也可以看一下我之前的文章:

小結(jié)

以上就是信息架構(gòu)的 4 大組成系統(tǒng)。信息架構(gòu)的最終目標(biāo)是為了讓用戶能夠更快速地獲取信息。在實(shí)際應(yīng)用過(guò)程中,可以根據(jù)產(chǎn)品類型,用戶群體做出內(nèi)容取舍。

值得注意的是,信息架構(gòu)最重要的標(biāo)準(zhǔn),不是“整個(gè)過(guò)程一共需要多少步驟”,而是“用戶是否認(rèn)為每一個(gè)步驟都是合理的”,以及“當(dāng)前的步驟是否自然地延續(xù)了上一個(gè)步驟中的任務(wù)”。

五、信息架構(gòu)的影響因素

信息架構(gòu)是為產(chǎn)品和用戶服務(wù)的,因此信息架構(gòu)的影響因素主要是來(lái)自于這兩個(gè)方面。

1. 產(chǎn)品視角

① 產(chǎn)品目標(biāo)及定位

同類型產(chǎn)品的目標(biāo)、定位、用戶群體并不是完全相同的,在各自的細(xì)分領(lǐng)域形成了各自的差異化優(yōu)勢(shì)。這些都會(huì)直接和間接地影響產(chǎn)品的信息架構(gòu)。

例如國(guó)內(nèi) 3 大電商平臺(tái)的主導(dǎo)航基本一致,但也不是完全相同,大家可以體會(huì)和思考下其中的差別。

萬(wàn)字干貨!一篇文章吃透產(chǎn)品信息架構(gòu)完整知識(shí)體系

② 產(chǎn)品類型

上面不少案例提及了 B 端和 C 端產(chǎn)品,由于產(chǎn)品類型、適配終端、產(chǎn)品目標(biāo)等方面的影響,信息架構(gòu)有著比較明顯的差異。同樣都是 C 端產(chǎn)品,購(gòu)物類產(chǎn)品重搜索與推薦,金融證券類產(chǎn)品則是重功能導(dǎo)向,界面看似一致的,但是信息架構(gòu)中組織系統(tǒng)、搜索系統(tǒng)背后的邏輯也存在較大差異。

萬(wàn)字干貨!一篇文章吃透產(chǎn)品信息架構(gòu)完整知識(shí)體系

③ 產(chǎn)品復(fù)雜度

簡(jiǎn)單產(chǎn)品的信息架構(gòu)也會(huì)比較簡(jiǎn)單,或許線性的組織結(jié)構(gòu)就可以搭建起核心業(yè)務(wù)的信息架構(gòu),例如 QQ 郵箱。

復(fù)雜產(chǎn)品的信息架構(gòu)會(huì)運(yùn)用多種組織結(jié)構(gòu)方式,相關(guān)的標(biāo)簽系統(tǒng)、導(dǎo)航系統(tǒng)、搜索系統(tǒng)都會(huì)加強(qiáng)。例如云類產(chǎn)品的標(biāo)簽系統(tǒng),既要考慮整體的一致性,又要明確各個(gè)產(chǎn)品間的差別。搜索功能也不僅限于產(chǎn)品功能,還會(huì)拓展到活動(dòng)優(yōu)惠、幫助文檔等內(nèi)容,讓用戶搜索得更徹底。

萬(wàn)字干貨!一篇文章吃透產(chǎn)品信息架構(gòu)完整知識(shí)體系

2. 用戶視角

① 用戶需求

產(chǎn)品不能一味的只考慮自己的產(chǎn)品目標(biāo),還要考慮用戶的接受程度。就好比舞臺(tái)上高雅的古典歌劇,只顧展示自己的專業(yè)能力,而底下觀眾根本聽(tīng)不懂唱的內(nèi)容,必然無(wú)法引起觀眾興趣。

如果不重視用戶需求,產(chǎn)品設(shè)計(jì)時(shí),只顧著各種高級(jí)能力輸出、各種復(fù)雜的產(chǎn)品流程,但是從沒(méi)有考慮用戶是否需要這樣的產(chǎn)品,帶來(lái)的結(jié)果就是信息架構(gòu)的無(wú)序擴(kuò)張、內(nèi)容龐雜、過(guò)程混亂,最終成為產(chǎn)品體系的「自嗨」。

② 用戶認(rèn)知能力

不同的用戶之間認(rèn)知能力有很大的差別,需要面向目標(biāo)客戶群體完成信息架構(gòu)。

例如之前做過(guò)門(mén)店后臺(tái)管理系統(tǒng)改版設(shè)計(jì),通過(guò)前期調(diào)研發(fā)現(xiàn),店員們年齡偏大、學(xué)歷不高,老版本的信息架構(gòu)雖然足夠的大而全,但是核心功能并不凸顯,用戶操作流程也被拉長(zhǎng)。因此在改版設(shè)計(jì)時(shí),信息架構(gòu)做了精簡(jiǎn),優(yōu)先聚焦打造用戶核心任務(wù),減少信息的復(fù)雜度。

六、信息架構(gòu)的設(shè)計(jì)原則

將信息架構(gòu)抽離出來(lái),其實(shí)包括了組織體系、展示形式和操作體驗(yàn) 3 個(gè)環(huán)節(jié)。相應(yīng)的也會(huì)有 3 個(gè)設(shè)計(jì)原則。

1. 延展性

產(chǎn)品是不斷成長(zhǎng)迭代的,信息架構(gòu)需要具有兼容性和彈性,可以適應(yīng)多個(gè)層級(jí)的擴(kuò)展或精簡(jiǎn),保證一定迭代周期內(nèi)的架構(gòu)穩(wěn)定。頻繁變動(dòng)的信息架構(gòu)必然會(huì)帶來(lái)產(chǎn)品的研發(fā)成本提高,并且增加用戶的學(xué)習(xí)成本。

2. 易學(xué)性

信息架構(gòu)需要有一套準(zhǔn)確的分類標(biāo)準(zhǔn),能夠指導(dǎo)后續(xù)架構(gòu)的優(yōu)化迭代,也可以便于用戶理解和學(xué)習(xí)。細(xì)分下來(lái)包含了邏輯性和一致性兩個(gè)方面。邏輯性則體現(xiàn)在信息之間的關(guān)聯(lián)關(guān)系,實(shí)現(xiàn)用戶鏈路的準(zhǔn)確、高效。一致性體現(xiàn)在分類方式、分類結(jié)構(gòu)等方面,便于用戶認(rèn)知。

3. 易用性

上文提到過(guò),信息架構(gòu)的的廣度和深度在一定程度上決定了操作體驗(yàn)。設(shè)計(jì)時(shí)要做好信息架構(gòu)的平衡性,避免只是從業(yè)務(wù)角度出發(fā),出現(xiàn)十幾個(gè)一級(jí)導(dǎo)航菜單并存的局面。

寫(xiě)在最后

信息架構(gòu)是個(gè)復(fù)雜的系統(tǒng),并不是設(shè)計(jì)師個(gè)人的工作,也不應(yīng)該從零開(kāi)始構(gòu)建。而是在產(chǎn)品功能架構(gòu)或者產(chǎn)品規(guī)格清單基礎(chǔ)上,從用戶需求和場(chǎng)景出發(fā),梳理出來(lái)的符合用戶體驗(yàn)邏輯的產(chǎn)品骨架。

信息架構(gòu)直接決定了后續(xù)產(chǎn)品設(shè)計(jì)的組織脈絡(luò),因此準(zhǔn)確有效的信息架構(gòu)是產(chǎn)品戰(zhàn)略落地過(guò)程中重要的一環(huán)。設(shè)計(jì)師需要擁有相關(guān)的知識(shí)和能力,才能在設(shè)計(jì)工作中產(chǎn)出合理的設(shè)計(jì)方案。

信息架構(gòu)內(nèi)容很多,文章是筆者個(gè)人的觀點(diǎn),難免存在不足之處,歡迎大家交流指正。

歡迎關(guān)注作者微信公眾號(hào):「子牧UXD」

萬(wàn)字干貨!一篇文章吃透產(chǎn)品信息架構(gòu)完整知識(shí)體系

收藏 114
點(diǎn)贊 54

復(fù)制本文鏈接 文章為作者獨(dú)立觀點(diǎn)不代表優(yōu)設(shè)網(wǎng)立場(chǎng),未經(jīng)允許不得轉(zhuǎn)載。