设计及技术指引

实现设计系统目标的指南

好的设计是公司或产品成功的核心. 无论您的用户是购买炊具的人还是内部客户支持代表, 每个使用数字产品的人都希望它看起来很棒,功能很好.

但即使你有一个伟大的设计, 通常会削弱设计成功的是它执行的一致性. 创造与预先建立的设计相一致的新内容或产品可能很费力, 耗费时间的, 而且它看起来可能还是不太对.

输入, 设计系统.

 

准备好构建和改进您的设计系统?
两个人在会议室里一起博彩网站评级

什么是设计系统?

设计系统将风格指南(针对设计人员)和模式库(针对开发人员)的优点结合在一起, 面向所有人的内聚数据库.

设计系统由UI库、店面和操作组成. 稍后我们将更详细地介绍这些components.

  • UI库包括设计人员和开发人员的样式、模式和文档.
  • 店面是任何人都可以访问设计系统信息的位置.
  • 操作提供了管理设计系统的创建和持续发展所需的指导和工具.

设计系统的目标是使产品团队保持一致,并促进开发和设计之间的协作. 虽然设计系统对你的团队来说是一笔巨大的财富, 随着系统的发展,它需要维护和治理才能最有效.

在你的设计生涯中,你可能会被要求修复或重新思考现有的设计系统. 会很乱的. 设计师、开发人员、产品所有者和涉众都必须参与其中,并获得相关信息. 但如果你投入博彩网站评级并坚持下去, 你会感觉自己像个冠军.

下面的步骤分解了我们在十大正规博彩网站排名建立公司的过程, 进化, 或者开发策略来维护设计系统和治理. 这是一个设计系统过程,对我们的团队和客户——各种形状和规模的项目——都很有效.

设计系统的目标和收益

一致性

正如我们前面提到的,一致性是使用设计系统的主要好处之一. 通过为设计人员和开发人员提供一个集中的数据库, 字体, 颜色, 随着你的成长,代码保持一致.

协作

通过为设计和开发信息创建一个中心位置, 跨职能团队可以在整个项目中更有效地沟通和协作.

速度

所有这些一致性和协作带来了更快的速度. 使用已经商定的UIcomponents和元素, 您的团队可以快速轻松地构建新设计.

设计系统的三个主要组成部分

设计系统的组成部分
Shawn Hickman,设计经理

UI库

UI库是一组样式, components, 以及设计人员和开发人员用来创建产品用户界面的模式.

它包含:

  • Sk等h和Figma库
  • 带有编码components的故事书
  • 文档

 

店面

店面是设计系统的唯一真实来源. 这是任何采用者(设计师,开发人员等).)可以访问使用系统所需的过程、文档和工具.

它包含:

  • 文档
  • 资产和文件

 

操作

运营是设计系统的管理和演变. 它是为成功的系统提供动力的幕后博彩网站评级,并定义了人们如何做出贡献, 得到支持, 保持与时俱进, 和更多的.


什么是设计系统治理?

当我们为您的团队和文化量身定制设计系统治理模型时, 我们正在创建一个设计系统层次结构. 这包括以下细节:

  • 决策: 谁拥有最终权力
  • 贡献: 谁可以对设计系统进行添加和更改
  • 增强功能和博彩网站评级流程: 谁来执行设计系统?他们是如何执行的

如何创建新的或改进现有的设计系统

设计系统不仅仅是一个UI库——它们是团队需要扩展的基础设施. 具有集中定位和良好定义的过程, 文档, 并且工具使您的团队能够以更大的信心和更高的质量发布产品. 团队练习有助于理解您的设计系统目标,并让每个人都达成一致. 以下是步骤 创造和改进 你的设计系统和设计系统过程. 如果你没有一个当前的设计系统,并且从头开始, 专注于创建设计系统清单, 审计, 或者系统将服务的产品的模型.

描述创建设计系统的步骤的说明性模型
Sarah Kula营销设计师的插图

1. 从设计系统清单开始

首先,花时间在现有的设计系统中识别和分类模式.

  • 狩猎和采集 -浏览应用程序的每个屏幕,并对构建界面的元素的独特实例进行截图:排版, color, 输入字段, 图解, 导航, 图片, 按钮, 等. 这些截图将帮助你在之后直观地分析所有内容.
  • 博彩网站评级快 -你应该以合理的速度捕捉事物. 把所有的判断留给设计审核.

推荐工具

 

2. 审核现有的设计系统components

在设计系统盘点期间,你们为设计审核奠定了基础. 现在是时候对收集到的样式、模式和components进行批判了. 如果四个不同的日期选择器执行相同的操作,则可以将它们合并到一个components中.

  • 分类 -把你的屏幕截图和组他们看到的元素在一起. 这将帮助您识别差异和共同点.
  • 理解 -试着弄清楚你目前所掌握的. 这些components是如何博彩网站评级的? 它们应该如何博彩网站评级??
  • 比较与对比 -查看最佳实践和文章链接. components还有什么可以做得更好的吗? 有什么规则被打破了吗?
  • 注意 -更有可能的是,你会遇到冗余. 记下可以合并的components. 展示你的作品并解释你的想法.

