萬盛學電腦網

 萬盛學電腦網 >> 網頁制作 >> 交互設計 >> 設計中的溝通 用鉛筆來繪制“粗糙”的草圖

設計中的溝通 用鉛筆來繪制“粗糙”的草圖

  在Web UI 模型出現之前,經過了很長一段的時間,設計師們都會選擇使用縮略圖(Thumbnail Sketching)來展現自己的創意,表達自己的思路。這種技巧就像是設計師專門用於溝通的一種藝術,而這種藝術現在卻漸漸淡出大家的視線。

  而通過本文,就讓大家重新審視品味一下這種藝術。

  對於設計師而言,對線框圖的期望其實是一種能夠在繁重設計工作中整理自己思路的方式。而繪制縮略圖更多的是就是為自己累計更多的創意,從中找到自己思維中的閃光點。

  草圖是繪制線框圖的地基

設計中的溝通 用鉛筆來繪制“粗糙”的草圖 三聯

  線框圖(Wireframing)是我們熟知的設計基礎。按照大家現在的認知,大部分的設計師都會將線框圖當作設計的第一個基礎步驟。

  實際上,縮略圖是一種更久遠並且使用起來更成熟的技術,可惜現在大家基本不會在這個技術上投入什麼精力進行討論。縮略圖並不像從前那樣受到重視,我們無需回避這個話題,因為現在,線框圖的使用可以讓設計師能夠更專注在最基礎的頁面架構上,使得設計過程中可以不受設計風格的考量干擾。

  但縮略圖的確比線框圖更加基礎,在設計中通過對縮略圖的繪制,所表達出的設計更加具現化。但更重要的是,設計師是否願意理解並使用縮略圖。

  縮略圖的意義是什麼

  縮略圖聽上去是一種結構簡單的簡筆畫,聽到這個名字給人的第一個感覺就是很有趣。

  不過,縮略圖的意義更多的是在很短的時間內,將大量自己的所想到的創意在紙面上繪制出來,直接的說就是一種在視覺上進行的頭腦風暴。而在這一點上,縮略圖與線框圖的功能一致,只是縮略圖的結構更小,制作的速度更快速。

  當完全擺脫了各種干擾,在同樣時間內,縮略圖所能記錄下來的創意遠超過線框圖。在這個過程中,設計者可以繪制出大量的縮略圖草稿,而在這些草稿的基礎上就能進一步進行線框圖的繪制。

  如何去做

  在創作縮略圖的過程中,我們需要先畫幾個簡單的浏覽器模板、頁面邊框,這可以是任何你所需要的設計模板。這裡有一些現成模板,或許可以給你的設計帶來一些幫助。

  當你完成這些准備工作,你就能開始進行你的繪制。在繪制的過程中,你不需要優秀的畫功或其它的任何技巧。正好相反,你可以完全投入到創意的思考中,隨手畫出自己的想法,哪怕這讓你在過於倉促的繪制過程中,只能畫出幼兒塗鴉的作品。

  在這一點上,縮略圖可以說是一種追求速度、甚至可以說是一種偷懶的行為。把所有會浪費你時間的多余修飾統統拋棄,只需要最簡單的圖形,可以把你想到的最基本的框架勾勒出來,就能進行下一個設計。

  這能給你帶來什麼?

  我們能從這些看上去很簡陋的小圖圖上得到什麼?

  現在的情況是,我們已經能夠輕易的得到太多

  通過電腦繪制,我們的創意往往在剛剛生成的時候就能夠快速制作成最接近現實的圖紙。

  但這就帶來一個問題:盡管這個過程已經非常短,但是時間上仍然只夠我們展現其中一項或者兩項設計。雖然我們希望這些設計最終能被實現,但是我們最初的設計往往就未必是我們最好的設計。

  將一個設計過早的具現化未必是一件好事。

  當一個創意已經被繪制成相對成型的線框圖甚至是原型、視覺稿的時候,我們可能已經很難對整個設計進行改良,甚至從新開始一個設計。哪怕在一個設計上你沒有面臨需要改進的情境,你也浪費了一次進行大量創作的機會。

  通過各種設備、軟件我們可以很輕易的做出一個設計的圖樣,但是通過繪制縮略圖我們可以在很短的時間內記錄大量的創意,而我們從這些被記錄下來的設計中,可能會找到我們自己創作過程中的閃光點。

  節省自己的時間

  在設計中,對時間的管理總是被大家放在交付環節的首位,每每規劃時間,都為自己的交付結果設定了嚴格的最後期限(拋開原文,譯者很自豪有一定程度的拖延症)。

  但在實際情況中,設計並不需要把所有的時間都用在交付結果上,生成創意的時間完全取決於個人。而通過繪制縮略圖,這個步驟所花費的時間幾乎就是創意生成的全部。並且這個步驟可以讓你在一定程度上對自己的成果進行評估和審視。因為你所考慮的情況已經足夠的多,所以在後續的過程中你可以更快的應付突發的狀況,包括布局的更改以及功能的轉換。

  縮略圖不僅僅是用於布局

  當我們在闡述縮略圖的這個概念時,我們不僅僅是針對布局,縮略圖在任何類型的設計上發揮左右。事實上,大家在繪制LOGO時,就是從繪制縮略圖開始的。

  在設計LOGO時,大家普遍會從繪制縮略圖開始,那麼在其它領域我們可以進行相關的嘗試。

  標題設計、網頁開發、宣傳冊、名片、App界面、角色設計

  繪制縮略圖的技巧

  現在對縮略圖我們達成了統一的概念,那麼無論你將其用於哪個領域,我們首先都需要找到一些繪制它的原則技巧。

  就是一幅幅小小的塗鴉

  同樣從事設計工作,可能我們中間的確有人無法用鉛筆繪制出一幅足以表達自己創意的草圖。

  但在繪制縮略圖這一點上,如果你是一個繪畫苦手,那很好,你更加適合創作縮略圖。因為對於習慣用鉛筆繪圖的人,他們的習慣制約了他們繪制縮略圖。一條直線,一個圓角都會成為他們這些細節控的絆腳石。

  我們需要達成一個共識,這個技術需要的是量而並非是質。我們不反對完美的繪圖,事實上,作者(譯者也是)非常欣賞(譯者是羨慕)可以繪制完美草圖的藝術天才。

  上圖是出色草圖中的其中一個案例,繪制技巧在文章《設計中的溝通,繪制表達自己創意的草圖》中但在縮略圖中,我們只需要把我們創意通過紙筆進行概述。我們不需要在圖紙上繪制出裸視3D的效果。

  保持推進的步伐

  我們不需要在繪制的過程中過多的琢磨其中一個創意,當一個創意被畫出來後並不討我們的喜歡,我們不需要它的基礎上進行改良,更不需要把它擦掉後推翻從來。你所需要的就是把目光從這個圖上移開,並開始進行下一個創意的繪制。這是因為,在幾小時後你回頭一看,或許會發現這個創意沒有你想象的那麼遭。

  多多益善,千萬別少

  既然是繪制創意,當然是越多越好、來者不拒。繪制縮略圖時,完成5、6個根本不足以表達腦海中的創意。當你落實繪制縮略圖時,你就應該肯定了自己腦海中有繪之不盡的創意。在設計專業方面的教授會在授業的過程中要求自己的學生一次性提出25個以上的創意,這個方式可以激發創意的思考。

  不要畫出50幅同樣的圖

  最初進行大量的縮略圖繪制時,我們可能會產生一個錯覺,就是每一個創意看上去差別都不大。這種情況並不少見,我們所需要的就是發揮自己的想法,如果沒有清晰的概念,那就從不同的方向和領域上去思考。謹記這裡所做的一切不過是一次頭腦風暴,這裡面所有的創意並不是每個都是最好的,僅僅是自己與自己的一次“激烈討論”。

  保留好自己“每一個”創意

  盡可能的把自己繪制的草稿都保留下來,現在被你淘汰的這些作品或許日後會成為重要的參考(或者成為生後被別人肯定的參考,譯者想到了蘋果近年把喬幫主的生前推翻的創意從新翻出來並實現了,設計者一定很驚喜)。

  當一個設計師踏入了一個全新的領域時,我們往往會遇到瓶頸。回頭看看自己曾經靈光一閃的設計,或許其中正好就是現在的自己需要的想法。

  筆者所使用的方法就是通過壓感筆在iPad上利用Adobe Ideas以及iDraw等軟件進行草圖創作。通過數字產品進行草圖創作更覺有幫助,通過這些設備可以導入Illustrator或者Photoshop中進行處理。

  如果你也使用了縮略圖進行創作,希望你能留下你的鏈接,和大家一起分享。

  推薦工具:實時協作網絡制作圖表制作Cacoo工具,Cacoo是一個簡單易用的網絡畫圖工具,運用它可以制作多種圖表,例如:site maps, wire frames, UML 和網絡圖表等。

  Via:DesignShack

copyright © 萬盛學電腦網 all rights reserved