在項目中，設計師與開發(fā)者處于不同的項目階段，同時也使用著不同的工具，那么讓他們兩者之間建立良好的溝通協(xié)作方式就尤為重要，MasterGo雖然是一款面向設計師的專業(yè)工具，但同時兼顧強大的協(xié)作基因，今天小編就用一個全新的視角，站在開發(fā)者的角度，幫助大家了解和正確使用MasterGo，讓設計與代碼連接更加緊密！

在開始之前，我們首先需要知道，MasterGo能為開發(fā)者做什么？

首先，MasterGo提供自動標注功能，無需第三方應用，就可以自動將設計稿中元素的尺寸、間距、位置、顏色、字號等進行標注，只需一個分享鏈接，團隊開發(fā)人員就可進入項目獲取到設計稿的標注信息。

其次，MasterGo的切圖功能，快捷鍵為“S”，在這里預設了iOS、Android、Flutter設備的尺寸、倍率、前后綴、格式等參數(shù)，與開發(fā)對接的時候，即可精準匹配多設備、多尺寸的使用需求，更快速、精準的交付設計稿。

第三，雖然MasterGo可以直接查看設計圖的標注，但為了滿足工程師的習慣，還添加了「一鍵同步至藍湖」的功能，提高設計效率的同時，也可以滿足開發(fā)人員的習慣。

此外，當設計師交付設計稿給開發(fā)時，開發(fā)人員可以通過MasterGo的評論功能，快捷鍵為“C”，在設計稿的對應區(qū)域添加評論，減輕溝通成本，高效調整設計圖。

當然，通過MasterGo提供的API接口，開發(fā)者可以獲取到設計稿的權限，根據(jù)項目或團隊的需求，開發(fā)一些更能提升團隊效率的插件，同時，MasterGo的社區(qū)，也提供了眾多優(yōu)秀的插件供我們使用。

在與設計師協(xié)作時，通常會收到對方發(fā)送的MasterGo鏈接，我們推薦使用谷歌瀏覽器打開，如果只是預覽，不需要查看標注和代碼切圖，就不需要登錄，直接按住Cmd+鼠標滾輪即可完成縮放，按住空格即可完成拖拽。如果需要查看設計圖的標注，就要登錄賬號，并獲取相應的查看權限。

進入標注模式后，可以通過不同的頁面來查看不同的內容，如果開發(fā)人員要查看的內容均在一個頁面內，設計師只需要分享這個頁面鏈接即可。頁面左側是圖層欄，開發(fā)人員在查看設計稿時可以通過左側的圖層樹，查找并快速定位到元素，點擊下拉菜單后，可以選擇想要的類型，選擇好圖層類型后，在搜索框中輸入名稱即可指定元素圖層。

如果想快速定位到圖層位置，可以在左側圖層欄中選中該圖層，雙擊圖標即可快速定位到圖層的位置，或者選中圖層后，按快捷鍵Shift+2或Cmd+2，也能快速定位到圖層。如果想要測量元素的間距，就在選中圖層后，鼠標移到其他圖層就可以自動測量出圖層與圖層間的距離。

其實對開發(fā)者來說，最重要的還是查看標注和代碼，開發(fā)人員可以進入標注模式，點擊設計圖，在右側的標注面板查看元素的各種信息，并且MasterGo支持選擇不同的開發(fā)平臺，滿足在iOS、Android、Web端的各種開發(fā)需求。

除了開發(fā)平臺之外，我們還可以查看顏色模式，點擊顏色右側的下拉菜單便可以看到，它支持16進制、RGB、RGBA等類型，這里所有的參數(shù)都可以直接點擊來復制使用，出現(xiàn)“已復制”提示后就可以直接粘貼到編輯器中，另外MasterGo還支持多種色彩模式的切換，對于開發(fā)者來說，十分友好。

設計師標注好切圖后，開發(fā)者可以在標注模式導出切圖，MasterGo提供了兩種導出方式，分別是“單獨導出切圖”和“批量導出切圖”。

首先是“單獨導出切圖”，我們選中一個圖標后，在右側的設置中找到導出，可以根據(jù)需要選擇倍率、前后綴以及不同格式，完成后點擊導出即可導出切圖。

如果我們想要“批量導出切圖”，有三種方式：可以點擊左側菜單欄，選擇“文件”和“導出所有切圖”，然后點擊導出；也可以進入標注模式，點擊右側欄中的“導出所有切圖”完成導出，或者使用快捷鍵“Shift+Cmd+E”激活批量導出切圖彈窗，完成批量導出。

以上就是本期分享的從開發(fā)者視角快速上手使用MasterGo的全部內容了，希望能夠幫助到開發(fā)同學，同時也希望能有更多開發(fā)同學可以加入體驗一下MasterGo。