好工具優化工作流程，這10生產力利器，前端及設計師必備的工具，是提高效率的一大助力。

　DragDis

　　設計師總是在尋找靈感，而 DragDis 就是這樣一個幫助設計師保存靈感的工具，這是一個 chrome 插件，非常容易使用。

當我們找到好看的圖片可以輕松地拖動到云上。原作者每周新建一個文件夾，他介紹這是一個很好地審視自己設計品味成長的方式。

　DragDis也有一個全頁網格視圖。用著非常舒心。

　　Muzli

　　這是一個 Chrome 插件，匯集來自Designer新聞，Dribbble，Behance等來源的設計相關內容。

　　設計師都喜歡看那些設計精美的案例，從中汲取靈感，一個合格的設計師必須要了解國外最新和最熱門的設計作品，這樣你就可以把握設計方向和理念，這樣你的設計作品就會與國際接軌，一個好的工具可以幫助你節省大量的時間，Muzli 其實就是取代了谷歌瀏覽器默認的標簽，只要你安裝了就會成為瀏覽器的主頁（可選設置），這樣你每天打開瀏覽器就會獲取到來自于各大設計網站的最新作品。

　　值得一提的是這個插件是有專門的人去負責維護運營的，這就像你有一個個人助理幫你挑選最好的前端和設計相關的文章。

　　Invision

　　Invision是一個原型設計和工作流平臺，非常適合前端和設計師之間的協作。

　　設計師可以把做好的設計稿上傳到項目中。然后他們將屏幕彼此熱連接。

　藍色部分是熱鏈接區域。如果點擊它們，會帶您到下一個屏幕。這是設計師通過流程來引導客戶和開發人員的好方法。當與用戶進行一些初步的定性測試時，它也很有用。

官方說法 Airbnb、Evernote 、Adobe、Oracle、Yahoo、Zappos 等均為 InVision 的用戶，超過 35 萬名設計師在使用 InVision 的服務。

　　What the Font

　　字體是設計中相當重要的組成部分，而這個工具就是能幫你找到，當前網站用的什么字體。

　　這是個 chrome 插件，只需要簡單的點擊一下即可出現字體的詳情。

Postman

　　前端開發人員工作時，經常需要查詢或調用 API 。Postman 是一個方便的工具，可以幫助你向API發出請求。

　　當開發人員需要調試一個網頁是否運行正常，并不是簡簡單單地調試網頁的 HTML、CSS、腳本等信息是否運行正常，更加重要的是網頁能夠正確是處理各種 HTTP 請求，畢竟網頁的 HTTP 請求是網站與用戶之間進行交互的非常重要的一種方式，在動態網站中，用戶的大部分數據都需要通過 HTTP 請求來與服務器進行交互。

　　Postman 插件就充當著這種交互方式的“橋梁”，它可以把各種模擬用戶 HTTP 請求的數據發送到服務器，以便開發人員能夠及時地作出正確的響應，或者是對產品發布之前的錯誤信息提前處理，進而保證產品上線之后的穩定性和安全性。

　　Wappalyzer

　　Wappalyzer 是一個用于識別網站使用的庫和框架的工具。

　　它也是一個 Chrome 插件，是目前為前端開發人員最有用的工具之一。

　　下一次你想知道一個網站使用什么庫，來創建一個特定的可視化功能，Wappalyzer 幫你搞定。

上面工作向的生產力工具介紹完了，下面在介紹兩個娛樂向的生產力工具。舒適的工作環境有助于提升效率。

　　Boom 2

　　Boom for Mac，可以有效地提高蘋果操作系統的音質，具有各種音效增強工具，比如提高系統的音量，改善語音聊天或者音樂播放的音效等，同時 Boom Mac 還具有加大音頻文件音量的功能。比如下載的音樂音量太小，可以使用 Boom Mac 處理后再同步到蘋果設備中。

　　Noiz.io

　　很多創意工作者喜歡咖啡店的氛圍，（有 Mac 和 iOS 版本）可以讓你的擁有這種氛圍，可以調節出咖啡店，雨天，雷電和海浪的感覺。