2016-10-24 分類: 網(wǎng)站建設(shè)
引子:
筆者做UI設(shè)計時間也不短了,認識不少優(yōu)秀的設(shè)計師朋友,總想為大家分享一些干貨,最近發(fā)現(xiàn)了一個很普遍的問題:很多設(shè)計師雖然設(shè)計能力很出色,工作經(jīng)驗也足夠資深,但不是很注意工作流的優(yōu)化,經(jīng)常浪費一些精力在效率很低的體力工作上。尤其對UI設(shè)計師來說,對接的人多,項目文件(各種切圖)雜,科學的工作流能讓我們的操作行云流水,事半功倍,把注意力集中在設(shè)計本身上。
因此便有了這個系列的文章,第一篇《Bridge——設(shè)計師Juno的終極圖像管理術(shù)》分兩部分,上部分主講靈感圖庫管理,下部分講設(shè)計師項目文件管理。需要用到一個經(jīng)常被設(shè)計師忽視的強大軟件:Adobe Bridge??纯催@個問題就知道國內(nèi)設(shè)計師們有多不了解Bridge了:Ps 里面的 Bridge 是否有存在的必要?反響不錯的話,未來我會把UI設(shè)計和標注切圖這兩方面工作流優(yōu)化的經(jīng)驗也分享出來,(大多數(shù)國內(nèi)UED團隊的“非設(shè)計部分”工作流或多或少都是有問題的,馬克曼標注等等很多國內(nèi)UED團隊推薦的工具/方法其實都弱爆了)敬請期待。
請注意:本文介紹的圖像整理方法只針對職業(yè)設(shè)計師、攝影師等需要處理大量圖片的人群。如果你的圖庫里不到20個文件夾,圖片文件還不到2000,那其實用不到神馬管理方法哈~好了,廢話少說,進入正題。
(上)使用Bridge做靈感庫管理
當我們接觸到一個新的設(shè)計項目,做風格捕捉的時候,需要找出大量的相關(guān)參考圖片。本地圖庫也好,網(wǎng)上搜也罷,這是一個基本繞不開的過程。如果你是個設(shè)計老手,肯定有一個自己的靈感圖片庫,積累了大量打動你的設(shè)計、插畫、攝影作品等等。那么,問題來了,如何整理自己的靈感庫才足夠科學高效?
我和不少設(shè)計師聊過這個話題,發(fā)現(xiàn)大家普遍的整理方法都是隨機的,粗略的。比如有人直接一個文件夾“素材”,里面放了各式各樣的圖,不分類;有人會每次有需要的時候去網(wǎng)上搜,然后隨便放到桌面上。少數(shù)人會把自己的靈感庫按照大致種類分成子文件夾“圖標”一個文件夾,“界面”一個文件夾諸如此類。但這樣的做法是低效的,而且不可積累的,由于分類的時候沒有遵循一定的邏輯和規(guī)律,時間長了,印象就減弱,而找不到的記不住的圖片會讓你難以系統(tǒng)的形成設(shè)計視野層面的積累和沉淀。如果大家看過《佐藤可士和的超級整理術(shù)》這本書,就能體會科學的整理歸類對設(shè)計師的重要性。畢竟,我們的時間很寶貴。
今天我分享的“圖像管理術(shù)”,分“靈感庫管理”和“項目文件管理”兩部分,靈感庫管理方法可以好解決下列問題:
“我記得有個界面是某某產(chǎn)品來著,放到哪里找不到了”,“有個插畫風格很獨特,等等我找一下…額,找了十分鐘才找到”,“設(shè)計一個播放器,希望在圖庫里找些參考,尼瑪,打開文件夾,900+未分類的界面圖”,“這個設(shè)計好贊,好想看作者其他作品,死活想不起來是誰。。?!?/p>
管理目標:在文件數(shù)以萬計的圖庫中,用最快的速度找到自己需要的圖片所謂管理圖片,其實只需要我們做好“分類”和“查找”這兩部工作,就能在幾十個文件夾,上萬張圖片中迅速檢索出所需圖片。
先思考一下我們篩選圖片時候的需求,可以分解成不同的粒度:有時就單純想看所有“web ui”設(shè)計圖;有時可能我們會想搜“iOS7風格的”,“手機UI”,“播放器”所有設(shè)計圖,那么面對這種粗粒度和細粒度,應(yīng)該怎樣對圖片分類呢?有的同學可能想當然:文件夾分的細一點就行了啊。其實不然,面對這么多圖片,科學的管理狀態(tài)應(yīng)遵守“MICE”原則(Mutually Exclusive Collectively Exhaustive),既“相互獨立,完全窮盡”,做到不重疊、不遺漏的分類。而只用文件夾分類,是沒辦法做到這點的。上文中的例子中,就算把文件夾分的很細,“iOS7”一個文件夾,“播放器”一個文件夾,“手機UI”一個文件夾,那么所有符合這三個條件的圖片就得出現(xiàn)在這三個文件夾中,重復(fù)3次,大大降低了管理效率。如何做到“不重疊、不遺漏”?
第一步:按照“類別”對圖片做“一對一”的粗粒度分類。
具體是指,文件夾和子文件夾的類別都是相互獨立的。比如“GUI”和“ICON”這兩個子文件夾,ICON文件夾下可能有“單色ICON”,“寫實ICON”等子文件夾,“GUI”文件夾可能分“WEB UI”和“手機UI”兩個子文件夾。要保證在“寫實ICON”中出現(xiàn)的圖片絕不會出現(xiàn)在“手機UI”文件夾里,這樣第一步就完成了,在粗粒度上保證了所有圖片不重不漏。其實很多習慣好的同學平時就是這樣分類的。
第二步:按照“屬性”對圖片做“一對多”的細粒度標記。
然而,粗粒度的分類是無法滿足設(shè)計師的整理需求的。一個大類別文件夾(比如WEB UI)里往往出現(xiàn)上千張圖片。如何進一步分類?這時,系統(tǒng)文件夾就無法滿足我們的需求了,因為細粒度的類別往往其實是比較具體的“屬性”,比如作者,風格,顏色,這些屬性在不同種類的圖片文件之間是存在大量交集的。如果繼續(xù)用文件夾分類,你會發(fā)現(xiàn)如果在“WEB UI”下建立“清新配色”“iOS7”“播放器”“主頁”此類子文件夾,那么“手機UI”下也必須建立這些同樣名字的文件夾,這樣就出現(xiàn)了重復(fù),造成了低效。而且文件夾層級不宜過深,超過三層之后,往往管理無力,尾大不掉。對圖片屬性的管理,我們需要的是比文件夾更強大的圖片管理工具,來完成上述這兩個圖片分類和整理的核心需求。請牢記這兩個需求,下面會多次提到。待會兒,我會讓主角出場——Adobe Bridge。
別急,先來看看市面上其他比較常見的圖片管理工具
這是比較常見的4個圖片管理工具,Ember,Inborad,Sparkbox,Pixa,都是mac平臺的,除Inboard是免費外,其他都要價不菲。拋開“截圖”,“rss訂閱”,這些差異化的小功能不說,我們今天只來比較圖片管理這個核心功能。(如果你已經(jīng)用過這幾個軟件,已經(jīng)深知他們管理功能的不足,那請直接跳過這部分哈~)
咨詢了一下身邊好友,喜歡上面四個軟件的還真不少,比用Adobe Bridge的人數(shù)多許多,當然也有很多設(shè)計師聽都沒聽過Bridge是干啥的。我試用過Ember、Inboard、Sparkbox這三個,Pixa看介紹大同小異,后來還是果斷換回了Bridge。到底Bridge比他們強在哪里?要知道Ember可是要300+大洋,很多人視為超給力生產(chǎn)力工具的一款軟件!且聽我慢慢道來。
上述四個軟件的OSX基因很明顯,具體體現(xiàn)在使用軟件的第一步都是需要把你的文件夾里的圖片復(fù)制到軟件自己建立的一個叫“庫”的文件夾里,然后依靠軟件內(nèi)部的功能,對庫里的圖片進行管理,有點像iphoto。軟件內(nèi)部無論分了多少個組、文件夾、tag,都和系統(tǒng)文件夾沒關(guān)系了,假如你其實之前分過20個文件夾,一共有1000張圖,等你把圖都導(dǎo)入之后,庫文件夾始終是一個擁有1000張圖的大文件夾,你只能依靠軟件自己功能進行對圖片分類!各位,這是一個極其危險的機制!一旦出現(xiàn)意外,不是丟文件就是大費周折,還容易出現(xiàn)各種異常。依賴于某個特定商業(yè)軟件的封閉管理,始終是讓人不放心的,等你費勁波折把龐大的圖庫分好類,一旦不想用它了,或者它出問題了,你就別想輕松從“庫”里脫身了。有個朋友之前用Sparkbox,后來想換Ember,他有8000+圖片,分組也分了好多,后來我問他怎么遷移的圖庫。他說只能一個分類一個分類的遷移,弄了好久只遷移了4000+。。。
AdobeBridge則完全沒有這種后顧之憂,它支持windows和mac,其“文件夾”功能就是和系統(tǒng)文件夾對應(yīng)的,不受這個“庫”的制約。所以,它還是一個強大的項目文件管理工具,這會在下部分重點講。
我們來具體看下圖片管理功能。
Inborad是免費軟件,功能是最少最弱的,先看它。
三欄布局,重點是左邊前兩欄。Inboard提供了Tags和Folders這兩個功能,字面翻譯是標簽和文件夾,但別誤會,這個文件夾和系統(tǒng)文件夾一、點、關(guān)、系、也、沒、有??!而且Inboard支持同一個圖片出現(xiàn)在不同文件夾里,你會感覺這個功能是在滿足之前我們說的第二步:用“一對多”的屬性做圖片管理的需求。而Tags,除了展示數(shù)量有限,不支持編輯以外,居然看不出和Folders功能的區(qū)別。。。TAGS和FOLDERS之間也是沒有任何層級關(guān)系和邏輯關(guān)系的,所以,Inboard提供的管理工具,其實有些混亂。第二欄圖片流視圖就很不錯啦,瀑布流布局,大大提高了圖片瀏覽效率,不過這是每一款圖片管理軟件的“標配”,大同小異罷了。
Sparkbox分的要清楚多了,Categories功能和系統(tǒng)文件夾很像,有層級關(guān)系,一張圖片只能出現(xiàn)在一個文件夾里(但是依然和系統(tǒng)文件夾沒關(guān)系,所有圖片在系統(tǒng)中只是在一個大的“庫”文件夾中)。
Tags支持TagsGroup這種層級關(guān)系,一個圖片可賦予多個tag, 能滿足我們之前說的用“一對多”屬性來管理圖片的需求。
但是,這里的Categories和Tags是兩個互為獨立的功能,兩種功能沒法組合使用,要么用categories,要么用Tags,這就讓人頗為不爽。而之前已經(jīng)分析過了,“一對一”的種類和“一對多”的屬性其實是粗粒度和細粒度兩個層級之間的。當然,由于Tags有標簽組功能,你完全可以使用Tags來滿足對“種類”這個粒度的分類需求。但是只能細化到一個層級,而且不同的tag是完全沒辦法取交集或者并集的,比如,如圖中,雖然有“WUI”,“iOS7”,”WUI”這些tag,你也是永遠沒馬上篩選出“iOS7風格,簡潔風格的WUI界面”的圖片的。所以,管理功能仍然不夠強大。
值得一提的是,第四個按照顏色分類篩選圖片蠻有意思,但對我來講,實用性一般,因為絕大多數(shù)圖片都不止幾種顏色,配色能力上去了,就很少想“只看綠色主色調(diào)圖片”這種想法了。
再來看下Ember,Ember雖然沒能擺脫不了萬惡的“庫”機制,但它提供的管理機制還是相對靈活的。
首先,它沒理“一對一”的分類需求,只針對“一對多”的屬性分類需求,提供了“收藏”這個功能。而字面上的文件夾功能,其實是多個”收藏“的并集。文件夾直接可以自由編輯文件夾之間的從屬關(guān)系。相對上述兩個軟件,這已經(jīng)是一個不小的進步了,提供了相當大的自由度。但是怎么處理“文件夾”和“收藏”這兩者之間的交集并集關(guān)系,才能滿足我們之前總結(jié)的的兩大核心需求呢?(比如很方便的篩選出“iOS7風格,簡潔風格的WUI界面”的圖片這個需求),這夠你想很久的了。。尤其邏輯不甚清楚的同學,依然難以駕馭這種“自由”,稍加不慎,就會違背“MECE”原則,降低管理效率。而下面的那個“標簽”功能,完全是個雞肋。。。無視它好了。
你們應(yīng)該體會到了,圖片管理工具無非是用來滿足我們之前提到的那兩個需求的,雖然這三個軟件一個比一個貴,一個比一個靈活,強大,但始終沒法很好的滿足我們那兩個核心分類整理需求。而且,還必須使用該死的“庫”。。。這個“庫”機制還讓你圖庫的云同步也變得麻煩無比。如果用軟件自帶的同步服務(wù),一般是綁定iCloud或者Dropbox,那龜速你懂的。。。如果你很任性,非把“庫”文件夾和配置文件甩到類似百度同步盤這樣的國內(nèi)網(wǎng)盤里去同步,也是可以的,但只有Sparkbox能不出問題,而你費很大力氣去同步的“庫”里的文件,始終是一個包含所有圖片,一點都沒歸類的文件夾。分類操作,只能在軟件里進行。
好吧,說了這么多,終于輪到Bridge出場了,這位老爺子能解決上面遇到的各類問題嗎?能!
Bridge是什么?就是之前裝PS就會帶上的一個看著很復(fù)雜的不知所云的軟件,但其強大的功能其實能滿足我們上述提到的任何一種圖片管理需求,同時,還是一款方便的項目文件管理工具。
Bridge提供了多種過濾功能,其中的“星級”“標簽”等等,我覺得都是次要功能。真正強大的,最能滿足上述兩大核心需求的,是“和系統(tǒng)一致的文件夾管理功能”和“寫入XMP標準的關(guān)鍵字功能”。這兩個功能分別完成了對圖片按照粗粒的“種類”一對一分類和按照細粒度“屬性”一對多分類的需求。
第一個很好解釋,系統(tǒng)文件夾分類什么樣,Bridge里就什么樣,完全是一樣的。
Bridge支持配置多種視圖,上圖是我的“靈感管理”視圖,可以看到三欄布局,左欄有樹狀文件夾瀏覽模式和文件夾收藏。其中樹狀文件夾能提高文件夾結(jié)構(gòu)的瀏覽效率,而文件夾收藏則相當于快捷訪問區(qū),你可以把文件夾直接拖到這里來,以后可以直接在這個面板訪問常去的文件夾。上邊欄是能快速導(dǎo)航的面包屑導(dǎo)航條,能自動展開子文件夾列表。瀏覽效率比起其他軟件只增不減,而且規(guī)避了“庫”的風險。
第二條“關(guān)鍵字”是重點。Bridge的關(guān)鍵字功能好支持對“一對多”的標記需求,而且可以根據(jù)關(guān)鍵字搜索,篩選,輕松取并集。
上圖中,右側(cè)的關(guān)鍵字管理面板可以看到,添加了作者“Cosmin Capitanu”和風格“friendly”作為關(guān)鍵字。左側(cè)過濾器中,可以根據(jù)關(guān)鍵字快速篩選圖片。
最為強大的是,關(guān)鍵字是直接寫進圖片文件內(nèi)部的,你可以很方便的把圖庫所有分好種類的文件夾和里面的圖片文件直接丟到同步盤里進行云同步,無論你把文件移動到哪個文件夾去,只要打開Bridge,就能讀取你添加的關(guān)鍵字,永遠不會丟失。選擇一張圖片,右鍵-更多信息中,就能看到你用Bridge添加過的關(guān)鍵字。
Bridge就這樣把我們的問題解決了,無需使用危險的“庫”,管理功能也比其他同類軟件自由,強大。
(下)使用Bridge做設(shè)計項目文件管理
Bridge更為好用的功能,是其提供的多種項目文件管理功能,挑選幾個我常用的給大家拋磚引玉。
先來大致看下我配置的項目管理視圖,Bridge支持自定義工作視圖,我一般用兩種,靈感庫管理視圖和項目文件管理視圖,右上角可以一鍵切換。第二欄是列表視圖,方便瀏覽文件的全名、擴展名和常用屬性。第三欄有預(yù)覽模塊和元數(shù)據(jù)模塊,能快速預(yù)覽圖片和文件自身的一切相關(guān)信息
1.多文件同時預(yù)覽。這個功能用途很廣,選中多個文件就可以直接預(yù)覽,不管他們是什么格式。
網(wǎng)頁題目:設(shè)計師Juno的終極圖像管理術(shù)
文章源于:http://muchs.cn/news6/50456.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供網(wǎng)站收錄、網(wǎng)站改版、網(wǎng)站設(shè)計、企業(yè)建站、品牌網(wǎng)站制作、網(wǎng)站設(shè)計公司
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容