Eagle 是一款圖片收藏及管理工具，它不僅可以高效收藏和整理各種圖片、截圖、Sketch 組件等，而且查找非常方便，協(xié)同功能強(qiáng)大，操作體驗(yàn)超群，支持 Mac 與 Windows 系統(tǒng)。

身為一名設(shè)計(jì)師，相信我們都有一件必做的事情：「整理電腦上的素材」。

如日常工作中因?yàn)槟硞€(gè)項(xiàng)目所收集的圖片，或是平時(shí)逛設(shè)計(jì)網(wǎng)站所保存的圖，又或者是平常收集的一些源文件，管理起這些素材總是讓人頭疼。

這幾年我也嘗試使用過(guò)市場(chǎng)上其他幾款圖片整理應(yīng)用，包含 Ember、Inboard、Pixa、Pixave、Pincap 等。這當(dāng)中個(gè)人覺得 Inboard 是最好用的，過(guò)去我曾推薦過(guò)不少朋友使用 Inboard 這款應(yīng)用，比較可惜的是這款軟件已經(jīng)沒有再更新了，許多功能也沒有持續(xù)優(yōu)化，特別是收藏的素材累積到一個(gè)程度后就變得難以整理了。

在去年12月的時(shí)候，突然冒出「不如自己來(lái)開發(fā)一款心目中的素材整理工具」這樣的想法，與幾位朋友構(gòu)想這個(gè)想法后，就開始開發(fā)這款新產(chǎn)品。

我們希望這款新工具可以滿足下面這些需求：

1. 高效收藏提供各種高效的收藏方式，迅速收藏看見的靈感。

2. 高效整理迅速完成圖片分類與整理的任務(wù)。

3. 容易查找不需花費(fèi)大量時(shí)間就能夠找到收藏的素材。

4. 同步與團(tuán)隊(duì)協(xié)同與團(tuán)隊(duì)隊(duì)員共享、協(xié)同，個(gè)人使用可以在多臺(tái)設(shè)備上同步。

5. 順手的操作體驗(yàn)產(chǎn)品如果做的不順手，即使擁有在多強(qiáng)大功能都是不合格的。

好的素材管理軟件應(yīng)當(dāng)可以方便快速地保存并有效地整理圖片、可以讓設(shè)計(jì)師快捷地檢索到所需的素材、同時(shí)也可以方便團(tuán)隊(duì)之間進(jìn)行分享。

五個(gè)月過(guò)去了，很高興這個(gè)粗糙的想法可以從早期的「小玩具」變成后來(lái)數(shù)千位設(shè)計(jì)師愛用且樂(lè)意推薦與使用的一款「產(chǎn)品」，也就是這篇文章要向各位介紹的「Eagle」。

Eagle

Eagle 是專為設(shè)計(jì)師打造的圖片收藏及管理工具，可以輕松整理電腦上各種圖片、照片、屏幕截圖、海報(bào)、網(wǎng)頁(yè)設(shè)計(jì)、Sketch、Pinterest等各種圖片，提供云端同步圖片功能，支持 Mac 與 Windows 系統(tǒng)。我會(huì)在文章接下來(lái)的部分介紹這款產(chǎn)品的各項(xiàng)功能以及這些功能在開發(fā)時(shí)背后的想法。

一. 收藏功能介紹

首先我們先來(lái)介紹收藏功能的部分，分別是「瀏覽器插件」、「屏幕截圖」、「第三方內(nèi)容導(dǎo)入」、「剪貼板粘貼」這幾個(gè)部分來(lái)介紹：

1. 強(qiáng)大的瀏覽器插件（支持 Chrome、Safari和Firefox）

逛網(wǎng)站時(shí)看到有用的信息立刻收藏，大幅增加你的收藏效率，隨時(shí)隨地將網(wǎng)頁(yè)上的任意圖片，整個(gè)頁(yè)面截圖都儲(chǔ)存到你的收藏夾里。Eagle 的瀏覽器插件提供多樣的收藏功能，可以完成各種情境下的收藏，分別有：

• 單一圖片收藏

收藏網(wǎng)頁(yè)的圖片很麻煩？現(xiàn)在你有一個(gè)更好的方式。安裝瀏覽器插件，只要在想要收藏的圖片點(diǎn)擊右鍵并點(diǎn)擊收藏，Eagle 就會(huì)自動(dòng)幫你下載起來(lái)。

• 批次圖片收藏

網(wǎng)站里面有好多想要收藏的圖片怎么辦？快試試看 Eagle 提供的批次圖片收藏的功能，只需要一個(gè)點(diǎn)擊，所有的圖片就儲(chǔ)存到你的收藏夾里！

