接上一篇建立了第一個 Figma 設計稿，正式畫稿之前我們需要熟悉一下 Figma 的設計工作臺。萬幸的是，以 Sketch 為代表的新 UI 設計工具，工作臺的佈局都差不多。我們以總分的形式拆解 Figma 的設計工作臺。先來一張動圖遍歷一下工作臺的大多數功能。
教程相關
Figma 地址：www。figma。com
閱讀時長：5分鐘
操作時長：12分鐘
佈局總覽
整個 Figma 設計工作臺可以劃分為四個主要區域：
工具欄：這裡集合了大部分 Figma 的功能，包含 Figma 選單；
圖層欄：這裡放置了設計稿中所有的圖層；
檢視窗：這裡可以看到不同圖層的具體屬性；
設計區：這裡呈現正在處理的設計稿，主要設計工作在這完成，很好理解，本篇不做解讀。
工具欄
選單：這裡集合了 Figma 中所有的功能，可以使用搜索功能定位自己需要的功能，前提是你的看得懂 ；
滑鼠：這裡可以選擇「Move」或「Scale」，其中 Move 就是普通滑鼠，Scale 是放大鏡，但是我們可以用瀏覽器自帶的放大縮小快捷鍵，所以 Scale 可能並不常用；
圖層插入：這裡集合了 Figma 中可以插入的各類圖層，包括畫布、圖形、線、文字和評論，滑鼠 hover 時會顯示豐富的插入選項；
標題：這裡可以對整個設計稿進行管理，裡面有個「Show Version History」很有可能是版本管理，等我後續研究研究。另外，選中圖層時，這裡會替換成圖層相關操作，比如蒙版、編輯、網格；
分享：在這裡可以分享你的設計稿給別人，比如我的設計稿地址是戳這裡 ，點選連結進來的小夥伴頭像會依次排列在此區；
演示：製作好原型後用該功能進行演示；
尺寸：工作臺引數設定，可以對一些設計區的參考線進行管理。
圖層欄
設計資產：封裝好的元件，以及載入的設計資產庫都會在此呈現，方便設計師對已生產和團隊資源充分利用。具體設計元件的建立管理、庫的建立管理會配上例項，呈現在單獨的教程；
圖層管理；設計稿中的所有頁面和圖層會呈現在圖層管理中，設計師在這裡管理具體的設計圖層。
檢視窗
設計：這裡可以對圖層的引數進行設定和管理；
原型：在這裡設定原型的相關引數，比如原型的觸發、跳轉目標、轉場方式；
程式碼：這裡可以讀取圖層的樣式程式碼，支援 iOS、CSS、Android。
擴充套件閱讀
外掛：CRAFT | Sketch Material | WeSketch | Runner | Paddy | Diya | Runner Pro
技法：Library | Colored Text | Symbol | Shared Text | Resizing | 流程圖 | 文件 | 表格
工具：InVison Studio | Nucleo | Feedly | Phase | Studio Platform | Overflow | Talebook | Framer X | Whimsical | Eagle | Bear | Sip | XMind Zen | Photo Creator
案例：Swarm | YouTube | Uber | Oscar | Atlassian | Adobe | Adobe | Airbnb
專題：阿里工具 | 亞賽大人 | 神奇字型 | XD 基礎外掛
教程 | Figma：建立文件
歡迎和我討論 Figma，微訊號heiheilaugh。也請關注我的個人專案
whose。design - 發現更多設計工具
。
