Figma:在整个企业中进行设计,原型设计和协作

FIGMA

在过去的几个月中,我一直在为客户开发和集成高度定制的WordPress实例。 这是样式的平衡,可以通过自定义字段,自定义帖子类型,设计框架,子主题和自定义插件扩展WordPress。

困难的部分是我是通过专有原型平台的简单模型来实现的。 尽管它是可视化和设计的可靠平台,但它并不容易转换为HTML5和CSS3。 加上所有其他迭代,我的日子变得非常沮丧,进度非常缓慢。

令人困惑的一个问题是,设计机构只是交出了原型,而没有提供任何类型的主样式表……因此,我们正在通过将原型导出到其中来实现这一目标。 策普林,然后将CSS转换为WordPress。 所需的步骤数量以及平台之间的差距使该过程变得困难。 更不用说试图简化速度和可伸缩性的复杂性

FIGMA

FIGMA 使用一个平台将所有工作集中在一起,该平台可在团队的每个成员中进行设计,反馈和协作,其中包括:

  • 设计师 –在上下文中进行实时协作。 永远不必担心文件过时或覆盖彼此的工作。
  • 利益相关者 –发送链接以收集反馈,获取变更请求,并允许涉众在您的设计中进行副本更新。
  • 开发工具 –工程师始终可以访问当前的事实来源,并且可以检查元素,导出资产和复制代码。

Figma具有一些独特的功能:

  • 布尔运算 –使用四个公式:并集,相减,相交和排除,您可以精确地组合任何形状图层集。
  • 组件 –使用跨文件的可重用和可伸缩元素来更快,更一致地构建。 访问每个实例中的图层,以便您可以直观地内联编辑和覆盖文本和图像。
  • 限制 –通过将对象固定到父框架,将对象捕捉到网格或什至通过创建可缩放的组件来缩放设计以适合任何屏幕尺寸。
  • 设备框架 –在正确的环境中展示您的设计。 您甚至可以在纵向和横向模式之间进行选择。
  • 交互作用 –通过定义单击,悬停,按下等时的交互作用,使原型栩栩如生。
  • 覆盖 –通过相对和手动定位,您可以完全控制叠加层的显示位置和显示方式。
  • 像素完美 – 60fps交互式编辑为您带来超清晰,像素完美的预览和导出。
  • 模型 –通过连接屏幕并添加诸如交互,过渡,叠加等元素来快速构建流程。 无需同步到其他工具,只需共享一个URL即可接收反馈。
  • 响应式设计 –拉伸布局,看看它们如何响应屏幕尺寸的变化。

响应式原型

  • 滚动 –在单个形状或整个父框架中启用水平,垂直或任何方向的滚动。
  • 样式 –在所有项目中同步颜色,文本,网格和效果。 保留较少的文本样式,并使用Figma独特的网格样式在不同设备上对齐设计。
  • 团队图书馆 –在Figma中共享组件和样式-无需共享驱动器或其他工具。 您和您的团队可以通过简单的发布工作流程来控制更改的发布方式和时间。
  • 矢量网络 – Figma创建了更直观的钢笔工具,可以在直接操作的同时保留与路径的向后兼容性。

企业 对于客户而言,Figma可以大规模提高一致性,效率和安全性。 该平台使企业客户可以使用团队库轻松管理设计系统,并能够在整个组织中上载和共享自定义字体。 包括单点登录,访问控制和活动日志。

Figma入门

Figma有大量的教程供他们选择。 Youtube频道,这是一个入门视频:

FIGMA 使开发人员能够直接从设计文件检查,复制,导出资产和复制CSS。 您还可以通过集成启用现有的工作流程,包括 策普林, 声码, JIRA, Dropbox, 原型原则 对于Mac。 它们还具有强大的API。

免费试用Figma

你觉得呢?

本网站使用Akismet来减少垃圾邮件。 了解您的数据如何处理.