6 个技巧和窍门 Mendix的 Atlas UI 设计系统
此 Mendix Platform 旨在帮助企业用户和开发人员在短时间内轻松构建高质量的应用程序。最新的 Platform 功能也不例外; Atlas 用户界面 是一款全面的 UI/UX 工具包,可帮助开发人员快速轻松地创建出色的设计。Atlas UI 让您可以专注于创建出色的设计,而不必浪费时间弄清楚如何实现组件。
为了成功入门,我列出了六条技巧,我认为在您首次使用 Atlas UI 时,这些技巧会对您有所帮助。
1. 把品牌放在第一位
您的品牌代表了人们与您的公司、产品或应用建立的智力和情感联系。那么,为什么不先将您的品牌融入到应用设计中呢? Mendix 主题定制器,您可以将您的品牌颜色、字体和公司徽标集成到您的应用程序设计中。

将徽标与品牌字体和独特调色板相结合,可使构建块和小部件符合您的身份,从而避免一次性的风格变化。当您开始构建应用程序时,您会感受到真正的主人翁意识,因为该应用程序反映了您公司的独特品牌。

要访问主题定制器,请点击 Mendix Web 建模器。
2. 从模板开始
我不知道你的情况,但当我的视野不清晰时,一张空白的画布有时会让我不知所措。幸运的是, Mendix 提供使用 Atlas UI 框架构建的大量模板库,以启动应用程序开发。页面模板是节省时间并激发创意的绝佳方式。每个页面模板都包含一个设计完整的用户界面,其中包含随时可用的构建块和小部件。

您的用户将花费大部分时间使用除您自己的 UI 之外的 UI(Facebook、Twitter、新闻网站等)。无需重新发明轮子。Atlas 模板(卡片、面包屑、英雄标题、汉堡菜单等)都是根据整个网络的既定模式设计的,是常见用户界面问题的解决方案。通过明智的设计决策取悦和满足您的用户,而不是让他们感到沮丧和烦恼。
3. 熟悉 Flexbox,你的新好朋友
奇怪的是,在创建网页和移动应用时,最难的事情之一就是将内容居中。水平居中相对容易,但垂直居中几乎总是很棘手。您只需谷歌一下“CSS 居中”,就能找到大量关于如何完成本应简单的任务的黑客博客,这突显了实现这一任务有多么困难。
幸好, Mendix 添加了许多令人兴奋的 flexbox 构建块:
- 弹性容器左侧
- 弹性容器左中
- 弹性容器右侧
- 弹性容器右中心
使用 Flexbox,您可以轻松通过 align-content 属性对齐任何内容(垂直或水平)。

Flexbox 还有其他优势。它非常适合移动屏幕和响应式内容,因为 Flexbox 容器中的项目可以“调整”其大小以响应可用空间。与块/内联布局模式(块是垂直的,内联是水平的)相反,它是方向无关的,这意味着您可以将内容排列在任何方向(向左、向右、向下或向上)。您也不再依赖浮动和“清除修复” 因为 Flexbox 会帮你处理所有这些。
您可以找到学习 Flexbox 的指南 开始.
4.尽可能保持并建立一致性。
整个应用的一致性归结为使事情连续、可预测且符合预期。选择构建块、页面模板和小部件非常重要,因为这对于应用维护以及更重要的是用户体验至关重要。
用户的期望越被证明是正确的,他们就越能控制系统,并且会越喜欢它。” – Jakob Nielsen
当应用程序设计保持一致时,用户可以轻松地将知识转移到新环境中。例如,使用绿色表示“保存按钮”将绿色与“保存”动作。用户无需付出认知努力,便可知道在整个应用程序中看到绿色按钮时将发生的 UI 交互。建立类似上述示例的模式可简化应用程序的开发和可用性。
5. 使用设计元素作为创意跳板
之前,我提到了 Atlas UI 模板如何帮助快速启动应用程序开发。然而,Atlas UI 不仅仅是预先打包的页面模板、构建块和小部件。所提供的组件是实现您自己的企业设计语言的跳板。

下载 Atlas UI 参考应用程序 来自 Mendix App Store。从那里开始自定义预配置的 Atlas UI 构建块、页面模板和小部件,然后着手构建自己的。通过投资企业设计语言,您将在整个应用程序组合和整个团队中提供一套统一的用户体验和设计规则,从而加快从设计到开发的过渡。
6.实验
了解什么可行、什么不可行的唯一方法就是进行实验。Web Modeler 的所见即所得界面是促进实验的绝佳工具,因为您可以通过更改构建块和小部件,或调整现有设计元素的设计属性,轻松创造新想法。您对 Atlas UI 的实验越多,您就会越快了解哪些 UX/UI 元素可以增强参与度,哪些元素会导致沮丧或放弃。
工作时使用 Atlas UI 应用程序
新发布的 Atlas UI 移动应用程序可让您在手机上浏览所有页面模板、构建块和小部件。无论您身在何处,都可以探索 Atlas UI 解决方案。您甚至可以在建模时使用它,这样您就不必不断导航回浏览器。

现在继续使用 Atlas UI 制作一些令人惊奇的东西。 下载 Mendix 移动应用程序 寻找灵感。
