软件工程师需要设计系统构建具有良好用户体验的产品

快速构建数字产品有效的用户体验设计,软件工程的领导人必须利用促进重用和装配设计系统。

许多现代产品团队继续从头创建最初的用户体验设计和工艺数字体验。在这一过程中,他们忽视使用现有的和经过验证的设计模式的优点导致可怜的可用性,视觉和行为的不一致,以及设计周期较长。提高整体用户体验质量,软件工程的领导人应该部署一个设计系统——一组可重用的设计资产和表示层代码组件是由明确的标准来构建各种数码产品。

“一个设计系统是一个为贵公司最重要的战略资产。这是一个活生生的数码产品,需要一个团队,一个计划和一组专门的工具,”说布伦特·斯图尔特Gartner分析师,高级主管。

立即下载:提高软件质量通过构建数字免疫力

设计系统增加什么价值?

设计系统创建一个“事实的唯一版本”——中央设计语言为用户体验设计师,让他们制定一致的用户体验多样化的团队,渠道和平台。设计系统的价值包括:

  • 速度:它大大减少了设计和编码时间利用的尝试和测试用户体验设计模式而不是从头创建所有。
  • 规模:它允许设计人员和开发人员共同批准设计整个投资组合资产和代码组件的数码产品。
  • 品牌合规:它确保每个设计资产与一个组织的品牌特征如颜色、标志、排版、语音、语调,等等。
  • 减少缺陷:随着时间的推移,设计系统的代码组件成为“硬化”,生产缺陷罕见的表示层。

设计系统是什么?

理想的设计系统包括设计令牌,可定制的用户体验设计模式,有效地提供生产就绪代码和指令高性能的数码产品。这里的四个组件是一个设计系统:

设计系统的组件

风格资产

视觉,书面和行为属性标志、颜色、图像、排版,语音或语调来风格的伞下的资产。

先进设计系统使用设计令牌集中管理的颜色、文本风格,图标和更多。设计令牌是平台无关的实体商店设计变量和使用硬编码的值,如像素或十六进制值保持UI和UX设计系统规模时的一致性。

结构性资产

结构性资产是一个组装的用户体验设计元素(特定的按钮,页面模板等)用于创建用户友好的屏幕设计,更短的周转时间。

原子设计方法是一种最受欢迎的方法来描述的层次结构性资产。这是一个一般分类:

  • 原子:原子是一个用户界面的基本单位。一个表单字段,一个下拉菜单,按钮或图标都是原子。
  • 分子:分子是一个小组的UI元素的函数在一起作为一个单元,一个集群的几个原子。表单字段的集合或一个相关的提交按钮可以是一个很好的例子的一个分子。
  • 生物:有机体是一个更复杂的用户体验设计层次结构中的实体——一个聚合的分子和原子。生物的例子包括实用导航、全球导航、英雄空间和页脚。
  • 模板:一个模板是一个可重用的框架或设计布局形成的聚合原子,分子和生物。标准模板包括首页、产品列表页面、产品细节页面和购物车。
  • 页:一个页面是一个全面发展和优化版本的模板。当模板是富含占位符或实际内容,如文本、图像或广告单元,它变成了一个页面。

代码组件

代码组件是一个库存的生产就绪代码选择框架。他们被组织利用原子层次设计方法。每个设计原子,分子,生物和模板有一个关联的代码组件匹配。先进的设计系统标记代码组件更新的颜色,字体,间距,等等,以集中的方式。

标准

可执行的指导原则,使用指南和治理策略应该以创建高效的设计系统。

指导原则确保设计资产和代码组件模块化、可组合、通用、灵活和可访问。使用指南包括规则与排版,颜色,尺寸和间距,语法、纵横比、写作风格等。

治理策略是必要的,以维持给定的标准。而不是实现传统的IT治理模型,软件工程的领导人可以使用wiki形式的方法。它能给贡献者的自由创建、更新和删除风格资产,资产结构和代码组件在临时的基础上,允许产品团队提高设计系统“动态”。

保持设计系统的可信度,领导团队可以查看添加,编辑和删除大量释放,除了他们的季度评估。

利用现有的用户体验设计系统

多年来,各种基于平台的开源设计系统已经启动,确保高性能的用户体验。主要平台上构建应用程序,这是强烈建议尽可能重新利用这些现有的设计系统。设计资产和代码组件在这些系统中得到了广泛的支持对用户体验的研究在产品类别,如客户关系管理(CRM)和企业资源规划(ERP)。

为设计系统分配一个团队

对待你的设计系统作为数字产品通过建立领导组成的产品负责人,UX领导和发展。

三个领导可以改善操作的设计系统,设计和技术指导。团队可以也有贡献者,如用户体验设计师,内容战略家,前端开发人员和可访问性专家来处理每个版本的设计系统。

经验应用会议

加入你的同行在Gartner会议上公布的最新见解。

Gartner使用< / >和< a href = " / en /关于/政策/隐私”目标= "平等" >隐私政策。< / > < / p >"> 登录到您的帐户< / >,访问你的研究和工具。< / p >" class="eloqua-text"> 登录到您的帐户< / >,访问你的研究和工具。< / p >" class="optin-text">
Baidu