編者按:優(yōu)秀的設(shè)計(jì)師手藝不一定比你好,但效率肯定比你高。想提升設(shè)計(jì)效率,完全可以從積累素材、設(shè)計(jì)過(guò)程、完稿、文檔的整理下手。具體的讓@Ping 老師手把手來(lái)教你吧~ 最近明明(人家真叫明明)和我抱怨說(shuō):老大總是說(shuō)我設(shè)計(jì)東西慢,效率低,真是煩死了,要知道設(shè)計(jì)的好又快的東西這個(gè)世界上是沒(méi)有的!然后發(fā)了一張大家都看過(guò)很多遍的圖片:
在安慰明明情緒之余,我也思考起設(shè)計(jì)的效率問(wèn)題來(lái),在我看來(lái)設(shè)計(jì)其實(shí)與其他的工作并沒(méi)有太大的區(qū)別,不過(guò)是問(wèn)題的解決之道,首要的是解決問(wèn)題,然后再去做更上層的情感和靈魂性的東西,如果這樣的思路理解,那么設(shè)計(jì)一定有效率高低之分。 閑暇的時(shí)候我會(huì)下廚,其實(shí)做設(shè)計(jì)和下廚真的很像,下廚你需要準(zhǔn)備食材、然后烹飪、然后出品、最后整理廚房,再來(lái)看設(shè)計(jì):積累素材、設(shè)計(jì)過(guò)程、完稿、文檔的整理。有的人做飯快,比如我媽就比我快,后來(lái)我發(fā)現(xiàn)原因不僅僅是她的手藝比我高超,從菜品的搭配、切菜嫻熟度、配料的齊備等等都比我做的好,比我快就是自然而然的事情了。說(shuō)回設(shè)計(jì),想提升設(shè)計(jì)效率,那就完全可以從積累素材、設(shè)計(jì)過(guò)程、完稿、文檔的整理下手。 素材積累 素材目的與分類(lèi)方法 素材的整理應(yīng)該很多設(shè)計(jì)師都有做,當(dāng)然我也是,我整理素材主要是這樣的三個(gè)出發(fā)點(diǎn): 1. 尋找靈感 2. 設(shè)計(jì)模式、形式參考 3. 素材用于設(shè)計(jì)內(nèi)容填充 我的一位同事的素材庫(kù)文件夾命名為「彈藥庫(kù)」,我覺(jué)得非常貼切,這些素材能在你的設(shè)計(jì)過(guò)程中起很大的作用,尋找靈感、快速搭建 App 框架、找素材等等。 人人都可以用板斧,但是還要看你能不能耍的開(kāi),先看看素材**如何分類(lèi)**來(lái)提高設(shè)計(jì)效率:
用途一:尋找靈感與參考 這個(gè)主要是要將你平時(shí)的場(chǎng)景進(jìn)行分類(lèi),比如這樣的分類(lèi):Awesome App、Website、Logo、Illustrator、Typesetting 等等通過(guò)內(nèi)容進(jìn)行分類(lèi),這類(lèi)的內(nèi)容主要是圖片,方便尋找靈感和設(shè)計(jì)參考,比如我做個(gè) Profiles 的界面,就可以去Awesome App/Profile s里面找參考了。
用途二:設(shè)計(jì)文件標(biāo)準(zhǔn)模板 這一類(lèi)的素材主要都是源文件或者字體文件,比如:OS psd、設(shè)計(jì)規(guī)范文檔、字體、設(shè)備模板等,這些的文件是方便做設(shè)計(jì)的時(shí)候直接使用減少臨時(shí)去找的煩惱,可以快速的搭建 App 基礎(chǔ)框架,以及各個(gè)控件的大小尺寸。
用途三:設(shè)計(jì)內(nèi)容填充 在做 UI 設(shè)計(jì)的時(shí)候經(jīng)常會(huì)用到各種圖片素材,比如做社交軟件的時(shí)候需要好看的頭像,做分享軟件時(shí)候需要好看風(fēng)景圖、美食圖片,做電商軟件需要各種商品圖片,總之很多,而做設(shè)計(jì)稿一定要力求內(nèi)容真實(shí)性,那么不重復(fù)而優(yōu)質(zhì)的圖片素材非常重要,如果平時(shí)有收集整理,做圖的時(shí)候直接拿來(lái)使用, 臨時(shí)尋找的不僅浪費(fèi)時(shí)間質(zhì)量也差。 素材的分類(lèi)方法 既然設(shè)計(jì)素材這么重要,那有什么好的方式整理呢?最普通的方式可能就是文件夾了,一層層的嵌套,但是稍微有些繁瑣,其實(shí)現(xiàn)在有很多的軟件可以滿(mǎn)足這些功能。 下面是這些軟件的截圖,大家可以去找一款最適合自己的,我目前用的是 RealMacsoftware(就是知名Todo軟件 Clear 的開(kāi)發(fā)商) 出品的 Ember. 我的 Ember: 平時(shí)沒(méi)有整理素材怎么辦 有的人平時(shí)可能很少整理素材,或者才意識(shí)到這個(gè)事情,其實(shí)有很多的網(wǎng)站已經(jīng)幫幫我們做了這樣的事情,下面的幾個(gè)網(wǎng)站就是專(zhuān)門(mén)針對(duì) UI 設(shè)計(jì)的內(nèi)容整理的素材庫(kù): - iOSAndroid 按模塊分類(lèi)界面素材: pttrns.com - Android: Android Niceties、 Android Pattern - 尋找靈感:Pinterest 、花瓣、Calltoidea - 頭像素材: UI-face - 風(fēng)景素材: 500px - iOS iocn: iOS icon Gallery - 獲取 Apple 資源的大圖(專(zhuān)輯封面、電影封面、App icon 大圖):iTunes Artwork Finder by Ben Dodson 設(shè)計(jì)的一些Tips 「工欲善其事,必先利其器」,如果說(shuō)我們的素材是我們的「彈藥庫(kù)」,那 Photoshop 就是那桿槍了。其實(shí)設(shè)計(jì)中的技巧大多是圍繞習(xí)慣培養(yǎng)、自動(dòng)處理、善用某些功能來(lái)進(jìn)行的。下面我就按這幾個(gè)思路舉些例子。 PS模塊的布局設(shè)置(針對(duì)UI設(shè)計(jì)) 每個(gè)人的習(xí)慣都不一樣,UI 設(shè)計(jì)這塊,我的布局是這樣的: