构建应用:我们从设计一致性和可扩展性中学到的3件事

构建应用程序

设计的一致性对于提供良好的用户体验至关重要:它减少学习,消除困惑,以便更好地与产品交互。我们都同意一致性对终端用户很重要,但它也对内部很重要,特别是当你与一个网页设计师或工程师团队一起工作时,他们都专注于同一产品。

POWr在美国,我们专注于开发应用程序。对我们来说,可扩展和一致设计的问题很早就显现出来了,当我们的库迅速增长到包括50个不同的应用程序

问题是从内部开始的,不同OB欧宝娱乐APP工程师的设计结果会不同。工程师和设计师主观地看待每个产品。这导致了分散的设计和缺乏一致性,不仅延伸到应用本身,还延伸到网站、电子邮件设计、用户仪表盘等。

除了保持一致性,我们还发现工程师们经常以不同的方式重建相同的东西。这使设计上的差异永久化,并影响了生产力。对于一个小团队和许多插件,确保每个人都在有效地利用他们的时间,而不是重复他们自己是很重要的。

我们知道,提供一致的产品设计和用户体验对于建立成功的应用业务至关重要。很明显,我们需要一个真相的来源,一个单一的设计过程,让我们能够持续地进行建设。我们还需要确保我们没有在代码库中重复自己。保持代码基的整洁和避免重复是过程的一部分,不应该被忽视。

我们有自己的目标,但实现它们是另一个挑战。以下是我们在创建可伸缩设计过程中学到的三件事:

通过Shopify合作伙伴计划发展您的业务

无论您是提供市场营销、定制服务,还是ob欧宝娱乐app下载地址网页设计和开发服务,Shopify合作伙伴计划都将为您的成功奠定基础。免费加入并获得收入分享机会,工具来发展您的业务,和一个充满激情的商业社区。

报名

1.知道你的品牌

构建应用程序:品牌

构建一致设计的第一步是知道自己是一个什么样的品牌以及如何在视觉上表现自己。这不是几个人可以单独决定的事情。把各个部门的代表聚集在一起,通过一些活动来定义你的品牌简单的练习.你需要知道:

  • 你的公司重视什么
  • 如何呈现这些价值
  • 传达你的价值观的语气
  • 你的品牌的个性

你的下一步是将其转化为设计。仔细查看您的产品界面。当您这样做时,您可能会发现在颜色、按钮样式、边界半径、阴影等方面存在差异。这些不一致会损害你的品牌认知度和用户体验。

你需要定义符合品牌个性的视觉语言-包括形状、图标、字体和颜色。一旦定义了这一点,您还可以确定在您的设计和工程过程中在哪些方面可以更有效。

2.确定你可以精简的地方

构建应用程序:简化

这部分可能很耗时间,但你会得到回报的。对于这一步,与您的工程师和开发人员交谈是很重要的。您的目标是确定在产品设计和用户体验中至关重要的组件,以及您最常重用或重建的组件。

一旦你找到了这些元素,你就会想要让它们尽可能独立。这意味着它们可以被放置在任何地方,在任何情况下,并按预期行为。如果您重用相同的组件,这也将减少您花在QA测试上的时间。

如果你正在使用CSS预处理器,如SASS或LESS,将颜色、边界半径和排版等属性设置为变量或mixins。这将使您的代码库更具可维护性,因为这些变量可以重用。如果需要发生任何更改或更新,例如颜色更改,您只需要更新一个变量,而不是在所有应用它的地方更新十六进制代码。这意味着通过使用已经设计好的样式和组件来编写更少的代码,并在前端代码上花费更少的时间。

采取这些步骤将使您的团队更加高效,并减少许多乏味的任务和重复。您将在所有工程团队的输出中看到更好的一致性。

3.写下你的真相来源

开发应用程序:真相之源

我们已经谈到了保持代码库的可维护性,但是为了确保这一点,您需要编写使用规则。如果你不这样做,你会发现不是每个人都遵守规则。它将影响您的代码、产品、品牌识别和用户体验。为了解决这个问题,您可以创建一个真相源—一个包含所有规则的文档,以保持设计的一致性。

创建这个文档的第一步是标准化元素和组件的命名约定。选择一种命名方法,例如SMACSS,或允许.你甚至可以使用所有这些方法的组合,这取决于哪种方法最适合你的业务。无论你做什么决定,一定要坚持下去。

第二,定义如何使用组件的指导方针。你知道你喜欢下拉菜单还是单选按钮,什么时候使用情态动词,在哪里放置通知,或者什么时候使用切换吗?这将消除模糊性,并允许客观地看待设计。

第三,保持这些组件模块化。在我们的组织中,我们一次又一次地遇到冲突的CSS。保持组件模块化有助于保持CSS的整洁和有组织。

你可能还会喜欢:为什么商品是下一个重要的游戏盈利策略以及你该如何参与其中。

让你的用户体验保持最佳状态,让你的工程团队走上正轨

设计系统允许你保持设计和体验的一致性,这为更无缝的用户体验铺平了道路。在内部,它通过提供易于遵循的指导方针和可重用的组件,帮助设计、工程和开发团队提高工作效率,允许他们更快地进行新的设计或构建。从本质上说,它提供了构建拼图所需的碎片。

没有必要每次在你的产品和/或网站上添加一些东西时都重新发明轮子。

没有必要每次在你的产品和/或网站上添加一些东西时都重新发明轮子。因为我们做了这些改变,结果在我们整个插件库的设计中是可见的。这带来了更清晰的代码库,更高效的设计人员和工程师,以及更敏捷的产品开发过程。如果有一件事从所有这些,那就是投入时间创建一个设计过程和指导方针。相信我们,这是值得的。

在过去的几个月里你学到了什么?请在下面的评论中与我们分享你的经验教训!

主题:

通过Shopify合作伙伴计划发展您的业务

了解更多