figma下载

一个新的,功能更强大的界面,用于在整个组织中共享组件 (A new, more powerful interface for sharing Components across your organization)

The Team Library in Figma is a set of shared Components across all files in a Team. Components in the Team Library are accessible across any file — existing and new — in any Team project. If a new file is created in our Team, before it has any content in it, it automatically has access to hundreds of existing Components we’ve published to our Team Library. Not only that, but when the master version of a Component is edited, Figma allows those changes to flow throughout every file that contains an Instance of that Component. And the best part is that it’s not a forced update, instead, a notification appears in each of those files, allowing the change(s) to the Instance of that Component to be viewed and accepted.

Figma中的团队库是团队中所有文件之间的一组共享组件。 可以通过任何Team项目中的任何文件(现有文件和新文件)访问Team Library中的组件。 如果在我们的团队中创建了一个新文件,则在其中包含任何内容之前,它会自动访问我们发布到我们的团队库中的数百个现有组件。 不仅如此,而且在编辑组件的主版本时,Figma允许这些更改遍历包含该组件实例的每个文件。 最好的部分是,它不是强制更新,而是在每个文件中显示一条通知,允许查看和接受对该组件实例的更改。

Today, a major update to the Team Library was released. The left-hand panel in Figma, formerly just the Layers List, has a new interface at the bottom. By default that panel allows you to see all your layers and objects in the file, just as you could before, and now has two new dedicated spaces: File Components and Team Library, which can be toggled at the bottom of the panel or with keyboard shortcuts: alt + 1 for Layers List, alt + 2 for File Components, and alt + 3 for Team Library (although, Chrome OS hijacks that keyboard shortcut currently).

今天,发布了对团队库的主要更新。 Figma的左侧面板以前只是“图层列表”,底部有一个新界面。 默认情况下,该面板允许您像以前一样查看文件中的所有图层和对象,现在有了两个新的专用空间:“文件组件”和“团队库”,可以在面板底部或使用键盘进行切换快捷键:alt + 1用于“层列表”,alt + 2用于“文件组件”,alt + 3用于“团队库”(尽管Chrome OS当前劫持了该键盘快捷键)。

As a design system scales, maintaining consistency can become more challenging. At Square, we use Team Libraries to organize commonly shared assets between the Communications and Social teams. Assets like unified color palettes and icon sets created by the Marketing team, corporate logos, and devices by Facebook are all used frequently. After using several asset management solutions, having a unified, updating version of assets directly accessible inside the design application is incredibly powerful. So many issues related to building out design and asset library systems have been removed.

随着设计系统的扩展,保持一致性可能变得更具挑战性。 在Square,我们使用团队库来组织沟通和社交团队之间的共享资产。 市场营销团队创建的统一调色板和图标集,公司徽标以及Facebook的设备等资产都经常使用。 使用多种资产管理解决方案之后,拥有可直接在设计应用程序内部访问的统一,更新版本的资产非常强大。 与构建设计和资产库系统有关的许多问题已被消除。

But don’t feel limited to just icon assets. In Figma’s own words, you can “create design systems with linked UI components the whole team can use.” A Component is any object or group of objects that you intend to use in multiple places, but want to reserve the ability to change properties across all versions of them (similar to Symbols in other applications). You could create complex screen layouts or webpages with hundreds of objects in a Frame and turn it into a Component to be shared across your team.

但不要仅仅局限于图标资产。 用Figma的话来说 ,您可以“使用整个团队可以使用的链接UI组件创建设计系统”。 组件是您打算在多个地方使用但希望保留在所有版本中更改属性的能力的任何对象或对象组(类似于其他应用程序中的Symbols)。 您可以创建复杂的屏幕布局或网页,并在一个框架中包含数百个对象,然后将其变成要在整个团队中共享的组件。

使用组件 (Using Components)

Components can be a singular line or shape, or an extremely complex set of objects in a Frame, and everywhere in-between. Components are elements that can be re-used throughout a design file or Team. Take a simple button for example. I want all the buttons in my design to be the same basic design: rounded corners, red background, text size and style, etc. So I create my first button with all the properties set how I like them.

