我對用戶體驗草圖繪製的體會,咱們的導師,草圖繪製大師Kate Rutter教會了咱們如何經過草圖將本身的創意呈現於紙上。下面是爲你們分享一些可以用於快速、有效繪製草圖的實體或抽象工具。工具
爲何要繪製草圖?學習
做爲用戶體驗設計師,咱們應當可以自如的與不一樣的職能團隊協做打造複雜、有效的產品。爲了確保將來的成功,在產品創造的早期階段造成多樣的創意是必不可少的,由於最好的創意每每出現於創造過程。經過收集有關創意的反饋信息,可讓咱們在開始進一步工做以前達到去僞存真的效果。字體
就我我的而言,馬克筆和紙就像鑰匙同樣可以開啓我腦中充滿童年色彩的創意、探索空間,這一空間也是打造創意的最理想境界。網站
你的設計須要哪一種類型的反饋?ui
做品的詳實程度,與咱們預期獲得的反饋狀況之間有着直接的聯繫。若是咱們呈現出一個彩色、詳盡的PSD模擬圖,那麼可能會聽到以下的反饋:翻譯
「你爲何要選這個字體」(也就是說,反饋面會比較窄)設計
可是,若是你呈現出一個手繪的UI草圖,可能會獲得以下的反饋:對象
「用戶應該怎麼從這添加好友」(亦即:反饋面比較廣)blog
在設計早期,咱們須要儘量寬泛(歸納性)的反饋。不要讓對方的注意力被吸引到設計的表象上去。ip
另外,若是詳實程度太高,就會過早的把咱們框入到既定的創意範圍內並刺激咱們在完美程度上鑽牛角尖。可是經過紙和筆,就能夠避免不少這一類陷阱。
從心理學角度講,看非正式的草圖,會比看精心修飾過的內容更加容易激發觀看者提出建設性的意見。即使是黑白的矢量UI草圖也能抑制對方提出太有針對性的反饋。
不必定要很漂亮,但必定要簡單。
不少同行不會自誇爲大藝術家,好在咱們乾的活也並不是藝術,而是信息傳達。但即使你不認爲本身是個藝術家,學習一些基本的技術技巧也可以幫助你經過草圖繪製表達本身。不當藝術家實際上反而能讓你把精力集中到創意,而非草圖是否美觀上,百利而無一害。
而對於自誇爲藝術家的人,其所面臨的難點就在於如何在短時間批量出產草圖時放下對完美的追求。這對於熱衷打造精美圖形和線條的設計師來講,恐怕會很難。使用Time boxing這套工具則能夠幫助設計師克服這一困難,實現快速創意。要記住,咱們的目標是創造出快速的信息傳達媒介。
來看看這套工具:
你須要使用下列工具:
1.寬記號筆——要突出表現對象時使用
2.細記號筆——用於繪製主要圖形
3.超細記號筆——用於繪製較小的細節
4.30%或40%灰色馬克筆——用於添加陰影以及讓特色區域深刻背景中
5.黃色熒光筆——用於繪製關鍵點,例如交互區域
6.一沓繪圖紙
7.便利貼
8.小貼紙
9.計時器
技巧
熱身練習:在Tradecraft的課堂上,用戶體驗設計師會學習如何在計時器的幫助下繪製草圖。通常咱們首先會看一套網站的截圖,而後用5秒鐘時間繪製出本身所關注到的5個元素。其效果大體以下:
這項練習可以強迫咱們的大腦進行詳實度思考並跳出完美主義的侷限。咱們會首先思考貼近度、層次關係和主次關係等基本視覺概念,並會注意到最吸引注意力的內容及其緣由。常常進行這項練習可以鍛鍊本身的思惟能力。
創意造成:咱們開始對產品或功能進行創意繪製。在此過程當中,咱們須要快速完成下列各階段,每一個階段限時5到10分鐘:
1. 有哪些問題?描繪出目標用戶及其所面臨的問題:
2. 你的創意對解決這個問題有何幫助?畫出你的用戶用你的產品解決問題的情景。
3. 產品如何使用——畫出6種用戶與產品/功能交互或使用產品/功能解決問題的情景:
提示:每一個方框的大小至關於一個便利貼
4.票選最佳創意
若是大家是團隊合做,能夠用貼紙投票選出最有趣或最重要的一個設計範圍進行深刻(藍色是你隊友的投票,紅色是你本身的投票。)若是你是一我的,那票數最多的人估計就是你本身了。
5.作出5套快速UI草圖
設想你的設計在UI中向用戶呈現的方式。你不須要畫出界面的全部細節,只須要畫出與你當前所探索範圍相關的內容。
而後選出你最中意的一套UI草圖。
6.詳細UI草圖
在這一步,你能夠開始拓展本身最佳的UI創意,並思考如何對其進行進一步深刻。使用註解說明可能存在疑問的地方。此次的草圖須要讓人一眼可以看明白。
提示:草圖中加入用戶元素可以強調出你選擇當前設計的理由。
7. 畫出先後流程
下面,你能夠開始考慮與當前界面先後聯繫的屏幕界面,進而初步思索交互方式。這一步須要用黃色的熒光筆和灰色馬克筆來凸顯出重要的部分以及交互內容。
總結
上述的所有過程時長約45分鐘。這一神奇的流程可以幫助你快速得到創意。
養成快速繪製草圖呈現創意的習慣。不要管草圖漂不漂亮,將精力集中到如何清楚傳達創意訊息上。要記住:
「UBU(醜可是有用)遠比(漂亮可是沒意義)有效」——Kate Rutter
創意草圖繪製有許多技巧,對於哪些方法最有效也存在着各類不一樣的理論。你能夠多多練習,本身探索最適合本身的方法。
衷心但願各位設計師和非設計師朋友提供有關創意草圖繪製的意見。
翻譯:蔣燦
原文地址:medium.com