『 整理圖庫是在做什么 』

《佐藤可士和的超整理術(shù)》書中提到了一個(gè)讓我印象深刻的觀點(diǎn)“不是因?yàn)槊β刀栌谡?，而是為了提升工作效率而主?dòng)整理”。

整理設(shè)計(jì)圖庫其實(shí)就是在做3件事情：

1.搜集    2.刪除    3.分類(本篇重點(diǎn))

很多設(shè)計(jì)師比較享受搜集賞心悅目的圖片，對(duì)刪除素材圖有選擇困難癥，最不想做的是分類這件事，因?yàn)樗麄冋J(rèn)為這屬于體力活，費(fèi)時(shí)費(fèi)力。那只能說你的理解太片面了。我曾今也很煩整理圖庫，但自從我掌握了方法之后，就越來越享受整理的過程了。先說下大家的誤區(qū)，整理并不只是體力活，它包含了大量的腦力勞動(dòng)。

『 整理圖庫的意義 』

我總結(jié)了一下，整理圖庫大概有以下4個(gè)好處：

1.提高工作效率

2.提高審美

3.提升結(jié)構(gòu)化思維

4.身心愉悅

① 提高工作效率

提高效率，能讓你在有限的時(shí)間內(nèi)完成更多的設(shè)計(jì)工作。能減少不必要的加班，讓你獲得同事的信任，領(lǐng)導(dǎo)的認(rèn)可。

要想提高效率，那你要決定「做什么」和「優(yōu)先做什么」。整理圖庫就是在執(zhí)行前優(yōu)先做的工作。

在我們的設(shè)計(jì)工作中，任何一個(gè)項(xiàng)目都是需要大量的參考的，很難做到100%原創(chuàng)，所以你的設(shè)計(jì)靈感主要就源自于你日常積累的圖庫。比如：我接到了一個(gè)關(guān)于活動(dòng)彈窗的設(shè)計(jì)需求，那我就可以迅速的找到“彈窗”圖庫，并且能給到對(duì)方“中間彈出”“下方彈出”“異形”“矩形”等不同的表現(xiàn)方式，省得再去設(shè)計(jì)網(wǎng)站上找新的參考，特別是在需求比較緊急的時(shí)候，有了圖庫的參考，是可以大大提高我們的工作效率。如果之前沒有積累的習(xí)慣，等接到需求的時(shí)候腦袋里面很難有畫面感，大量的時(shí)候會(huì)消耗在琢磨設(shè)計(jì)效果，或者網(wǎng)上瘋狂搜圖上。

② 提高審美

審美決定了一個(gè)人的品味，試想一下你自己設(shè)計(jì)的圖在別人的眼里很丑，但你卻不自知，別人也無法跟你溝通丑在哪里，這個(gè)也沒有什么邏輯可言，因?yàn)槟銈兊膶徝啦辉谕粋€(gè)level。

所以可以說，審美力，其實(shí)就是一個(gè)人的核心競(jìng)爭(zhēng)力，因?yàn)樗粌H關(guān)系到你做圖的水平，而且還影響了一個(gè)人的形象、魅力、氣質(zhì)，進(jìn)而會(huì)影響方方面面。對(duì)設(shè)計(jì)師而言，大眾的審美是由我們引領(lǐng)的。說設(shè)計(jì)師是一個(gè)注重創(chuàng)新的職位，但是任何的創(chuàng)意都是建立在之前的認(rèn)知之上，我們更應(yīng)該重視審美力。

“技術(shù)決定下限，審美決定上限”整理圖庫的過程，就是在消化人家作品的精髓，去除糟粕的過程，就是在不斷的更新自己對(duì)圖片的鑒賞能力，只有眼界提高了，你的設(shè)計(jì)能力才能提升，你在職場(chǎng)才更有魅力，你的作品才會(huì)有影響力。所以不要小看整理圖庫這個(gè)簡(jiǎn)單而有意義的事情。

③ 提高結(jié)構(gòu)化思維

結(jié)構(gòu)化思維是一種從整體到局部、從框架到細(xì)節(jié)的思維方式。它要求思考者不先入為主，不會(huì)過快地陷入細(xì)節(jié)，而要經(jīng)常留意事物的整體框架，在框架的基礎(chǔ)上去拓展細(xì)節(jié)。