组件可以是单一的线或形状,也可以是框架中以及两者之间无处不在的一组非常复杂的对象。 组件是可以在整个设计文件或团队中重复使用的元素。 以一个简单的按钮为例。 我希望设计中的所有按钮都具有相同的基本设计:圆角,红色背景,文本大小和样式等。因此,我使用所有属性设置了我喜欢它们的方式来创建我的第一个按钮。

Then I make a Component out of my first button. You can select any object then click the Component button at the top of the Figma interface, use macOS keyboard shortcut: option + command + K, or right-click the object and select “Create Component.”

然后,我用第一个按钮创建一个组件。 您可以选择任何对象,然后单击Figma界面顶部的Component按钮,使用macOS键盘快捷键:option + command + K,或右键单击该对象并选择“ Create Component”。

To create more buttons, I duplicate the new button Component or drag a new copy out of the File Components list in the left-hand panel. These new buttons are called Instances, and they all reference and retain the properties of the Component they were created from, as known as the Master Component. If I adjust the color or typeface in the Master Component button, all the Instances in my file will update to match, instantly.

要创建更多按钮,请复制新按钮Component或将新副本从左侧面板的File Components列表中拖出。 这些新按钮称为实例,它们都引用并保留了创建它们的组件的属性,即主组件。 如果在“主组件”按钮中调整了颜色或字体,则文件中的所有实例将立即更新以匹配。

I used Components in an open-source presentation template, setting up the slide titles as a Component and Instances of that Component. Now, when I need to customize a new presentation with a different typeface and color palette, it takes seconds.

我在开放源代码演示模板中使用了组件,将幻灯片标题设置为组件和该组件的实例。 现在,当我需要使用不同的字体和调色板来自定义新的演示文稿时,只需几秒钟。

Anyone with access to the file can make changes to the Components too. Sharing a file with a copy editor, for example, allows them to update the text in a Master Component and have their copy changes flow through all the Instances.

有权访问该文件的任何人都可以更改组件。 例如,与副本编辑器共享文件,使他们可以更新主组件中的文本,并使副本更改流经所有实例。

Using Components within a file already felt like magic to me, and has always been a huge time saver as a file grows with more Frames and Instances. But the real magic lies in using Components across multiple files, thanks to the Team Library.

在文件中使用组件对我来说已经很神奇了,并且随着文件数量的增加和帧数的增加,向来节省大量时间。 但是,真正的魔力在于借助团队库,可以跨多个文件使用组件。

If I take a button Component, and publish it to the Team Library, then anyone on my team can access it and use it within their files, and any new files created in the Team have access to it as well. That means designers can immediately start building; using foundational Components from our design system.

如果我使用按钮Component并将其发布到团队库,则团队中的任何人都可以访问它并在其文件中使用它,并且在团队中创建的任何新文件也都可以访问它。 这意味着设计师可以立即开始构建。 使用我们设计系统中的基础组件。

As time goes on, the button properties may need to be adjusted. Returning to the Master Component of that button, by right-clicking an Instance of it or the Component itself in the Team Library panel, and adjusting it’s color, for example, notifies every file containing an Instance that there is an update available. A blue notification dot appears on the File Components list icon at the base of the left-hand panel. A “Publish changes” button at the top of the Component List leads to a modal to confirm the changes. Once changes are published to the Team Library, any file that uses an Instance of that Component will receive a notification in the bottom right corner to review the update(s). Clicking “Review” allows you to see what was changed, by who, and when. Once accepted, the Instance(s) in your file will update immediately to conform to the master Component. And you can choose not to accept those changes and your file’s Instances will remain unchanged.