• 內(nèi)容區(qū)域截圖

你可以使用功能選單中的「區(qū)域截圖」來(lái)啟動(dòng)截圖功能迅速的將靈感收藏下來(lái)，而且網(wǎng)頁(yè)的資訊也會(huì)自動(dòng)幫你存下來(lái)哩！

• 網(wǎng)頁(yè)整頁(yè)截圖

傳統(tǒng)網(wǎng)頁(yè)截圖一次只能截取一張，而且還要自己決定截圖的寬度，實(shí)在非常麻煩，如果想要一次收藏各種螢?zāi)怀叽绲慕貓D就得要操作很多次才能完成。Eagle 在網(wǎng)頁(yè)截圖功能上做了很棒的創(chuàng)新，你只需要一個(gè)點(diǎn)擊，網(wǎng)頁(yè)的各種尺寸都會(huì)為你截圖收藏下來(lái)！

所有使用瀏覽器插件收藏的圖片，Eagle 都會(huì)自動(dòng)為你儲(chǔ)存圖片來(lái)源的網(wǎng)站以及網(wǎng)站的名稱。

2. 屏幕截圖

靈感隨時(shí)會(huì)出現(xiàn)在眼前，想要立刻收藏起來(lái)怎么處理？這時(shí)候你可以使用 Eagle 提供的屏幕截圖功能捕捉眼前的看到的任何靈感，并快地進(jìn)行整理與分類，所有的截圖 Eagle 都會(huì)自動(dòng)幫你自動(dòng)標(biāo)注一個(gè)截圖標(biāo)簽，透過(guò)這個(gè)標(biāo)簽，我們可以在未來(lái)找到所有屏幕截圖的圖片收藏。

3. 支持第三方內(nèi)容導(dǎo)入

• Pinterest 和花瓣網(wǎng)內(nèi)容導(dǎo)入

你可以將自己或者是其他 Pinterest 其他使用者收藏的內(nèi)容迅速導(dǎo)入到 Eagle 中收藏，大家都可以藉助這個(gè)功能，迅速成為一位收藏達(dá)人。

• Inboard 內(nèi)容導(dǎo)入

你可以直接將 Inboard 上的資料進(jìn)行備份，所有收藏的內(nèi)容、標(biāo)簽、資料夾都可以無(wú)痛轉(zhuǎn)移到 Eagle 來(lái)。

4. 從剪貼板添加內(nèi)容

靈感可能來(lái)自四面八方，有些可能本地檔案、可能來(lái)自網(wǎng)頁(yè)上、可能來(lái)自其他繪圖軟件甚至是你的手機(jī)，無(wú)論上面說(shuō)的哪一種來(lái)源你都可以直接將剪貼板的圖片直接添加到 Eagle 收藏起來(lái)，非常的方便！

5. 支持 Sketch 組件

你可以把所有畫過(guò)的 Sketch 設(shè)計(jì)都儲(chǔ)存在 Eagle 并依據(jù)各種組件名稱進(jìn)行歸類，例如「按鈕」、「輸入框」、「導(dǎo)航列」等等，所有收藏的的組件都可以直接拖曳到 Sketch 直接修改使用。

用 Eagle 管理 Sketch 組件的好處：

A. 避免重復(fù)造輪，加快設(shè)計(jì)流程。

B. 設(shè)計(jì)團(tuán)隊(duì)共享，保持團(tuán)隊(duì)風(fēng)格一致。

6. 支持各種常見的檔案格式

目前 Eagle 支持各種圖片格式，包含 JPG、PNG、BMP、GIF、Sketch、PSD、AI、 EPS、TIFF、Base64 等等

二. 管理功能介紹

當(dāng)素材被我們收藏下來(lái)后，如何有效地整理這些素材就變得非常重要，在整理素材這個(gè)部分，Eagle 也提供許多實(shí)用的功能，可以讓整理變得更輕松，分別有「資料夾」、「標(biāo)簽」、「自動(dòng)輸入標(biāo)簽」、「批次分類」、「批次重新命名」、「防止重復(fù)收藏」等功能

1. 用文件夾分類圖片

你可以依據(jù)不同的圖片類型建立固定的內(nèi)容分類，例如「網(wǎng)頁(yè)設(shè)計(jì)」、「海報(bào)」等等，與傳統(tǒng)的文件夾不同，所有收藏在 Eagle 的內(nèi)容都可以歸類到多個(gè)文件夾，而且不會(huì)占用兩份以上的容量。

2. 用標(biāo)簽分類圖片

