隆重推出 Cloud Inspector — 免費的網頁版開發者協作工具

在我們的2020 年預告影片中，我們宣布開發者協作功能將於 2020 年 1 月登陸 Cloud。今天，我們很高興能兌現承諾，推出 Cloud Inspector 的 Beta 版。

Cloud Inspector 讓開發者可以輕鬆取得將像素轉換為程式碼所需的所有資訊 — 全部在瀏覽器中完成，而且最重要的是，完全免費。這是我們為團隊打造出色協作工具的旅程中的又一步，也是我們協助人們設計更優質產品使命的重要組成部分。

隨著今天的發佈，Cloud Inspector 的第一個版本正式進入 Beta 測試階段。我們已經在內部使用它，並與實際用戶進行了一段時間的測試，現在我們很興奮能讓更多人體驗它。以下是您目前可以期待的功能，以及未來的發展方向。

免費提供給所有人使用

Cloud Inspector 的核心是團隊內部的協作和交付，但我們也知道，獨立設計師也經常與開發者合作。因此，我們讓所有人都可以使用 Cloud Inspector。

如果您在 Cloud 上有一個團隊工作區，您在那裡分享的每個設計都可以立即進行檢查。而對於您儲存到個人工作區的設計，您可以在其文件設定中啟用 Inspector。

熟悉的 Inspector，就在瀏覽器中

要啟動 Cloud Inspector，請點擊 Cloud 上任何畫板旁邊側邊欄中新的檢查分頁。當您這樣做時，您會看到一些看起來有點熟悉的東西 — 一個類似 Inspector 的畫板屬性檢視。

就像 Mac app 中的 Inspector 一樣，Cloud Inspector 會根據您選取的圖層或畫板顯示相關資訊。我們也確保它會隱藏任何不必要的資訊，例如角半徑設定為 0、混合模式設定為「正常」或不透明度設定為 100%。換句話說，Cloud Inspector 會隱藏預設值，並在開發者需要時顯示他們所需的最重要資訊。

一鍵複製屬性

如果您正在檢查檔案並需要複製屬性，您只需將滑鼠懸停在它上面，然後點擊複製圖示即可。目前，我們會將該屬性的簡潔純文字版本複製到您的剪貼簿，但未來我們將允許您設定要複製的語言（例如 CSS）。

對於具有多個屬性（例如不同的填色和混合模式，或文字屬性）的圖層，您可以點擊區段標題，將它們全部一次複製到剪貼簿。以下是以複製一組文字屬性為例

Typeface: SF Pro  
Text Weight: 500  
Size: 16  
Style: normal  
Character: -0.32  
Line Height: 24 (1.5)  
Color: #000000  
Horizontal: Left  
Vertical: Top

以多種格式複製顏色

將屬性複製到剪貼簿很有幫助，但對於顏色，我們決定更進一步。將滑鼠懸停在任何顏色上，然後點擊出現的箭頭以顯示格式選單。在這裡，您可以複製 HEX、RGB 和 HSL 格式的顏色，以及 Objective-C 和 Swift 的 NSColor 和 UIColor 格式。

當您選擇顏色格式時，我們會在您的其餘瀏覽工作階段中儲存該偏好設定，因此您複製的任何其他顏色都將採用相同的格式。

我們認為，選擇複製顏色屬性格式的選項在移交過程中非常方便，我們迫不及待想在未來版本的 Cloud Inspector 中帶來更多以開發為中心的細節。

輕鬆測量圖層

當您選擇要檢查的圖層時，將滑鼠懸停在畫板上的任何其他圖層上，就會顯示與其相關的測量值。結合 Inspector 中的位置和大小屬性，調整設計尺寸應該輕而易舉。

Cloud Inspector 的下一步是什麼？

Cloud Inspector 的第一個 Beta 版本只是我們開發人員移交工作的第一步，我們已經在努力開發下一組功能，包括

• 更好地支援設計系統，以清晰的方式瀏覽符號、覆蓋和文字樣式
• 可用於生產環境的資源匯出 - 從單個圖層到整個設計
• 更多程式碼和顏色格式偏好設定（包括 CSS 和其他語言）
• 語言儲存（例如顏色格式，您只需選擇一次語言，我們就會記住您對整個文件的選擇）

立即試用 Cloud Inspector

Cloud Inspector 已進入 Beta 階段，您現在就可以在 Cloud 中試用。您可以在我們的文件中找到有關如何充分利用它的完整詳細資訊。一如既往，我們感謝您的回饋，我們很想知道您對它的看法。請持續關注未來幾個月的更多更新和新增功能