10个提示与范例，告诉你什么是现代UI设计

你可能无法一一列出符合现代用户界面或者网站设计所谓美感的要素或元素，但是当你登录一个实际的用户界面的时候，你一定知道它是不是符合现代的视觉要求，因为在感觉上，对于过时的印象有时已经成为了一种习惯。

现代UI设计有助于建立网站设计或品牌的可信度，因为它具有符合当前大多数人视觉美学的风格。 这可能包括视觉趋势，适应可用性标准和模式以及使用适合当今用户的开发技术。

在这里，我们将研究在接下来设计符合现代用户界面你需要注意的一些元素。 希望这些例子中的大多数在你看来都是熟悉的，但是如果没有，也许是时候计划为你的项目带来一些新的风格了。

1.一致性（Consistency）



一致的用户界面易于使用和理解。 人们不必费心思考如何与你的网站设计进行互动，从而使它更易于使用。

最好以两种方式考虑一致性。

首先，你会希望你所设计的界面从一台设备到另一台设备在外观和行为上保持一致（这就是为什么响应式设计如此重要的原因）。

其次，设计中的元素彼此保持一致（例如，具有相同颜色，大小和相同位置的按钮）并遵循通用的使用模式，这种类型的设计一致性使你的界面现代且具有更好的可用性基础。

总体来说保持UI一致性很重要，因为：

· 它可以减少学习时间：一致性限制了操作和展示方式的数量，从而确保用户不必为每个项学习新的表示方式。

· 它可以消除混乱：用户倾向于将自己经历过的规则应用到你的网站设计或产品中，从而带来符合最开始自己的期望。 知道这一点，我们应该谨记，当我们偏离设计标准时，是否会引起混乱和陌生感。

2.渐变和深度（Gradients and Depth）



现代界面使用颜色来创造深度并帮助人们了解如何与设计交互。

渐变和微妙的阴影是流行的技术。 渐变色的使用非常新潮，并提供了有趣的视觉效果来吸引注意力。 最合适的阴影应该是看起来并不明显，但是可以将元素从背景中移开以鼓励互动。

3.有目的的使用动画（Purposeful Animation）



在网站设计方面，动画几乎无处不在，因此，不要过度使用此技术就显得尤为重要。

现代的视觉设计仅在有需要的情况下才对元素进行动画处理。 有目的的动画可以帮助用户单击按钮，提供导航提示，提供指导或充当简单的令人愉悦的视觉功能。

为了确保你的网站动画有目的且不是纯粹的装饰，请考虑动画元素的目标及其在整体网页设计中的作用。

4.易于阅读的文字大小（Easy to Read Font Sizes）



你可能已经注意到，正文的默认字体大小一直在缓慢增加。 这是一个不容忽视的趋势，相信有很多浏览者会因此而感激你的。

小号，或者几乎难以辨认的字体大小是你在考虑你的用户界面是否过时的第一件事。 人们已经习惯了更大，更易读的字体。

所以，在你的网站设计上使用14点到16点的正文字号。 虽然一开始看起来可能很大，但此大小更令人赏心悦目，以可读的大小转换为移动屏幕，并已成为相当标准的一个规范（请不要忘记也将行距调整为适当的大小）。

5.语音界面（Voice Interfaces）

你的网站上是否有设计方便用户在进行语音交流以更加容易找到信息的功能？ 交互式语音界面可能是用户界面设计中增长最快的部分之一。

你可以以一种使语音界面和人们更容易访问你的内容的方式来进行网站设计和功能开发。 通过提问和回答的方式来解决常见问题，提供有价值的信息，使用示例创建意图，并在界面侦听时使用视觉反馈。

6.无缝互动（Seamless Interaction）



网站互动必须在一台设备上以及从一台设备到另一台设备之间都是无缝的。

用户在页面之间移动时希望获得相同的体验。 他们还希望网页设计在其台式计算机和移动端上具有相同的外观和行为。

所有现代用户界面均遵循这些准则。 如果你的网站目前并不支持，则需要立即重新考虑你的网站并立即进行规划。

7.智能表单/输入（Smart Forms/Inputs）



要求用户录入太多信息的大规模在线表单的时代已经一去不复返了。 现代界面更多的使用简短的表单，尊重每个用户的时间，仅询问少量用户最常用的信息所需的内容。

现代界面使用智能表格和输入。 这意味着只要求你填写必要的信息并验证数据。 后者在小型设备上更为如此重要，因为它很容易输错字并产生错误； 数据验证可立即告诉用户出了什么问题，并在以后的工作中避免这样的情况。

8.安全性及可靠性（Secure and Trustworthy）



这个几乎不用多说什么，你的网站必须安全可靠。

尤其是对于购物或者涉及个人隐私问题的网站，用户在购物和浏览时经常会寻找地址栏是否有安全锁标识，所以你必须使用SSL和HTTPS，2010年的时候就是如此。

9.可定制和个性化（Customizable and Personalized）



更多界面为用户提供了更多可定制的个性化服务。

通常，包括使用能够确定用户位置的语言和货币支持工具，保存购物车几天的cookie或允许用户创建更多个人体验的登录名。

定制和个性化成为差异化的要点，这将帮助人们在选择时优先选择你的网站。 这些小细节可以带来很大的不同。

10.更新迭代（Evolving）



你必须拥有一个可以随时间以及趋势变化而做出响应的设计。

我们曾经说过，你每三到五年需要一个新的网站设计。 现在你可能每6个月左右就需要对网站进行一次调整，以保持新鲜感和相关性（你会感叹技术发展如此之快）。

从较小的设计更改到可用性更新，请务必注意你在其他网站上看到的内容，并思考这些更改和改进如何对你有利。

总结

乍一看，创建现代UI主要是研究用户行为和模式以及影响用户行为和模式的设计选择。

趋势和现代界面设计之间有一条很好的界限。 后者往往会停留更长的时间，并且更多地植根于功能和可用性上，而前者主要是美观。

从心态开始，网页设计总是在变化。 然后考虑积极并且能够令人难忘的Web体验，并在将来对界面进行修订时考虑这些技术。