專注于視覺表現(xiàn)的設(shè)計(jì)師，如果能夠習(xí)慣用結(jié)構(gòu)化的方式進(jìn)行思考，你的思維能力、溝通能力、學(xué)習(xí)能力都將獲得大幅度的提升。經(jīng)常迭代設(shè)計(jì)圖庫是否符合邏輯順序，新的圖片是否已經(jīng)被歸置到它應(yīng)在的文件夾中，是否又產(chǎn)生了新的需要被丟棄的圖片。經(jīng)常整理的過程也是一個(gè)實(shí)踐和理論不斷結(jié)合和碰撞的過程，通過長(zhǎng)期的科學(xué)分析整理，能夠總結(jié)出自己的一套關(guān)于設(shè)計(jì)分類的結(jié)構(gòu)化思維，并可以把這種有益經(jīng)驗(yàn)和思維模式應(yīng)用到更廣的領(lǐng)域，使自己受益更多。

④ 身心愉悅

整理圖庫的過程也是整理大腦碎片的過程，通過不斷的整理和思考能夠使我們對(duì)自己所搜集的圖片有更清晰的認(rèn)識(shí)，并且能夠通過不斷總結(jié)、優(yōu)化使大腦有更清晰的邏輯。養(yǎng)成良好的整理圖庫的習(xí)慣，能夠使人更加自律。看到圖片被分到屬于他們自己的文件夾、井井有條，滿足感和成就感油然而生。解放硬盤空間，節(jié)省了時(shí)間、精力，讓我們的工作環(huán)境化繁為簡(jiǎn)、達(dá)到舒適可控的理想狀態(tài)。

身體和精神都愉悅了，我們才能帶著更好狀態(tài)的進(jìn)入到下一個(gè)項(xiàng)目當(dāng)中。這就是一個(gè)積極的正向循環(huán)。

『 何時(shí)整理圖庫 』

還是從前面提到的整理圖庫的3件事來說，圖片是隨時(shí)隨地“搜集”，沒有任何限制。而“刪除”和“分類”這兩件事情最好是每月整理一次。為什么是“每月”？因?yàn)闀r(shí)間間隔太長(zhǎng)，文件擠壓過多，我們比較容易想放棄；時(shí)間間隔太短，也沒有必要這么頻繁，畢竟整理還是比較耗時(shí)的。

『 用什么軟件整理圖庫 』

工欲善其事，必先利其器。我是用eagle來做圖片的整理工作，它的強(qiáng)大只有使用過才會(huì)懂。在這里列舉了我曾經(jīng)使用過的3款整理圖片的軟件，并且寫下了我使用的感受，僅供大家參考。

Adobe Bridge 界面圖

花瓣P(guān)ro 界面圖

eagle 界面圖

『 如何整理圖庫 』

① 整理圖庫的原理mece法則

我在這里分析圖片是使用mece法則，有了這個(gè)法則，你可以很輕松的給圖片分類。

（1）什么是mece法則

mece法則，是Mutually Exclusive Collectively Exhaustive的縮寫，是麥肯錫培訓(xùn)師芭芭拉明托（Minto）書籍《金字塔原理》中提到的一種思考方式，中文意思是“相互獨(dú)立，完全窮盡”。大家記得兩個(gè)點(diǎn)：不重復(fù)，不遺漏，這樣我們思考問題才全面。

（2）mece的分析步驟

在應(yīng)用MECE原則時(shí)，我們一般分為以下三個(gè)步驟：

第1步：確定范圍

MECE原則雖說要「完全窮盡」，但是「窮盡」也是有邊界的，不是無止境的。所以在開始分析問題之前，要首先界定清楚問題的邊界和范疇。比如說，我平時(shí)接觸手機(jī)端和pc端比較多，那我給UI圖庫分類的時(shí)候，不需要刻意加上其他的設(shè)備，因?yàn)槲业墓ぷ髦幸灿貌坏健?/span>

第2步：找到合適的維度

維度，講的是從什么切入點(diǎn)進(jìn)行劃分，比如UI的分類，可以按不同的設(shè)備劃分（手機(jī)、pad、電腦、一體機(jī)...），還可以根據(jù)不同的風(fēng)格（毛玻璃、大黑字、新擬態(tài)...），這便是切入點(diǎn)。