推荐工具

 

3. 开始设计系统建模

在你开始拆除旧的设计系统来建立新的之前, 你需要有一个计划并理解你的设计系统目标. 该计划将帮助您了解系统中应该包含哪些内容, 更重要的是, 什么应该被忽略.

  • 定义UI库对象 —基于系统库存 & 审计,编译要包含在UI库中的对象列表. 您需要考虑客户产品路线图, 前端功能, 设计, 技术债务, 等.
  • 定义设计系统治理模型 设计系统不仅仅是一个UI库. 系统治理模型涵盖了活动设计系统的细微差别和操作.
  • 定义店面 -系统 店面 作为所有系统信息的唯一真实来源:过程、指导方针、工具等. 定义店面使用什么工具,以及人们将如何为其做出贡献.
  • 与客户团队保持一致 在确定设计系统的所有部分后,与客户团队保持一致. 取决于约定, 你可能需要一个相当大的博彩网站评级时间,或者建立一个固定的博彩网站评级时间, 临时会议.

推荐工具

  • 谷歌的幻灯片 是一种记录、展示和与利益相关者分享你的计划的好方法吗.

 

4. 合作改进设计系统

设计系统不是在真空中创造或重新想象的. 是时候分享你的发现并听取意见了. 这是一个完善概念和清晰勾勒未来博彩网站评级的机会. 这些讨论应该包括涉众、开发人员和设计师. 你可以用几种方式来进行讨论:

  • 一对一的 -与设计主管一起博彩网站评级, 利益相关者, 产品负责人, 或者是另一个决策者,仔细研究库存. 保持房间里意见的数量少,可以让你在改进的过程中保持专注.
  • 把它带给团队 -与团队一起探索你的发现. 集体, 团队将有更大的知识库可供借鉴, 这将有助于调整设计清单.
  • 保持数字化 -如果你的团队很忙,见面的时间很少, 把你的清单和任何必要的解释都放到 松弛团队,或电子邮件. 这会让你的团队有时间回顾你的发现并给出反馈.

 

5. 创建设计系统

设计系统清单可以让你鸟瞰现有的设计系统. 的 设计审核 帮助您了解需要更改的内容,系统模型为您提供了一个计划. 现在,是时候开始博彩网站评级并向其他人解释新系统了.

  • 设计 -利用目前收集到的所有证据,开始对现有系统进行有意义的改变.
  • 制定规则 -你的系统是如何实现大按钮vs. 小按钮? 如何使用特定的颜色? 把它写下来,让它简单明了,这样任何设计师都可以在没有太多猜测的情况下执行系统.
  • 展示,不要说 -只要有可能,说明事情是如何博彩网站评级的. 创建图表来帮助每个人理解系统中的components是做什么的.
  • 完善 -这不是一个一次性的过程. 一定要检查现有的规则,确保它们仍然适用. 设计系统是一个会随时间变化的活文件.
  • 构建 ——通过构建新模式和调整现有模式,使制度焕发生机.

 

6. 再次与团队进行检查

现在您已经记录了您的components,是时候分享您的博彩网站评级并获得反馈了. 确保包括设计团队以外的人.

  • 达成共识 -审查文件并获得团队的批准或反馈. 如果有更改,请将其带回文档阶段并进行必要的调整.

 

7. 发布你的新设计系统

你完成了(现在)! 将最终确定的文档推送到店面. 但在此之前:

  • 再次检查你的博彩网站评级 -所有要求的更改是否已完成? 你把所有的错别字都写出来了吗? 把所有东西再检查一遍,确保尽可能干净.
  • 庆祝 -你正在朝着更完美的设计体系迈进! 每一位设计师和开发人员都会感谢你的时间和努力.

 

你准备好开始你的设计系统项目了吗?


一个设计系统的真实例子

这里是十大正规博彩网站排名,我们的设计系统, 或Think Standard Library, 是一套基本风格吗, components, 以及我们的设计师和开发人员用来创建产品用户界面的模式. 它包含了我们的设计库(包括Figma和Sk等h等工具), 带有编码components的故事书, 和文档. 这个广泛的图书馆是真相的来源,并帮助我们的内容战略家, 设计师, 开发人员的博彩网站评级效率更高.

设计系统实例
图片来源:sarah Kula营销设计师

更多用于构建和维护设计系统的资源


实施一个设计系统并简化你的设计和开发过程

具有良好定义的设计系统, 您的开发人员和产品所有者可以做出更好的设计决策——即使没有设计师在场. 正确的工具可以让你的团队做出更好的决定,比如什么时候使用模态, 使用什么类型的按钮, 或者为特定类型的数据使用哪个图表.

拥有一个维护良好的设计系统,可以比以往更容易地创建符合设计标准的内容,并使您更接近业务目标.

想要为你的产品实现一个设计系统? 与我们的专家团队聊天.

给我们寄张明信片,写封信

有兴趣和我们一起博彩网站评级?

我们对项目进行界定并组建团队,以满足您组织的独特设计和开发需求. 告诉我们你今天的项目,开始对话.

了解更多