更多课程 选择中心


UI培训

400-111-8989

达内UI培训:简约之道 - 最小化界面设计的起源


达内UI培训:简约之道 - 最小化界面设计的起源

最小化设计的目标是移除界面当中不必要的元素或内容,减少干扰,使界面最大程度的支持用户的任务流程。

界面设计,就像人类的语言一样,最终是由人们的使用方式所定义的。如今,虽然“最小化”和“极简”的概念时常被人们抛出,但我们还是无法精确的、量化的去定义具体是哪些功能特性构成了最小化界面。为了更加清晰的对概念进行解构,我们对112个带有明显最小化风格的网站进行了分析。

对于我们所研究的112个最小化风格的网站,如果某个特征出现在超过75%的样本当中,我们就将其定义为最小化界面设计的基本组成要素。

扁平化的材质

过去几年间,界面设计领域当中最为巨大的变化当属拟物化风格向不带有任何实物隐喻的数字化表现形式的转变。扁平化风格通常不使用任何高光、阴影、渐变和材质来使界面元素带有三维质感效果。

有些设计师相信扁平化风格正是最小化界面设计理念的直接体现:移除了各种不必要的、装饰性的视觉效果,使界面最大程度的支持内容本身的呈现。我们通常所说的扁平化设计泛指一种界面元素的视觉风格,而最小化设计则涉及到内容和功能层面。一个采用了扁平化视觉风格的界面未必是最小化的:

总体上讲,扁平化风格非常容易被误用,而且很可能对产品体验造成负面影响。如今扁平化极度流行的设计趋势使其几乎成为最小化设计的代名词,这并不是一个好现象。

少量配色或单色方案

在多数的最小化风格界面中,极简的配色方案都是策略性的被用来在不增加额外元素的情况下创建视觉吸引。界面当中的视觉干扰较少,色彩更容易被注意到,对内容和功能的影响力更强。

极简的配色方案可以说是针对2000年前后混乱聒噪的网页设计风格的回敬。极度克制的配色方案最大程度的避免了界面本身对内容的干扰,不过在内容图片的使用方面,色彩通常会更艳丽。我们在进行评估时,考量的元素包括背景色、logo、导航菜单、图标和字色,而不包括内容图片。

很多极简主义的界面设计师会采用单色方案,最多再为界面中的重要元素另取一种颜色。所谓重要元素,通常是指比较重要的交互元素。

相比于十多年前的混乱,如今极简的配色策略可以说是一种进步,但在使用时仍有一些重要的问题需要考虑:

  • 确保你的配色方案具有足够的对比度,使内容具有最基本的可读性,另外要考虑到色弱和色盲用户。

  • 关键色的使用要有明确的目的,例如突显重要信息或交互元素,并注意维持全局的统一性,用途保持一致。

功能与界面元素的约束

准备尝试最小化策略的设计师必须对界面当中的每一个元素进行分析,然后移除那些对核心功能或信息没有直接支持作用的元素。所谓“元素”,包括(但不限于):

  • 导航菜单项

  • 链接

  • 图片

  • 图形元素

  • 分隔线

  • 标题文案

  • 材质纹理,包括高光、阴影、渐变等效果

  • 颜色

  • 字体

  • 图标

实际上,我们很难对界面当中是否还包含“不必要”的元素进行准确的评估,除非直接向设计师本人询问,并了解他们的产品特性及目标用户群体。为了使这一特征更易考量,我们重点关注界面当中是否存在不具任何实质目的性的视觉元素。在我们的样本中,有87%的界面明显移除了所有的不必要元素。

界面中的元素越多,用户头脑中需要处理的信息就越多。极简主义设计师们时常念叨的一句话就是“持续减法,直到无可再减”,意思就是除非缺失某样东西会导致问题的出现,否则就干掉它。

不过,设计师们往往容易过分追求简约、现代、最小化的视觉外观,致使有实际用途的元素被错误的移除。元素混乱、信息过载的界面固然难以理解,但过分简化以至于缺失必要信息的产品则更容易让人茫然无措。

超大的留白比例

有意识的将界面当中的干扰元素移除,势必会导致负空间比例的增大。

留白(负空间)曾被认为是最小化界面的同义词,很多设计师将留白作为一种引导用户关注重要内容的手段,帮助他们更好的理解信息结构。

留白并非空无一物,比例得当的负空间除了可以为界面赋予呼吸感以外,确实还能起到有效的引导作用。在考虑留白的使用时,要关注以下几方面的问题:

  • 增加或减少留白之后,界面信息层级的展现方式是否会受到影响?

  • 留白的使用是否会影响到界面上方信息的展示?虽然备受争议,但“折线以上”的原则在很多界面环境中依然适用,用户在进行交互行为之前最容易关注到的仍然是首屏区域当中的内容,不要让留白对这里的重要信息产生破坏作用。

  • 留白的使用是否会影响到交互成本?用户是否需要付出更高的成本才能获取信息?

  • 留白的比例是否需要根据不同的浏览环境进行响应式的调整?

