線框圖

出自 MBA智库百科(https://wiki.mbalib.com/)

　　線框圖是指軟體或者網站設計過程中非常重要的一個環節。

　　線框圖是整合在結構層的全部三種要素的方法：通過安排和選擇界面元素來整合界面設計；通過識別和定義核心導航系統來整合導航設計；通過放置和排列信息組成部分的優先順序來整合信息設計。通過把這三者放到一個文檔中，線框圖可以確定一個建立在基本概念結構上的架構，同時指出了視覺設計應該前進的方向。

　　線框圖在正式建立網站的視覺設計的流程中，是必要的第一步，但是幾乎每一個參與這個開發過程的人都會在一些任務點中使用它。負責戰略層、範圍層和結構層的設計者可以藉助線框圖來保證最終產品能滿足他們的期望。真正負責建設這個網站的人，則使用線框圖來回答關於網站應該如何運作的問題。隨著用戶體驗領域的不斷成熟和發展，線框圖的責任有時還成為企業內部某種口水戰的主題。一些網站研發團隊很鮮明地把這部分工作分成兩個部分，由兩個獨立的角色（有時候是整個部門）“信息架構師”和“設計師”來承擔。

　　線框圖就像是設計圖框架與承載，它代表最終產品最核心的部分。在保真度與速度之間，線框圖可以保持一個很微妙的平衡，雖然繪圖時不用最求細節的完美，但必須表達出設計思想，完整的表達其中所有重要的部分。線框圖不僅僅是無意義的線和框的集合；好吧，雖然看上去是的，囧。你可以把線框圖理解為設計圖的骨幹與核心，它承載著最終產品所有重要的部分。線框圖可以幫你平衡保真度與速度。繪圖時不用在意細枝末節，但必須表達出設計思想，不能漏掉任何重要的部分。就像給項目以及一起協作的團隊成員（開發工程師、視覺設計師、文案作者和項目經理），開闢了一條輔助理解設計的通道。說得再明白點，你是在設計城市地圖，地圖上能展現出每一條街道，只不過繪製上做了簡化。看地圖能看出城市的框架，但無法一覽城市的美感。

　　線框圖常常用來作項目說明。鑒於其靜態設計，一次只能通過一張界面演示交互，因此，務必附上說明。（只要有必要，簡短描述或附在複雜的技術文檔里，都成），也因為繪製起來快速、簡單，它也經常用於非正式場合，比如團隊內部交流。要是開發問起一個東西怎麼做，回覆時不妨附上一張迅速繪製的線框圖。線框圖難以充當用戶測試的材料；倒也能收集些反饋，如果你更關心用戶意見，而非測試方法。

　　線框圖是原型圖的一種：可以把原型圖想象成一個大類，他下麵按照階段或者精細程度可分為：

1. 草圖或者手稿：一般指前期具有了一個大致的想法，為了記錄，快速的從紙上或者小黑板上勾勒出來的。
2. 線框圖：開始考慮大致的佈局以及元素定義了。一般只用黑白灰的面、線、字表示，可用axure或者其他設計軟體完成。大部分的產品到這一步就可以了，直接交給設計師去完成界面設計。
3. 高保真原型：完成效果跟真實的產品基本無異，而且還帶有動態交互效果的。一般由UI設計師或者交互設計師完成。

　　從功能上來說，原型代表了最終產品，常用於潛在用戶測試；線框圖常用於項目初期，展示佈局和功能，用於討論和反饋。

　　原型可以線上框圖的基礎上進行設細化和設計。原型常用於做潛在用戶測試。在正式介入開發階段前，以最接近最終產品的形式考量產品可用性。