根據(jù)素材的特性可以撰寫特定的標(biāo)簽，例如「扁平風(fēng)」、「電商」、「趨勢(shì)」等等。

3. 自動(dòng)標(biāo)注標(biāo)簽

時(shí)常使用標(biāo)簽功能的朋友應(yīng)該會(huì)發(fā)現(xiàn)一個(gè)挺麻煩的問(wèn)題，那就是常常需要輸入已經(jīng)輸入過(guò)的標(biāo)簽，非常浪費(fèi)時(shí)間，現(xiàn)在你可以不需要這樣啦！在 Eagle 中，你可以為特定的文件夾設(shè)置自動(dòng)輸入標(biāo)簽，未來(lái)任何被添加到這個(gè)文件夾的靈感都會(huì)自動(dòng)貼上文件夾特定標(biāo)簽！

4. 批次歸類功能

在 Eagle 中你可以迅速的將圖片靈感瞬間歸類到多個(gè)分類中，而且歸類后，所有的自動(dòng)標(biāo)簽也會(huì)全部添加到這個(gè)內(nèi)容上，同時(shí)就可以完成分類與撰寫標(biāo)簽兩個(gè)任務(wù)，大幅提升了收藏效率。

5. 在圖片上標(biāo)注想法

所有收藏下來(lái)的圖片，你都可以在上方框選并標(biāo)注想要補(bǔ)充的想法，不管未來(lái)哪一天查看，你都可以快速了解當(dāng)初覺得很不錯(cuò)的地方在哪，團(tuán)隊(duì)使用時(shí)，也可以知道每個(gè)成員收藏當(dāng)下的理由與想法。另外，圖片標(biāo)注內(nèi)容與圖片本身是分開獨(dú)立的，也就表示你可以隨時(shí)更改或移除標(biāo)注，都不會(huì)影響圖片本身。

6. 防止重復(fù)收藏的提示

為了避免用戶重復(fù)收藏了同樣的靈感，Eagle 提供了相當(dāng)強(qiáng)大的判斷功能，可以在添加內(nèi)容的時(shí)候迅速計(jì)算是否有相似同樣的內(nèi)容，也許是同一張圖片的不同尺寸、格式， 這些都可以判斷出來(lái)，而且這個(gè)過(guò)程絲毫不會(huì)讓你感覺到延遲或停頓。

7. 圖片批次更改名稱

收藏一系列的主題圖片，時(shí)常我們收藏下來(lái)的圖片名稱都不太一致，使用目前的修改名稱功能要進(jìn)行序列的名稱修改也相當(dāng)不容易?；谶@個(gè)使用情境，我們重新開發(fā)「批次命名」功能，沒有太多繁雜的接口操作，只需要透過(guò)幾種簡(jiǎn)單的代號(hào)就可以迅速完成以下任務(wù)：

• 新的名稱 + 序列號(hào)碼(%N)（支持格式 1, 01, 001, 0001 自動(dòng)補(bǔ) 0 功能）

• 新的名稱 + 時(shí)間(%D)

• 原始名稱(*) ＋ 序列號(hào)碼(%N) 或 時(shí)間(%D)

• 自己決定序列號(hào)碼的起時(shí)數(shù)值

三. 內(nèi)容查找功能介紹

當(dāng)你把文章都收藏下來(lái)也都?xì)w類好了，接下來(lái)最重要的任務(wù)就是在需要這些素材的時(shí)候，可以迅速找到它們。相信各位設(shè)計(jì)師都有類似的經(jīng)驗(yàn)，幾年里整理下來(lái)的素材可能已經(jīng)超過(guò)上百個(gè)分類，標(biāo)簽也有幾百個(gè)，往往花費(fèi)大量時(shí)間在這么多資料中進(jìn)行查找、點(diǎn)擊，不僅沒有效率而且也非常累人。

Eagle 目前提供幾種有效的方式可以讓你迅速的找到需要的內(nèi)容，分別有：「顏色篩選」、「類型篩選」「迅速切換（類似 Alfred）」、「一鍵查看分類或標(biāo)簽」。

1. 顏色篩選功能

相較于其他競(jìng)品，Eagle 擁有更強(qiáng)大的顏色搜尋能力，隨時(shí)可以幫助你尋找與你想要的色彩相關(guān)的收藏。正在想黑色的設(shè)計(jì)方案嗎？沒問(wèn)題，點(diǎn)擊上方過(guò)濾功能的黑色，立刻查看相似的靈感。

2. 迅速切換分類或標(biāo)簽（就像 Alfred）