夸张的字体运用

和字色相仿,当界面里仅有为数不多的元素时,加粗加大的字体也能成为沟通重要信息的手段。恰当有效的字体运用不但可以使最小化风格的界面更具视觉吸引力,而且可以弥补其他类型元素的匮乏所导致的视觉失衡问题。

字号、粗细、字形风格等等的变化搭配对于帮助用户在最小化界面中理解信息层次也起着重要的作用。在我们研究的112个样本当中,75%的界面通过夸张的字体运用方式来传达信息,制造视觉张力。

对于定制化程度比较高的字体,使用图片代替文本是一种常规做法,代价则是降低了界面的加载速度,并且需要考虑不同分辨率下的尺寸问题。使用在线字体(web font)也是一种方式,但同样要考虑性能方面的问题。

其他组成要素

以下这些设计要素也是很多设计师乐于运用的。不过由于它们在样本当中的使用比例相对较低,所以我们不会将其定义为最小化界面设计的基本组成要素。

全屏背景图片或视频

理论上讲,全屏背景图片与最小化设计理念当中“移除一切不相关要素,只保留必要信息”的原则是相冲突的,不过在实际当中,这种设计模式的主流化程度还是有目共睹的;在我们的研究样本当中,采用了这种模式的界面约占57%。

网格布局

使用在43%的样本界面当中。43%的比例可以代表一定的流行程度,但也可以说明这种设计方式不是很典型的最小化设计组成要素。

在最小化界面当中,网格布局的使用通常出于两方面的原因:

  • 无需额外的视觉元素进行辅助,网格布局能够很好的将界面当中一系列同质内容组织起来。

  • 网格布局对于响应式设计的实现很有帮助。

圆形的图形元素

很多设计师认为圆形元素是一种典型的最小化界面设计组成要素,不过在我们的研究当中,只有16%的样本有用到。

默认隐藏的全局导航

如今很多网站会默认隐藏全局导航,实际上,这可以说是对“移动优先”设计思路理解不全面或是贯彻不全面所导致的直接结果,忽略了在平板或桌面设备充裕的显示环境当中一目了然的向用户呈现导航结构的重要性 - 换个角度说,这也是典型的过度简化设计。

最小化设计要素归纳

在对112个网站界面进行研究之后,我们总结出了如前文所述的若干最小化设计组成要素,其中包括5个典型组成要素:

  • 扁平化的材质

  • 少量配色或单色方案

  • 功能与界面元素的约束

  • 超大的留白比例

  • 夸张的字体运用

其中某些要素出现在了几乎所有的研究样本当中;使用频率最低的也超过了75%。此外,我们还总结出了一些使用频率相对较低,但仍与最小化风格高度相关的设计方式:

  • 全屏背景图片或视频

  • 网格布局

  • 圆形的图形元素

  • 默认隐藏的全局导航

小结

2000年前后的界面设计领域由混乱与聒噪所统治。多年来,我们逐渐学会了与之进行对抗。臃肿的功能和无意义的内容对于用户及产品自身都是极大的伤害。

理论上讲,最小化设计思想可以帮助我们远离曾经的混乱局面,打造出更加平滑自然的人机互动流程。不过现实当中的情况并非那么理想,很多设计师仅从形式上拷贝着各种流行的最小化设计要素,却忽略了特定的产品目标以及不恰当的设计方式所导致的各种可用性陷阱。

从形式上看,扁平化设计是对拟物风格的反击,最小化设计是对过度设计的反击。无论如何,我们都强烈建议各位设计师避免非此即彼、非黑即白的思维模式,真正去了解每种设计思想的特性,根据产品的实际情况寻求恰当的平衡点。只有在真正符合产品目标及用户需求的情况下,特定的设计思想才能真正成为有利的设计武器 - 为了最小化而最小化,对产品和用户都无益。

预约申请免费试听课

填写下面表单即可预约申请免费试听! 怕学不会?助教全程陪读,随时解惑!担心就业?一地学习,可全国推荐就业!

上一篇:设计之前,花上时间去定义你的设计原则
下一篇:印刷常识之平面设计师应具备的知识

15个有用的UI和UX设计师的工具

  • 扫码领取资料

    回复关键字:视频资料

    免费领取 达内课程视频学习资料

Copyright © 2023 Tedu.cn All Rights Reserved 京ICP备08000853号-56 京公网安备 11010802029508号 达内时代科技集团有限公司 版权所有

选择城市和中心
贵州省

广西省

海南省