想从Sketch 切换到 Figma?不妨听听这份过渡指南

发布时间:2024-07-25 12:53:45 浏览量:703次

越来越多的设计团队开始从 Sketch 迁移到 Figma,毕竟这是大势所趋。但是这两个工具之间有差异,这篇文章会分享一些无缝切换的技巧。

想要了解更多关于设计系统,可以关注我最近的项目——适用于 Sketch 和 Figma 的设计系统 Slice。

为什么要使用这两款工具?

Figma 和 Sketch 都非常适合创建 UI 界面和组织组件库。它们都获得了设计界的认可,满足现代设计师不同需求。

为什么选择迁移到 Figma?

通常迁移到 Figma 有以下原因:

  • 寻求具有协同功能的设计工具,而 Sketch 不具备
  • 好奇 Figma 并想了解如何正确使用
  • 需要同时使用这两种工具,对 Sketch 更熟悉,尝试了解 Figma 的使用程度

迁移步骤

相比于其他竞争工具如 InVision Studio、Adobe XD、Framer,Figma 更容易从 Sketch 中导入文档,保持组件关系,简化文件传输流程。

为了顺利转化,需要理解两款工具的差异并克服其中一些痛点。

开始吧!

第一步:优先处理样式

避免错误和重复工作,首先创建核心图层和文本样式。

第1步:导入

打开 Figma,导入品牌素材。

第2步:创建图层样式

在 Figma 中手动创建图层和文本样式,命名时使用斜杠进行分组。

第3步:创建文本样式

Figma 中颜色可直接应用于文本样式,对齐方式在实例中设置,无需额外复制样式。

提示:浏览器中使用 Figma 无法使用本地安装字体,务必安装 Font Helper。

第4步:对比和适应

对比样式面板,适应新的布局样式,确保一切妥善安排。

进阶提醒

在 Figma 中,样式可独立应用于单个图层,无需组合样式,提高风格清晰度。

想了解更多两软件间样式差异,可下载《Figma 和 Sketch 样式指南》。

第二步:组件清单

调整样式后,继续处理组件,删除无效 Figma 组件(原 Sketch 符号)。

在 Figma 中无需创建形状符号,可自由控制组件圆角半径,重命名页面避免混淆。

了解 Figma 约束条件,习惯 Frame 概念,查看官方博客获得更多信息,正确更新组件。

更新背景色

Figma 中容器默认无白色背景,背景色与画板/符号颜色相同,调整可视化效果。

更新组件名称

删除 Sketch 中名称中的 . 或 _ 符号,方便快速搜索,确保每人访问到你的素材,按需重命名。

第三步:重新塑造风格

将组件和样式重新连接,选择相似图层并绑定样式。

使用 Figma 提供的原生解决方案,打开「edit」菜单,点击「Select all with the Same」绑定样式。

你还可以尝试最新插件「Similayer」,更多搜索命令可搜索到需要的图层。

设计系统和组件从 Sketch 到 Figma 的完整迁移基本完成,记得仔细检查和验证。

结语

工具迁移不难,重要的是了解工具属性,正确操作,重新配置。不同软件竞争激烈,选用应根据实际情况而定。

推荐一下 Slice,是一款模块化设计系统,兼容 Sketch 和 Figma,赶紧试试吧!

想要了解更多关于数字艺术教育相关内容,欢迎点击咨询

热门课程推荐

热门资讯

请绑定手机号

x

同学您好!

您已成功报名0元试学活动,老师会在第一时间与您取得联系,请保持电话畅通!
确定