c。
過去，雖然Figma好用，但功能的缺失相當明顯：
- 做原型不如Axure專業
- 設計交付不如藍湖貼心
- 字體管理甚至沒有預覽功能
然而，現在Figma不僅解決了上述問題，還推出了許多創新功能！讓我們一起來看看這段宣傳片：
00:45
接下來，詳細介紹一些新功能，從簡單的開始~
1. 視覺化字體列表
以前的Figma字體列表簡陋得像學生作業，只是一個從A到Z的字體名稱列表，既看不到預覽，也沒有把常用字體列出來。
現在終於有了預覽功能，而且還提供了多種分類查看：
如果能把中英文分開顯示就更好了，希望以後能實現。
2. 自動布局更接近前端
00:35
2.1 自動換行
自動布局很好用，但一直有一個問題——不能換行。因此，每次只能做一行，然後手動複製多行。
前端樣式可以自動換行，這次Figma終於加上了自動換行功能，這真是方便不少，還省了一級Frame。
2.2 尺寸限制
再好的響應式頁面，也不可能下至0px上至∞px，基本都有尺寸限制。這個尺寸限制對前端來說，是非常簡單的一兩句程式碼，但大部分設計軟體都沒有這個功能。
Figma這次終於加上了尺寸限制功能，這對強迫症來說是一大福音：
3. 變數（Variable）
重頭戲來了~
Axure的原型功能最厲害的地方就是變數。變數是一個可以和頁面上的展示或操作聯動的值。
Figma現在也可以用變數來做很多事。先看一下宣傳影片感受一下：
00:46
接下來詳細解釋。
3.1 變數控制
例如這個數字控制項，點一下+就加一個數字，點一下-就減一個數字。
有了變數后，設置一個名為itemCount的變數，+被點擊時給itemCount加1，-被點擊時給itemCount減1。這樣只需一個頁面就能完成數字的交互。
變數有4種：數字、文本、顏色和布爾值（off/on二元選項）。變數可以用來做組件之間的聯動、音量調節、選項計數等，這幾乎沒有學習成本。
3.2 模式切換
前端能讓UI一鍵切換模式，例如深色模式、語言、尺寸等。利用變數，Figma也能實現這樣的切換：
這一切的秘訣就是這張可以記錄多組數據的表格：
你可以創建多個這種表，Figma會將數據變成菜單，一鍵切換。
4. 開發模式（Dev Mode）
Figma對前端的野心不止於此，他們是真的想要將開發也納入目標人群。
00:44
4.1 前端樣式
國內目前多用藍湖看尺寸、下載圖片，但性能較差。Figma的標注功能則清晰得多：
Figma開發模式對邊距樣式的展示，與瀏覽器自帶的開發工具非常相似，讓人倍感親切：
Figma本身有自動布局，因此布局樣式識別非常精準，未來可能會自動生成響應式頁面。
藍湖則無法識別布局，也沒有內外邊距、間距和尺寸限制：
Figma的圖片導出類型也很豐富：
查看方案更新時間也很方便，開發模式介面右上角就有：
還能對比查看變更記錄：
4.2 前端設計組件一體化
現在大家搞組件化，基本都是設計一套、前端一套，二者之間溝通效率低。Figma的開發模式有希望打破這一局面。
因為它可以列出設計師的樣式和組件列表：
這樣開發就能比較容易地了解設計所用的組件和標準色。
4.3 開發外掛
Figma本身有外掛，但主要是給設計師用的。現在開發模式也有自己的外掛區，全是面向前端的。
介紹完了，感覺怎麼樣？
如今，Figma的這些新功能，無論是字體管理、布局、變數還是開發模式，都顯示出它在快速進步，不僅追趕上了競爭對手，還在許多方面超越了 Axure 這個專注於 prototype 設計的工具。未來的Figma，將在設計和開發的各個方面，為使用者帶來更強大、更便利的體驗。
不妨親自試試看這些新功能，體驗一下Figma的變化吧！