有時(shí)，你會(huì)發(fā)現(xiàn)很難把所有要素都考慮進(jìn)來，這時(shí)你不得不加入項(xiàng)「其他」，用以包含不能被劃分到別的維度的要素。用「其他」當(dāng)然是可以的，但是如果你不得不用「其他」的時(shí)候，往往可能是你切入點(diǎn)沒有選好，所以要慎用「其他」。高手和菜鳥的區(qū)別，亦經(jīng)常體現(xiàn)在切入點(diǎn)的選擇上。

第3步：檢查重復(fù)和遺漏

反復(fù)檢查和分析各要素之間是否有遺漏或者重復(fù)。最好的檢測(cè)方法，當(dāng)你發(fā)現(xiàn)有一張圖不知道放哪里（不窮盡），或者放哪里都可以（不獨(dú)立），則說明你的分類有問題。

最后，我們要注意，MECE原則必須應(yīng)用在「純理性分析」的情境之中，對(duì)于感性的問題，MECE原則可能并不適用。

② 圖庫分類的10個(gè)維度

在《交互設(shè)計(jì)精髓 About Face 4》書中提及到了“視覺界面設(shè)計(jì)元素”，以下的10個(gè)維度是站在巨人的肩膀上總結(jié)出來的，結(jié)合了我個(gè)人的工作經(jīng)驗(yàn)，有所增減。

（1）情景

根據(jù)不同的使用場(chǎng)景進(jìn)行分類，比如：光照、設(shè)備、地點(diǎn)...

（2）形狀

根據(jù)不同的形狀進(jìn)行分類，比如：圓形，矩形、三角形、梯形、異形...

（3）尺寸

根據(jù)不同的尺寸進(jìn)行分類，比如：基礎(chǔ)版本（常規(guī)字號(hào)）、老年版本（大字號(hào)）、單屏、多屏...

（4）顏色

根據(jù)不同的顏色進(jìn)行分類，比如：日光模式、暗黑模式、彩色系、中性色、紅、黃、藍(lán)...

（5）文字

根據(jù)不同的文字進(jìn)行分類，比如：字號(hào)、字體、行高、字重...

（6）位置

根據(jù)不同的位置進(jìn)行分類，比如：上、下、左、右、遠(yuǎn)、近、留白...

（7）方向

根據(jù)不同的方向進(jìn)行分類，比如：向上、向下、向左、向右...

（8）質(zhì)感

根據(jù)不同的風(fēng)格進(jìn)行分類，比如：毛玻璃風(fēng)格、插畫風(fēng)格、立體風(fēng)格、新擬態(tài)風(fēng)格、酸性風(fēng)格、扁平風(fēng)格...

（9）動(dòng)作及其時(shí)間變化

根據(jù)不同的動(dòng)作進(jìn)行分類，比如：拖拽、滑入、移出、雙擊、單擊、點(diǎn)擊前、點(diǎn)擊時(shí)、點(diǎn)擊后...

（10）目的

根據(jù)不同的目的進(jìn)行分類，比如：引導(dǎo)目的、引流目的、展示目的、強(qiáng)調(diào)目的...

③ UI設(shè)計(jì)圖庫分類（舉例）

溫馨提示，圖片的分類方式有很多種，盡量按照自己的習(xí)慣來，也不要過于死磕「窮盡」這件事，不然會(huì)把自己逼死~~

下圖是我的UI圖庫分類方式，僅供參考

整理圖庫是一項(xiàng)頗有技術(shù)含量又能夠使人受益匪淺的工作。通過認(rèn)真思考并付諸行動(dòng)，可以讓我們養(yǎng)成做事認(rèn)真、關(guān)注細(xì)節(jié)的良好習(xí)慣，可以讓我們提升效率，收獲越來越高的自律性和自信心，可以讓我們擁有更敏捷的反應(yīng)和更智慧的思維，那我們何樂而不為呢？

參考文獻(xiàn)：

《交互設(shè)計(jì)精髓 About Face 4》艾倫.庫伯Alan.cooper著

《金字塔原理》巴巴拉·明托 Barbara Minto著

《佐藤可士和超整理術(shù)》佐藤可士和，Kashiwa Sato著

《什么是「MECE 分析法」，有哪些適用領(lǐng)域，該如何運(yùn)用？》第3類人（知乎）