随着时间的流逝,可能需要调整按钮属性。 例如,通过右键单击按钮的实例或“团队库”面板中的组件本身并调整其颜色,返回该按钮的主组件,以通知包含该实例的每个文件有可用的更新。 一个蓝色的通知点出现在左侧面板底部的“文件组件”列表图标上。 组件列表顶部的“发布更改”按钮将导致一个模版,以确认更改。 将更改发布到团队库后,使用该组件实例的任何文件都将在右下角收到一条通知,以检查更新。 单击“查看”可以查看更改的内容,更改的对象和时间。 接受后,文件中的实例将立即更新以符合主组件的要求。 而且,您可以选择不接受这些更改,并且文件的实例将保持不变。

选择文件组件并将其发布到团队库 (Selecting and publishing File Components to Team Library)

  1. Select object, group, or frame选择对象,组或框架
  2. Click the Component button at the top of the Figma interface, use macOS keyboard shortcut: option + command + K, or right-click object and select “Create Component”单击Figma界面顶部的Component按钮,使用macOS键盘快捷键:Option + Command + K,或右键单击对象并选择“ Create Component”
  3. Switch to the Component tab by selecting the toggle at the base of the Layer List, or use macOS keyboard shortcut: alt + 2通过选择“图层列表”底部的切换按钮来切换到“组件”选项卡,或使用macOS键盘快捷键:alt + 2
  4. Right-click Components to add them to the Team Library, or use “Publish file to library” below your Component list to push all Components in this file to the Team Library

    右键单击“组件”以将它们添加到团队库中,或使用“组件”列表下方的“将文件发布到库中”将该文件中的所有组件推送到团队库中

  5. Switch to the Team Library tab by selecting the toggle at the base of the panel, or use macOS keyboard shortcut: alt + 3通过选择面板底部的切换按钮切换到“团队库”选项卡,或使用macOS键盘快捷键:alt + 3

Now you can search or navigate to any Component that has been published in your Team, by any contributor.

现在,您可以搜索或导航到任何贡献者在团队中发布的任何组件。

To place an Instance of a Component into your file: Drag from the Team Library panel into any file. That Instance continues to be attached to the Master Component from whichever file in your Team it originates (And it could be from another member of your team), unless you right-click and select “Detach Instance” (macOS keyboard shortcut: option + command + B)

要将组件实例放置到文件中:从“团队库”面板拖到任何文件中。 除非您右键单击并选择“ Detach Instance”(macOS键盘快捷键:option + command),否则该实例将继续从其团队中的任何文件(可能来自您团队的其他成员)连接到主组件。 + B)

You can also add a description to your Components, visible in the Team Library to add additional context for your team. Select to the Master Component and add a description in the right-hand panel. The descriptions appear on hover in the Component List and in the Team Library.

您还可以在“组件库”中为组件添加说明,以为团队添加其他上下文。 选择“主组件”,然后在右侧面板中添加描述。 这些说明会出现在悬停在“组件列表”和“团队库”中。

Read even more about Components here:

在此处阅读有关组件的更多信息:

Components in FigmaToday we are excited to release Components in Figma. By bringing concepts like composition, inheritance and unlimited…blog.figma.com

在FIGMA组件 今天我们很高兴能释放组件在FIGMA。 通过引入组成,继承和无限等概念…… blog.figma.com

专家提示 (Pro tip)

You can set the background of a Component tile in the Component List and Team Library by setting a Frame behind the component and changing its color. This is really handy with lighter Components, like white or grey icons.

通过在组件后面设置框架并更改其颜色,可以在“组件列表”和“团队库”中设置“组件”磁贴的背景。 轻巧的组件(例如白色或灰色图标)确实非常方便。

Huge thanks to the team at Figma! Who keep building incredible features like this, and have the fastest release cycle I’ve ever seen.

非常感谢Figma的团队! 谁会继续构建此类令人难以置信的功能,并拥有我见过的最快的发布周期 。

There are already 464 Components in Square’s Team Library!

Square的团队库中已经有464个组件!

Disclaimer: You may have found this post through advertising on Twitter or Facebook. Figma didn’t sponsor the writing of this post, and are advertising with my permission as they also thought it was helpful for other designers.

