|
關(guān)于原型，有太多故事了。說(shuō)起快速的原型制作（區(qū)別于軟件工程的快速原型法），應(yīng)該以文本文檔/富文本文檔（如Word）為主。因?yàn)椋装�、草圖雖然快但不易保存，HTML雖然豐富但制作慢，一些原型工具，如Axure，則效率也低，使用也復(fù)雜。
最初設(shè)計(jì)的時(shí)候，我是以Word為主的，就是打表格（順帶一句，白鴉是PPT，便于演示和簡(jiǎn)單的效果）。Word 畫表格十分方便，而且在溝通中也比較高效（批注）。漸漸的也有了一些習(xí)慣（很山寨）。
布局
打表格（要用繪制功能）。默認(rèn)的 A4 頁(yè)面瀏覽基本足夠。有時(shí)在處理 100% 表格時(shí)，會(huì)用 Web 版式，但用 Web 版式閱讀時(shí)總覺(jué)得不那么自然，比較少用。
表格也常用于模擬真實(shí)的數(shù)據(jù)表格（應(yīng)用上各種樣式）。
常用的：?jiǎn)卧窬又校ㄋ胶痛怪保�、單元格背景色（突出重點(diǎn)）。
文字內(nèi)容
直接打字，針對(duì)鏈接，用藍(lán)色（#00F）加下劃線，基本實(shí)現(xiàn)。字的大小，用小五表示12px，用10表示13px，用五號(hào)（默認(rèn)）表示14px。字體根據(jù)具體情況，一般通用 Arial。加粗就是 Ctrl+B。
常用的：對(duì)齊、加粗、字號(hào)、顏色和下劃線、Tab和中文空格（用來(lái)占位，和初步排版）。
圖片內(nèi)容
一般結(jié)合單元格居中，寫上圖片的內(nèi)容作為占位。表示這里放個(gè)圖片。有時(shí)候也會(huì)結(jié)合截圖軟件，截圖軟件的好處是可以保存到剪貼板，然后再 Ctrl+V 粘帖到文檔中，這樣不會(huì)生成額外的圖片文件（HTML就這點(diǎn)不好）。
有時(shí)候針對(duì)復(fù)雜的細(xì)節(jié)，還可以用Photoshop畫好，再粘帖進(jìn)去。不過(guò)因?yàn)槁�，非常少用�?/p>
表單內(nèi)容
這是所有網(wǎng)頁(yè)、交互的重要組成部分。有一些自己瞎定義的符號(hào)（還好比較一目了然），后來(lái)有位同事入職后也自創(chuàng)了一套。目前我在用的主要如下：
- 輸入框：[ ]、[請(qǐng)輸入搜索關(guān)鍵詞...]，類似這樣的。
- 下拉框：[abc ▼]、[abc v]，類似這樣的，用 charmap 呼喚出字符映射表拷貝。有時(shí)候?yàn)榱苏鎸?shí)一點(diǎn)，還會(huì)把向下的三角改為灰色。
- 復(fù)選框：[ ]表示未選中，[√]表示選中。有時(shí)也會(huì)用[·]，來(lái)表示選中，簡(jiǎn)單，但不那么明顯。
- 單選框：( )表示未選中，(·)表示選中。
- 按鈕：文字加灰色的背景色（字符底紋），這在Word中只要按一下。
- 其他：發(fā)揮你的創(chuàng)意（比如 disable 可以加灰色背景）。
其實(shí)可以利用Word的控件，但是控件的文案要在另外一個(gè)小窗體中輸入，總嫌麻煩。
其他
還有一些小交互，比如收攏、展開（用[+]和[-]），關(guān)閉按鈕（用 × 字符，或字母X），最小化（就是一個(gè)下劃線）之類。還有，有時(shí)候不用表格，用一行“-”來(lái)表示分割線。
這個(gè)其實(shí)可以形成規(guī)范，關(guān)鍵是要能夠真正的在保證有效傳達(dá)的情況下，提高畫原型的效率。
附上一個(gè)剛才花了10分鐘畫的 MT 后臺(tái)寫日志的線框圖（wireframe），共勉。
本文鏈接：http://www.95time.cn/design/doc/2009/6424.asp 
出處：JunChen
責(zé)任編輯：bluehearts
|
