iT邦幫忙

2024 iThome 鐵人賽

DAY 13
0
IT 管理

前端工程師&UI 的30天約會:教會猴子用Figma!系列 第 13

[Day13] 12. Figma 基本操作(八):屬性區 - export

  • 分享至 

  • xImage
  •  

過去前端工程師在刻畫面時,需要由設計師匯出一包設計素材庫供切版使用,
現在 Figma 的共同協作讓所有專案成員都能自由匯出檔案,
今天我們來聊聊該怎麼使用 Figma 的匯出資源工具。

匯出資源 Export

當選定要匯出的元件、圖層或框架後,在屬性區的最下方找到 Export ,
點擊右邊 + 符號就會展開匯出功能,如下圖
https://ithelp.ithome.com.tw/upload/images/20240925/20166746qABr5NEjM3.png

  • 尺寸 Size:可以通過倍數設定匯出尺寸大小,範圍介於 0.25x 至 1024x 之間;亦可指定物件的高度 H 或寬度 W (擇其一)等比例計算尺寸。
  • 後綴/尾詞 Suffix:可在匯出物件的名稱末端加上後綴/尾詞,增加辨識度。
  • 格式 Format:Figma 支援匯出的檔案格式有 PNG、JPG、SVG 和 PDF 。
  • 匯出預覽查看 Preview:在匯出按鈕下方,可以展開預覽功能,方便查看所有選定的物件或區域。
  • 刪除:若預覽後想刪除原本預備匯出的項目,可點擊 + 旁邊的 - 圖示即可。

上一篇
[Day12] 11. Figma 基本操作(七):屬性區 - Design & Prototype
下一篇
[Day14] 13. Figma 基本操作(九):屬性區 - Frame
系列文
前端工程師&UI 的30天約會:教會猴子用Figma!14
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言