免责声明:您可能已经在Twitter或Facebook上通过广告找到了此帖子。 Figma没有赞助这篇文章的写作,并且在我的允许下做广告,因为他们也认为这对其他设计师有帮助。

翻译自: https://www.freecodecamp.org/news/figmas-reimagined-team-library-fa027053c303/

figma下载

figma下载_Figma重新构想的团队库相关推荐

  1. figma下载_Figma的自动版式实用

    figma下载 Figma's Auto Layout has been around for a while, but not everyone's aware of the benefits it ...

  2. figma下载_Figma中的高级图像处理

    figma下载 Figma is not exactly suited for image manipulation, and that's completely fine. While it doe ...

  3. figma下载_Figma中的动态内容和颜色

    figma下载 First off, why use dynamic data? 首先,为什么要使用动态数据? It's easy to create and manage long lists of ...

  4. figma下载_Figma和ProtoPie中的原型制作,比较

    figma下载 第1部分 (Part 1) Prototyping has never had such a high profile with a whole host of tools that ...

  5. figma下载_素描vs Figma困境

    figma下载 I distinctly remember how much hatred I had in my heart when I lived through my first UI upd ...

  6. figma下载_在Figma中进行原型制作的技巧和窍门

    figma下载 自定义过渡和微交互 (Custom transitions and micro-interactions) Yep, I know that there are a lot of us ...

  7. figma下载_迁移至Figma

    figma下载 Being an intuitive and user-friendly tool and having the possibility of real-time collaborat ...

  8. figma下载_切换到Figma并在其中工作不必是火箭科学,这就是为什么

    figma下载 We have seen Elon Musk and SpaceX making Rocket Science look like a child's play. In the sam ...

  9. figma下载_最佳的免费Figma资源:模板,图标,UI工具包等

    figma下载 Figma在2016年成为强大的新参与者,允许设计和软件开发团队在任何平台上进行协作. 这个基于浏览器的应用程序消除了诸如更新软件,同步屏幕以及等待团队成员上载最新设计之类的问题. 实 ...

最新文章

  1. ×××作,不知写些什么
  2. (C++)1046 Shortest Distance
  3. 汇编中的字符串操作指令
  4. 农民丰收节交易英德海奇组委会议-陈业海:功能农业大健康
  5. SAP 中国本地化内容汇总
  6. STM32开发 -- Systick定时器
  7. eBay再度问路中国
  8. mysql 重置更新祖级字段
  9. Optional.isEmpty()在JDK 11 EA构建中可用
  10. 结构型设计模式在公司项目中的运用实践
  11. debian下apr-get isntall 出错提示用apt-get -f install问题
  12. CCNA学习指南第四章
  13. 易语言c编译,易语言命令行编译工具免费版下载_易语言命令行编译工具最新版下载_3DM软件...
  14. mysql的etl工具是什么意思_数据同步工具ETL、ELT傻傻分不清楚?3分钟看懂两者区别...
  15. 常用的网络进行广告推广的落实措施都有哪些渠道呢
  16. 数据分析_Pandas基础练习题9道(附数据)
  17. 压力测试/性能测试工具LoadRunner录制脚本详细步骤(一)
  18. 坐标系标定与位姿估计(旋转矩阵)
  19. UNI-APP开发工具与环境
  20. react中使用simditor富文本编辑器

热门文章

  1. python的pwntools工具的日常使用
  2. Bootstrap系列 -- 32. 按钮垂直分组
  3. How to adjust OOM score for a process?
  4. CLR 与 C++的常用类型转换笔记
  5. centos7系统根目录扩容
  6. 一个小菜鸟给未来的菜鸟们的一丢丢建议
  7. Go语言开发环境配置
  8. 基于Netty的百万级推送服务设计要点
  9. 一张图看懂云栖大会·上海峰会重磅产品发布
  10. zooland 新开源的RPC项目,希望大家在开发的微服务的时候多一种选择,让微服务开发简单,并且容易上手。...