售前咨询 售后咨询
当前位置: 上海网站设计 > 建站知识 > 建站教程

扁平化设计初学者指南

网站编辑:小润 | 发表时间:2019-02-02 23:39:06

  过去,网站设计师将重点放在展示自己的技能和设计作品,炫耀那些酷炫的插图和动画,希望能够经验访问者。后来,潮流转向了拟物设计,试图将真实的生活展示在屏幕上,具有逼真的纹理、阴影和真实的物体特征。

  后来,扁平化设计出现,并推翻了这些“人工的”设计技巧,转而开始追求更加简化的、经典的数字化审美。尽管这种以用户为中心的网站设计风格已经出现了多年,但仍然很受欢迎。所以如果你还不了解扁平化设计到底是什么,本文可以助你一臂之力。

  什么是扁平化设计



  Windows 8曾处于平面设计趋势的前沿

  扁平化设计是一种简约的设计方法,强调实用性。这种设计具有干净、空间开阔、边缘清晰、色彩明亮、二维插图等特点。

  微软是首批在自己的界面应用扁平化设计的公司之一。扁平化设计并没有使用把真实的物体(比如日历)转化为一个小小的逼真插图,而是用简单的的图标来识别不同的应用。

  扁平化设计并不需要将真实生活应用到界面中,而是清晰地区分了技术与实物的界线。

  简约不等于无聊

  扁平化设计中,装饰性元素被视作不必要的杂乱。如果某个元素没有功能性,那就是对用户体验的一种干扰。这是扁平化设计强调简约的原因。

  但是,没有华丽的设计并不意味着这种风格是无聊的。明亮的、对比强烈的色彩让插图和按钮从背景中脱颖而出,很容易就能抓住人们的视线,并引导用户的注意力。简约图像同时也有助于突出扁平化设计的功能性。

  快速掌握

  比起复杂的插图,简单的图像能够更快速地传达信息。图标类的图像可以表示通用的动作或者目的,大家都能轻松了解。

  拟物设计和扁平化设计的区别是显而易见的。大的纯色块更容易抓住人们的注意力,图标的意义也更容易被理解。



  Xero的云计算指南使用了扁平化设计,让信息更清晰易懂

  上图中的云计算指南使用了平面图形和图解的组合来展示在工作中使用云的各种优势。图像的简单性使得用户可以轻松理解信息。

  你能从中得到什么

  扁平化设计回归到了设计作为功能性工具的基础。网站的优劣应以功能好坏而论,而不是以外观而论。

  这种原始功能性将网站的重点放在了用户体验上,因此采用了扁平化设计的网站通常能够获得来自用户的积极反馈。

  怎么做

  扁平化设计的要点,是所有设计元素均应遵循一个原则,那就是简约。

  鲜明的纯色代替解说细节将不同的功能区分开来,无衬线字体为插图提供干净清晰的补充;文本简明扼要;UI元素比如按钮和链接等清晰而明显。

  所有的内容均应围绕同个目标进行设计,来打造一个视觉性和功能性都很棒的网站。下面给大家介绍几个扁平化设计的例子。

  Tripfinder




  色彩和图标让信息更清晰

  上图中的旅行计划应用设计来自印尼用户界面(User interface,UI设计师Bady。用户可以根据套餐和预算轻松下单预定航班。一切都清晰明了,设计很大程度上依赖于颜色和图标。航班搜索的UI非常明显。

  天气预报应用




  扁平化设计不是必须使用亮色

  上图中的天气应用用户界面设计表明扁平化设计即使不使用亮色也能成功。清晰的图像和大号的字体能够轻易地将用户的注意力引到天气情况上面,而这恰好也是用户需要的内容

  在开展扁平化设计时,请确保围绕简约和以用户为中心这两个重点设计每个方面,以确保用户界面的统一。能够成功地坚持这一点,用户将会十分欣赏网站的功能性。
TAG标签耗时:0.0036358833312988 秒

关键字:
官方微信
上海市长宁区宣化路300号华宁国际广场中区7层
+021-8031 0607
+135 8590 1130