扁平化视觉设计能够在短时间内完成视觉体验与人机交互,更适合当今快节奏的生活,同时也满足了用户准确有效地浏览自己所需资源的要求。扁平化视觉设计在界面中的运用,呈现出自己独特的优势。

APP界面的扁平化设计-网络技术中心

①良好的隐喻性。这里的隐喻性是指用一种物体来代替另一种物体的修饰方式。良好的隐喻性使得智能手机图形界面在设计中得以简化一些流程,使其具有易于识别、易于记忆、易于跨文化理解、易于提升程序的运行效率等作用。

APP界面的扁平化设计-网络技术中心

②方便用户使用。扁平化视觉设计以方便客户为主,设计时采用高强度的对比度方法与加大选项颜色或者字体的方法,给用户更好的视觉体验。

APP界面的扁平化设计-网络技术中心

③符合用户的心理需求。用户可以通过界面提示的信息进行操作,扁平化视觉设计师常在界面设计中构造符合用户的心理模型,加强了信息传达的准确性。

APP界面的扁平化设计-网络技术中心

④整体一致性。设计的整体性与一致性让智能手机图形界面设计中不同的图形、模块与文字等,最大可能地保持了与外观的一致性和整体的风格,同时让功能性与操作本身达成一致。

APP界面的扁平化设计-网络技术中心

界面扁平化设计原则

①极简化。所谓的极简是拋弃冗余与繁杂的装饰,将复杂变成简单,将无序变成有序。设计师要清楚而明白地理解用户的需求,能够恰到好处地将不同的元素安排到合适的位置,突出信息的明确性,让用户加快获得所需的信息资源。

APP界面的扁平化设计-网络技术中心

②抽象化。优秀的扁平化作品即使在没有装饰效果的情况下,依旧能达到良好的直觉导引作用和效果。可以采用几何图形,如圆形、正方形和三角形等,经过加工变形后形成高度概括的抽象化图形,给人一种扁平的视觉感受,而不是凸凹感与可触感。

APP界面的扁平化设计-网络技术中心

③愉悦感。良好的扁平化界面能够给予用户一定的指引作用,引导用户完成相应的操作。可以说界面如同人的面孔一样,具有吸引用户的直接优势。设计合理的界面能够给使用者带来愉悦的心情和成功的喜悦,反之则会令使用者产生厌烦感,甚至会产生挫败感。

APP界面的扁平化设计-网络技术中心

界面扁平化视觉元素

优秀的版式设计是扁平化视觉设计的前提,同时也是展示智能手机信息的重要表现形式。在智能手机图形界面设计中只有将文字、色彩及图形合理地搭配起来,才能实现功能美与形式美的统一,才能生产出令人舒适而愉悦的产品。

APP界面的扁平化设计-网络技术中心

文字元素

①文字符号化。文字元素在设计中的首要功能就是表达,即将信息内容传递给使用者。扁平化界面设计中,除了让文字表达字本身的意义和辅助说明,更多的应当是将不同文字的个体和文字的组合形式作为视觉形象设计传达出来。

APP界面的扁平化设计-网络技术中心

②文字图形化。打破文字原有的版式布局,从而使文字具有图形化的表现,通过新的编排与构造,可以使文字的内涵和形式更加突出,最终实现信息的交流与传播。

APP界面的扁平化设计-网络技术中心

色彩元素

①色彩符号化。一般来说,界面设计普遍倾向于纯洁与优雅的视觉效果,在色彩选择上常常偏向于明度与饱和度较高的色彩,而在扁平化视觉设计中,设计师则更加趋于大胆,会利用不同的色彩撞击给设计带来无限可能,使界面设计更加具有愉悦性和趣味性。

APP界面的扁平化设计-网络技术中心

②色彩构成化。色彩的三个基本元素:明度、纯度和色相。扁平化视觉设计中通常采用色彩的明度来呈现出信息的层析关系用色相来表达信息的差别性,用纯度来区别应用程序与前后台,在扁平化视觉设计中更加强调的是通过色块的面积大小及数量的多少来表现不同信息的主次关系。

APP界面的扁平化设计-网络技术中心

目前,扁平化视觉设计中以色彩明快、色调丰富为流行元素,而且并不局限于色调的固定化,它可以使用不同的色彩,但为了引导和吸引用户对于界面的交互作用,设计师更加倾向于鲜艳的颜色。纯色在智能手机界面设计中也是首选,因为纯色能够与明亮或者灰暗的背景形成鲜明的对比,可以提高视觉冲击力。

APP界面的扁平化设计-网络技术中心

图形元素

①图形指向性。处于网络信息的环境中,用户也需要快速获取和反馈信息,智能手机作为移动网络的端口,其图形界面需要指向性的功能,而扁平化视觉设计则刚好具备了这一特性。

APP界面的扁平化设计-网络技术中心

②图形抽象化。图形的抽象化能使信息表达得更清晰明了,让用户在较短的时间更加容易去识记和辨别。扁平化视觉设计中的抽象化是对事物外形轮廓的高度提炼与概括,抽象化并不是代表感性化,通常结合文字和数字来传递信息。

APP界面的扁平化设计-网络技术中心

这里的抽象化对设计师的观察和提炼的能力提出了新的要求,设计师既要了解对象外形的本质,又要巧妙地利用线条进行取舍在外部轮廓与界线的强烈对比下,表现出物体本身的美感与对象传达的信息。

APP界面的扁平化设计-网络技术中心