在 Figma 中使用 MacBook SVG:排版桌面首屏
先选择 MacBook 开合姿态,再将 SVG 放入 Figma 桌面首屏,并为标题留出空间。
MacBook 插画可以成为桌面产品首屏的视觉重点,同时为标题和操作按钮留出位置。
先在模型查看器中设置屏幕开合姿态,再将导出的静态 SVG 放入 Figma。
选择开盖或合盖姿态
首屏需要紧凑轮廓或低调配图时,可以选合盖。需要同时呈现屏幕和键盘时,可以选开盖。
MacBook Pro 查看器提供 0°、60°、105° 和 120° 开合角度。选好姿态和主题后导出 SVG。
将 SVG 放入首屏
- 将导出的 SVG 文件从电脑拖到 Figma 画布。Figma 会把导入的 SVG 转换为可编辑的矢量图层。
- 创建宽版桌面画板。把 MacBook 放在一侧,另一侧留作标题和主要操作按钮的文字区。
- 选中图稿,按 K 使用 Figma 的缩放工具。拖动角点可按比例缩放,描边和效果也会随图稿缩放。屏幕和底座周围要留白,也要顾及首屏画板的边缘。
平衡设备和标题
开盖姿态更高,细节也更多。给图稿足够宽度,确保屏幕和键盘清楚可辨。合盖姿态更紧凑,可以放低一些,为文案留出空间。
在图层面板中选择可用的矢量图层。进入矢量编辑模式后,可以调整对应图层的节点或属性。具体分组和路径边界取决于导入的 SVG。
保留选定的开合姿态
SVG 是导出时开合角度的静态图。要展示其他角度,请回到查看器重新导出。需要使用开合控件时,请打开独立 HTML 查看器。
常见问题
桌面首屏适合用哪种姿态?
要展示屏幕和键盘时选开盖。文案较多、需要紧凑配图时选合盖。
可以在 Figma 里调整开合角度吗?
不可以。SVG 保留的是查看器中选定的静态角度。要换角度,请重新导出。