在手機上預覽應用圖標,這更靈活方便

前段時間我們在調整產品的 icon,視覺同學做了好幾個版本的設計給大家做挑選。為了保證大家的真實感受設計師不得不導出不同版本、組合的圖標給大家(Sketch Mirrow 在公司網路下很成問題),一旦要臨時調整所有的操作得再來一遍,事兒不難但是非常的繁瑣。

可惜就在 icon 敲定之後我發現了這個叫做「ICNS」的應用,它的作用就是幫助設計師盡量簡單的來完成 icon 預覽的工作。ICNS 的思路其實很簡單。設計好 icon,導出到 dropbox 文件夾,打開應用預覽。

使用之前首先需要受援應用訪問 Dropbox,成功後 ICNS 會在 Dropbox 的「應用」文件夾中生存一個「icns」的文件夾。預覽的圖標都將這裡讀取的。

進入應用後 Dock 上的四個圖標是應用的功能入口,點擊第一個「icons」進入 app icon 選擇。

在沒有導入之前,你可以點亮 sample 中的 icon 試試應用的效果。如果想要進行 icon 預覽需要將文件導出到 Dropbox/Apps/ICNS 中,應用會將自動識別。

將設計好的 icon 放入文件夾中,如果 icon 較多建議還是按照文件夾歸檔。

將想要預覽的 icon 點亮並回到主屏,大家可以對多個方案慢慢對比了。

開發者還特意為應用增加了背景切換的功能,你可以在預覽模式下左右滑動屏幕來觀察 icon 在不同背景下的效果。

最後,如果需要你還可以通過「share」操作將當前頁面自動截圖發送給其他人查看。

icon 預覽的辦法很多,但圖片發手機改起來麻煩,軟體同步總是容易假死。多少都有那麼一點「麻煩」。ICNS 則相對靈活了不少,多方案對比、和競品對比、切換背景全都可以在應用中控制,省了不斷改圖的麻煩。這個產品的設計者應該是一個經常需要干這活兒的設計師。

但由於 icon 資源需要存放在 Dropbox 上,每次拖文件也是個麻煩事兒。這個時候就需要再次請出我們的規則利器「Hazel」,建立一個規則將某個命名的文件自動「搬」到 Dropbox 相應的文件夾中去。這樣我們只需要在 ICNS 中選擇 icon 進行開關就好了。

應用免費,掃描下方二維碼進入App Store下載安裝。

PinDesign是 Pinapps 新推出的一檔關於移動互聯網產品設計的訂閱周刊,每周我會和大家聊一些關於移動產品設計的話題,我希望能將它做成對設計師最有用的設計類周刊,為設計師和想成為設計師的同學們提供一些幫助。

如果你想進一步了解PinDesign 移動產品設計會員計劃,可以訪問下方地址或掃描下方二維碼:

PinDesign 移動產品設計會員計劃 (5折優惠中)


推薦閱讀:

火遍矽谷的50條增長黑客技巧,你知道幾條?
雙十一、雙十二,你是怎麼度過的?

TAG:图标 | 设计 | 移动互联网 |