Figma是一个基于浏览器的协作式UI设计工具,Figma从推出至今越来越受到UI设计师的青睐,如今也有很多的设计团队投入了Figma的怀抱,接下来会聊聊为什么我们应该选择Figma而不是Sketch。
基于原生OS开发的软件自然能更好的使用硬件资源,但Figma在速度上完胜Sketch,即使在处理大文件时也是如此。
#但Figma有插件么,Sketch上我依赖很多插件完成工作
Figma原生支持很多Sketch需要插件甚至依靠其它应用才能完成的功能,当然,Figma也支持插件开发。
Figma是为UI设计而生的设计工具,除了有和Sketch一样基本的操作和功能,还有许多专为UI设计而生的强大功能。
你可以在Figma里面无缝完成从设计到原型演示的切换,不需要反复同步设计图到第三方平台,我们同样可以利用FigmaMirror在手机上预览效果。
工程师可以在设计图上量取位置、并且可以导出所需任何资源(包括CSS、iOS、Android样式)
同一个锚点连接多个锚点
自动填充闭合区间
直接拖动锚点间的线条
我们可以跨项目共享和更新Component、Style,需要注意的是免费版不能跨文件共享Component。
Figma原生支持Googlefonts和FontAwesome。
可以快速轻松地对内部公司工作流程进行脚本改进,或将Figma与其他工具集成
Uber员工通过Figma的API查看反馈到电视上的实时设计文件
GitHubOcticon在Figma和Github仓库中,未来可以通过WriteAPI可以做到双向同步
设计文件现在是一个链接,这意味着:
在Figma中,我们更容易的以前端的思维方式进行设计。首先,Figma使用Frames而不是画板,有什么区别呢?
把一个较小的Frame拖到另一个较大的Frame上时会自动成为它的子元素。
我们可以使用Frames将屏幕划分为不同的内容区域,然后在这些部分内嵌套组件。这种方法与自动分组,相对定位和约束相结合,可以轻松快速构建一致且响应式设计。
因为Figma中的Frames类似于HTML中的容器(div)。工程师能够看到嵌套在各自容器中的UI元素,这意味着他们在写代码时会对布局有更好的了解。
Sketch有Symbol,Figma有Component。不同之处在于Component比Symbol更灵活,我们可以用更少的组件做更多的事情
在Sketch中,我们可以使用SymbolOverrides来编辑文本或交换嵌套Symbols。但是,如果想要更改其他属性(字体大小,边框粗细或背景颜色等),则必须创建一个新的Symbol。要解决这个问题,你可以将每个属性单独做一个Symbol然后把他们嵌套在一起,但数量会越来越多,对于大型项目和复杂的UI,维护会越来越复杂和难以使用使用Figma,我们可以访问和修改component中任何层的属性,而无需将其从mastercomponent中分离。
创建一个component,然后将其复制以创建两个instances
对mastercomponent的更改会立即同步到其所有instances
除非更改了mastercomponent的属性,否则任何属性都将被覆盖。
在侧边栏的面板中浏览所有的components
Component更方便的一点是,在Figma中,可以在较大视图的上下文中编辑component,而不必转到单独的页面进行编辑。
Figma的好处是你不需要在计算机上保存任何东西。所有文件都存储在云中,并可在任何地方访问。作为Sketch或甚至是AdobeXD用户,您可能已经习惯了50GB+的设计文件夹。Figma不再是这种情况。
如此处所示,文件可以追溯到五个月,并且仍然可以立即访问。无论您需要从另一个设计中获得什么样的最小元素,您都可以在几秒钟内访问它并在当前项目中使用它。
基于浏览器的UI可实现无缝协作,该工具迅速成为该领域类似解决方案的臭名昭着的竞争对手。来自Twitter,微软,GitHub和Dropbox等品牌的设计师发誓Figma作为终极UI设计工具。那么,Figma是否也是你的终极UI设计工具?
软件使用、安装、下载等任何问题,欢迎加入「素材集市」设计交流群,一起探讨学习。