文章彙整

什麼是Wireframe?

By Astral Web 1 year agoNo Comments
首頁  /  其他  /  專案管理  /  什麼是Wireframe?

wireframe (2)

今天小編要來與大家分享架設網站初期,一個很重要的元素「Wireframe」。

在開始Wireframe之際,須先了解客戶需求,依不同公司不同業務會由該規劃人員來繪製整理來自客戶端蒐集到的資料,如:網站內容頁,客戶的需求概念等,並將蒐集到的資料與團隊進行內部協調溝通,再進行Wireframe的繪製,根據Wireframe同客戶確認各網頁的功能需求 (屬於專案管理IPEMC的Plan階段)。

 

首先,先來介紹什麼是Wireframe(線框圖),它是一個低擬真度來呈現產品設計的表示法,主要功能可

 

  1. 呈現產品頁面的主要資訊
  2. 呈現資訊在頁面上的排版與架構
  3. 視覺化,便於描述使用者如何與產品互動

 

網站架構初期,透過Wireframe先將各網頁進行區塊切割,僅展現出線條、框線與灰白簡圖,無任何顏色與圖片的展示,並於每個區塊中簡述該區塊的功能/內容,如下圖示意。

 

           wireframe (1) wireframe (3)          

         

使用Wireframe的好處

 

由於Wireframe僅展現簡單的線條,可以節省確認設計的時間,先將各頁面的框架與功能確認完畢,剩下要做的就上圖/文字/其他效果的部分。    透過Wireframe,客戶可以更專注於功能面、資訊架構面、使用者體驗、操作流程、使用性及使用者介面討論等,避免視覺上的干擾而混淆了頁面重點功能。

 

現在業界還有一個常見的Wireframe形式,稱為可點擊式線框圖,這是一個互動式的Wireframe,可以透過點擊擬真進行各頁面的操作,如果有興趣的讀者,可以自行參閱相關資料喔!

 

以上,是小編本周為大家帶來Wireframe的簡單介紹,如有需要補充,也歡迎各位讀者不吝指教,謝謝。

 

以上內容由Astralweb 歐斯瑞編寫製作

 000

推薦文章

Category:
  專案管理

留下回應

你的電子郵件地址不會被公開.

取得獨家電子商務祕技

建立更好的策略靈感

跟上全球的網路趨勢

絕佳的電商解決方案

電子商務戰略全指南

每月發送電商戰略指南,只要填寫E-mail即可訂閱!

請到您的信箱確認,即可完成訂閱。