隨著時(shí)間的累積，我們的收藏分類可能會(huì)變得非常多，不管在瀏覽或者歸類圖片都變得非常難用。Eagle 提供了一個(gè)“快速切換（Quick Search）”的功能，可以讓我們迅速的在數(shù)百個(gè)分類中迅速切換穿梭，再也不必一個(gè)一個(gè)慢慢找。使用方式很容易，點(diǎn)擊快速鍵 ?（Ctrl） + J 啟動(dòng)，輸入想要的關(guān)鍵字就可以迅速前往想要的「資料夾」及「標(biāo)簽」啰！這里有一個(gè)小細(xì)節(jié)，在關(guān)鍵字搜尋上，我們開發(fā)了一套模糊比對(duì)的算法，即使拼字不太正確，依然可以找到相關(guān)的分類或標(biāo)簽哦！

3. 一鍵查看其他分類或標(biāo)簽的內(nèi)容

選取圖片后，你會(huì)在右側(cè)檢視區(qū)看到這張圖片的標(biāo)簽與資料夾，假如你想要查看這張圖片相關(guān)的標(biāo)簽或其他資料夾的內(nèi)容，你只需要點(diǎn)擊標(biāo)簽或資料夾名稱就可以立刻查看到啰。

四. 云端同步及團(tuán)隊(duì)協(xié)作

你有多臺(tái)電腦或者想要跟團(tuán)隊(duì)成員一起收藏靈感素材嗎？沒問(wèn)題，Eagle 可以很容易的就實(shí)現(xiàn)這個(gè)功能，只需要將靈感收藏庫(kù)放在常見的云端硬盤服務(wù)（例：Dropbox、Google Drive、iCloud Drive、堅(jiān)果云），就可以輕松實(shí)現(xiàn)云端同步與團(tuán)隊(duì)協(xié)作啦。

五. 產(chǎn)品在細(xì)節(jié)上的設(shè)計(jì)

在整個(gè)產(chǎn)品開發(fā)過(guò)程中，我們花費(fèi)非常多心力在產(chǎn)品的用戶體驗(yàn)上，包含接口的動(dòng)效、反饋、布局的合理性、以及像是各項(xiàng)功能預(yù)設(shè)值、偏好值記憶等，我在這里分享一些我自己特別喜歡的部分：

1. 音效提使與反饋

刪除內(nèi)容、發(fā)現(xiàn)重復(fù)圖片、內(nèi)容下載成功時(shí)， Eagle 都會(huì)發(fā)出有趣的音效來(lái)提用戶任務(wù)已經(jīng)完成。

2. Trackpad 支持

圖片列表與圖片展示畫面都支持 Trackpad 進(jìn)行大小的縮放。

3. 超爽的放大體驗(yàn)

將鼠標(biāo)移動(dòng)至想要詳細(xì)查看的位置上，接著壓著 Command 按鍵加上鼠標(biāo)滾論，就可以很精準(zhǔn)的放大想要查看的地方，完全不需要先放大、再移動(dòng)。

4. 圖片排版方式

列表上的所有圖片都不會(huì)被截到任何一個(gè)部分，而且可以查看到每一張圖片的整體，而且又不像會(huì)像「瀑布流」排版那樣難以閱讀。

5. 瀏覽偏好記憶

每種文件夾都收藏著不同類型的圖片，這些圖片都有他們合適的查看尺寸，在切換分類時(shí)，你不需要自己手動(dòng)的調(diào)整這個(gè)設(shè)定，因?yàn)?Eagle 會(huì)自動(dòng)記住你在每個(gè)資料夾的偏好尺寸。

6. 中文標(biāo)簽支持拼音排序

除了英文標(biāo)簽之外，所有的中文標(biāo)簽在標(biāo)簽管理頁(yè)面中，也都會(huì)依據(jù)拼音的順序進(jìn)行群組與排序。

新增功能：

• 素材打包導(dǎo)出/導(dǎo)入

• 支持觸控板（Trackpad）手勢(shì)切換、放大

六. 我們的下一步

• 同時(shí)啟動(dòng)多個(gè)資源庫(kù)，方便切換

• 導(dǎo)入更多第三方服務(wù)上的內(nèi)容（如Dribbble、Behance）

• 內(nèi)容導(dǎo)入/導(dǎo)出

• 智能型資料夾

• Sketch 插件

• 自訂快速鍵

• 手機(jī)版本 App

希望正在看這篇文章的你也會(huì)喜歡 Ealge 這款產(chǎn)品，如果你在體驗(yàn) Eagle 的過(guò)程中有遇到任何問(wèn)題或者想給我們一些建議，請(qǐng)不要吝嗇的告訴我們。