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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

（推廣）