系統公告
搜尋此頻道內容
搜尋:
優使性線上資源
好時光貼曆
我是誰??
Maxxi 當過幾年搖滾客 作過一些聲音創作 搞過幾個小展覽 在歐洲拿了幾張文憑 本來認真想當個快樂的運轉手 卻莫明奇妙的寫了本書進入網路業 本以為只要不搞音樂就不會餓死 卻發現玩網路可能也差不了多少 目前正努力嘗試網路不同的可能性 現職:喬立達數位行銷顧問公司
折價王
熱門關鍵字
記事分類
創用CC授權條款
訪客有誰?
誰來我家
交換連結
交換連結貼紙,請自行取用
想與我交換連結的請留言告訴我^^
RSS 訂閱
RSS2
ATOM
贊助商
其它資訊
本部落所刊登之內容,皆由作者個人所提供,不代表 yam天空部落 本身立場。
POWERED BY
POWERED BY
會員登入免費註冊
July 1, 2005

從事網站建置工作的人想必一定對Wireframe(以下簡稱WF) 這個字不陌生。 

WF簡單來說就是網站頁面的藍圖,主要的功能IA是讓用來(資訊架構分析人員,時常會是網站必須企劃兼任的角色) 與網站置作團隊的其它成員溝通想法的工具。

WF的表現形式有很多種,可以精細也作出與真實頁面相近的WF,也可以用很簡略方式表達頁面中應具備的元素,對麥斯而言,WF是一種溝通的工具,因此最重要的是能夠讓看WF的人了解你的想法,要用那種形式來表現,應該視當時的需要,以及合作的對象。

下面是兩個WF的例子,上面的較為簡略,而下面的則是較為精細的形式的wf:

麥斯有時會被要求製作一些十分接近真實頁面的WF,精細形式的WF表面上看來似乎會讓工作流程變得順利,但實際上,在看不到的地方卻有許多潛在的危機。

 

l          首先,WF是用來溝通IA的工具,但一個擬真的WF常會讓討論的焦點轉移到頁面的視覺設計,然而那是創意人員的工作而不是IA人員的專業。因此,當一份擬真的WF出現後,常會出現兩種情形:

1.          創意人員覺得WF 阻礙了他們發揮的空間。

2.          上面那點是對比較勤勞的人來說,至於比較懶的,就會直接把這個WF加上圖片顏色做出網頁。

l            再者,也許因為擬真的WF容易讓非專業的人也看懂網頁設計,因此這樣的wf常被拿去與客戶溝通,這樣的作法也許對能讓客戶看到一些實質的產出,因而簽下合約,但卻是非常不正確的作法。

1.          讓客戶看到擬真的WF會讓他對頁面中會出現什麼產生不當的期待。我們知道WF只是頁面的IA架構,最後完成的網站通常會與wf有許多不同之處,如果客戶在一開始就看到擬真的WF,而之後完成的網站卻與他心中的期待不同時,客戶常會認為一開始所看到的wf是一個不實廣告,這樣一來會為自已製造許多不必要的麻煩。

2.          如果客戶太早看到擬真的WF,那麼他的會將焦點放在介面視覺設計上,這時從客戶口中聽到的就會是:我要這個在這裡,這個頁面中應該有這個功能,還有,某個圖應該要出現在頁面上。

但是,在未進入實際的制做前,我們所應該了解的是到底有那些資訊是重要的? 這些資訊之間又有那些關係?  通常客戶對這方面的想法會是散亂的,IA人員需要有些技巧才能讓了解客戶真正的想法,然而過早秀出擬真的WF只會讓客戶的想法失焦,這樣一來我們就更無法得到設計IA時所需要的資訊。

Dan Brown (http://www.boxesandarrows.com/archives/where_the_wireframes_are_special_deliverable_3.php) 提出了一個用Description Diagram 來代替WF的溝通方式,這種方式感覺上似乎更能讓創意與客戶focusIA的設計上進行討論。

 與其用WF來與創意及客戶討論網站的資訊架構,Dan Brown則改用以內容描述為主的Description Diagram,這種方式是將網站可能會有的內容以文字描述的方式,依重要性不同列在一份文件上來進行討論,這樣一來,文件中少了視覺的要素,因此討論的內容就可以專注在IA議題上,較可能針對內容類形與重要性與客戶進行討論。

如下圖 ,我們可以先將網站可能會有的內容先列在一份文件,這些內容依重要性的不同由右向左排列,然後以這份文件作為與客戶溝通內容層級的工具。

 

Dan Brown在其文章中只談到這兩個例子麥斯認為如果能先以這樣的Description Diagram來溝通想法,那麼IA人員接下來,只需將網站中會出現的各個分頁標定出來,然後將每一頁中將出現的內容以描述的方式說明,剩下的就可以讓創意自由發揮了。 

 網站的建構通常需要的是team work,而這種team就像是一個Jazz Band,其中每個人都有不同的專長,要讓team的效能發揮到淋漓盡致,就要讓不同才能的人都能在自已的領域盡情的發揮,彼此之間能夠多一點互補,少一點干擾,而以Description Diagram進行溝通最大的好處正在於此。  

再進一步,可以依內容的不同放入一些初步的功能設計,這些功能設計在視覺上都以灰階的方式呈現,如此一來,對創意人員而言,既能達到溝通內容的目的,又能保有很大的創意空間。 

 

 

 

 

 


引用 (你可以針對此文寫一篇屬於自己的blog/想法,並給作者一個通告)
引用
相關閱讀
留言 (1筆)
1.
想請問一下要畫這種圖要使用什麼樣的軟體呢?
 
板主回覆:
過去一般都會用微軟的visio來製作,但是這幾年我已經改用AXURE這個軟體來產出文件了。
你可以參考一下這篇 http://blog.yam.com/usabilitymax/article/20262071
jing 於 2009-04-07 13:32:15 留言 |
發表你的留言 (字數限制 最多 2000 個中文字)
私密留言:
Name:






內容: