如何在Figma中创建页面、使用图标、处理图片及保存发布

一、创建页面 #

• 在Figma文件左侧的页面面板（默认在左上角），点击面板底部的「+」按钮，就能新建空白页面
• 右键点现有页面，选「复制页面」可以快速创建带内容的副本
• 双击页面名称就能重命名，拖拽页面可以调整排序

二、使用各类图标 #

内置图标库 #

• 打开左侧工具栏的「资源」面板（快捷键Shift+I），搜索「Icons」，挑官方提供的图标集（比如Material Icons、Figma Icons）
• 点想要的图标直接加到画布上，拖拽边角能调大小，右侧属性面板可以改颜色、描边这些样式

自定义/导入图标 #

• 把本地SVG/PNG格式的图标文件拖到Figma画布，自动完成导入
• 选中图标后右键选「转换为组件」（快捷键Cmd+Option+K/Ctrl+Alt+K），之后就能在组件库里重复用
• 要批量导入的话，点顶部菜单栏「文件」→「导入」，选多个图标文件就行

三、添加并调整图片 #

添加图片 #

• 直接把本地图片文件拖到画布任意位置，自动插入
• 点顶部菜单栏「文件」→「导入」，选图片文件后点「打开」，再在画布上点一下就能放置
• 用快捷键Cmd+Shift+K/Ctrl+Shift+K打开导入窗口，能快速添加图片

调整图片 #

• 裁剪：选中图片后，点顶部工具栏的「裁剪」按钮（或者右键选「裁剪」），拖拽裁剪框边角调整范围，按Enter确认
• 调整尺寸：拖拽图片边角的控制点，按住Shift能保持比例缩放；右侧属性面板可以输入精确的宽高数值
• 样式调整：在右侧属性面板的「填充」「效果」栏，能加滤镜（比如模糊、对比度）、蒙版、渐变叠加这些效果
• 替换图片：右键点图片选「替换」，选新图片文件就行，原来的尺寸和样式会保留

四、文件的保存与发布 #

保存文件 #

• Figma默认自动云端保存，不用手动点；要是想手动触发，点顶部菜单栏「文件」→「保存到版本历史」
• 点顶部左侧文件名旁边的「▼」，选「保存副本」就能创建文件的独立备份
• 本地导出：点「文件」→「导出」，选要导出的内容和格式（PNG、SVG、PDF等），设置好参数后点「导出」

发布文件 #

• 点顶部菜单栏「文件」→「发布到库」，选要发布的组件/样式，填好版本说明后点「发布」
• 要是想发布成可分享的原型，点右上角的「播放」按钮进原型模式，再点「分享」，设置访问权限（公开/仅限邀请），复制链接就能分享给别人
• 发布更新：改完内容后，再进「发布到库」，更新版本说明然后点「发布」，团队成员就能拿到最新版本

内容的提问来源于stack exchange，提问作者Upasana Sharma