在互聯網行業中,架構圖作為一種重要的工具,用於可視化展示軟體、系統、應用程式等的體系結構及其組成部分之間的關係。常用的架構圖種類有:業務架構圖、應用架構圖、系統架構圖、技術架構圖、部署架構圖、資料架構圖、產品架構圖、功能架構圖、資訊架構圖等。
信息結構圖就是將業務中的對象按照一定的方式梳理而成的結構化信息圖譜,是幫助我們定義和組織如何在產品中展示信息的工具。信息架構圖的設計旨在滿足用戶需求和產品目標,通過合理的信息組織和表達,使用戶更容易獲取和理解信息。
信息架構的核心是探討用戶對信息的認知過程,對於產品設計而言,信息架構關注的是“呈現給用戶合理且有價值的信息”。
信息架構圖通常由信息架構師和交互設計師共同設計,他們需要深入理解用戶需求、業務目標和技術平台,以確保信息架構圖能夠有效地支持用戶的信息檢索和導航需求。
信息架構圖一般以思維導圖繪製居多,繪製方法和步驟也比較簡單,本頁面重點介紹流程圖繪製信息架構圖。
支援多人線上同屏創作,可設置分享連結,即時傳遞資訊
只需輸入一句話,自動生成所需圖形,並自動美化圖形風格
內建多種主題風格,也可自由設計喜愛的樣式
支援插入圖示、圖片、標籤、備註LaTex公式、程式碼塊、連結、附件等多種形式元件
支援匯出PNG、VISIO、PDF、SVG等格式,支援匯入VISIO、Mermaid格式
檔案即時儲存,多端裝置雲同步,歷史版本可追溯,資料安全有保障
在互聯網行業中,架構圖作為一種重要的工具,用於可視化展示軟體、系統、應用程式等的體系結構及其組成部分之間的關係。常用的架構圖種類有:業務架構圖、應用架構圖、系統架構圖、技術架構圖、部署架構圖、資料架構圖、產品架構圖、功能架構圖、資訊架構圖等。
對應性:產品目標與用戶需求相對應。
功能的相似性:通過分類把相似性質的功能放在一起,以大類為基礎作為產品的主框架,以小類作為子框架進行補充就形成了整個產品框架。
功能和功能之間的關係:包含關係--功能之間存在上下游依賴的關係,可以縱向進行的資訊架構;並列關係--兩個功能之間沒有關聯,可以考慮橫向資訊架構。
功能的使用頻率:使用的頻率越高,說明這個功能越重要,越要把這個功能放在最容易觸及的地方,優先考慮圍繞核心功能進行設計架構。
系統的擴展性:產品從0到1,從1到N,產品功能也是不斷增加完善的,這就要求在做資訊架構時,要做好擴展的準備,考慮之後的擴展性。
資訊架構圖的重點是梳理具體頁面及頁面的欄位資訊,具體到界面時,頁面之間的關聯需要清晰的呈現出來,這個階段也是為繪製原型、資訊排版佈局打基礎。互動設計師在輸出互動稿之前,需要提前繪製資訊架構圖。
層級結構:又叫樹狀結構或中心輻射結構,層級結構的節點與其他相關節點之間存在父子關係,每一個節點都有父節點,但不一定有子節點,最頂層的父節點被稱之為根節點。
矩陣結構:矩陣結構允許用戶沿著兩個或多個維度在節點之間移動,最終都可以幫助用戶找到想要的資訊。
自然結構:自然結構不遵循任何一致的模式,節點被逐一連接起來,節點與節點之間有聯繫,但沒有分類。
線性結構:在線性結構中,用戶不能進行跳轉,只能一步一步按順序瀏覽對應的資訊 。
自上而下:自上而下的構建方式是由戰略層驅動,根據產品目標與用戶需求直接進行結構設計,進行新產品規劃或者產品重新定義的時候用到。
自下而上:自下而上的構建方式是由範圍層驅動,根據對現有的內容和功能需求的分析進行設計,這是專案實踐中大家最常用的一種方式。
綜合運用:自上而下和自下而上兩種構建方式都有明顯的缺點,所以理想的資訊架構的構建方式都是綜合運用的,同時從戰略層和範圍層進行驅動,以構建一個適應性強的系統。
網站設計:展示網站內容的組織方式,幫助用戶和設計師理解網站結構。
軟體和資料庫:組織和展示軟體功能模組或資料庫記錄,提高可用性和可尋性。
資訊系統:規劃和設計大型資訊系統的導航結構和資訊流。
功能架構圖表示需要哪些功能,就像是汽車發動機,需要有哪些零件,每一個功能就是每一個零件。
信息架構是零件組裝的一個指導,就類似於發動機的組裝指導手冊。
產品結構圖囊括了產品的功能與信息,同時也可以在圖中示意功能之間的邏輯跳轉關係。可以簡單用一個公式表達:產品結構圖=產品功能結構圖+產品信息架構圖。
1,競品分析時需要通過繪製信息架構圖快速了解競品的功能模塊和介面設計結構。
2,從0到1打造一款產品時,明確的信息架構脈絡是必要的前提條件。
3,接手某款產品的日常迭代工作時,首先應該清楚所做的業務和功能點在產品架構中的位置及重要程度。
1,按照總分結構確定關鍵的壹級節點
2,先繪製單個壹級節點模塊的信息架構圖,之後再逐個完善
3,若某個頁面在不同的壹級節點內出現,要明確標識
信息架構圖內容較多,一般包括:內容結構(信息分類、標籤、主題)、頁面結構(頁面或介面節點)、層級關係(壹級、二級、三級信息)、導航關係(頁面之間的跳轉和路徑)、用戶角色與訪問入口(可選)等。
產品經理、信息架構師、交互設計師、前端工程師都需要參考,是連接業務邏輯和介面設計的核心產出物之一。
不包含。信息架構圖是結構圖,不涉及視覺、交互細節,UI 設計圖則在其基礎上細化介面樣式。
信息架構圖先確定頁面與內容結構,然後基於此繪製線框圖(佈局草圖),最終製作原型圖(含交互流)。