网站首页
手机版

扁平化设计之UI设计技巧

更新时间:2022-03-23 18:24:21作者:佚名

扁平化设计之UI设计技巧

  对于设计师来说,如果你观察微软的Windows Phone的平台,你可能会发现一个特别的现象:那就是难看的应用不多,但令人印象深刻的应用也不多。应用很有统一感,但是很难张扬个性,以至于有的开发者感叹,它们看起来都是一个样子。设计师Johnny Holland将Metro语言比作是包豪斯风格,并且指出,“因为去除了装饰,使得个性化的空间很小”,这可能给人以“缺乏生命力”的感觉,所以要想设计做出好的扁平化设计,也是非常需要技巧的。
  

  简单的设计元素
  
  扁平化完全属于二次元世界,一个简单的形状加没有景深的平面,不叫扁平化都浪费这个词了。这个概念最核心的地方就是放弃一切装饰效果,诸如阴影、透视、纹理、渐变等等能做出3D效果的元素一概不用。所有的元素的边界都干净俐落,没有任何羽化、渐变或者阴影。尤其在手机上,因为屏幕的限制,使得这一风格在用户体验上更有优势,更少的按钮和选项使得界面干净整齐,使用起来格外简单。
  
  强调字体的使用
  
  字体是排版中很重要的一部分,它需要和其他元素相辅相成,想想看,一款花体字在扁平化的界面里得有多突兀。上图是一些扁平化网站使用无衬线字体的例子,无衬线字体家族庞大分支众多,其中有些字体会在特殊得情景下会有意想不到得效果。但注意,过犹不及,不要使用那些极为生僻的字体,因为保不齐它就把你带进坑里了。
  
  关注色彩
  
  扁平化设计中,配色貌似是最重要的一环,扁平化设计通常采用比其他风格更明亮更炫丽的颜色。同时,扁平化设计中的配色还意味着更多的色调。比如,其他设计最多只包含两三种主要颜色,但是扁平化设计中会平均使用六到八种颜色。另外还有一些颜色也挺受欢迎,如复古色浅橙、紫色、绿色、蓝色等。
  
  简化的交互设计
  
  设计师要尽量简化自己的设计方案,避免不必要的元素出现在设计中。简单的颜色和字体就足够了,如果你还想添加点什么,尽量选择简单的图案。扁平化设计尤其对一些做零售的网站帮助巨大,它能很有效的把商品组织起来,以简单但合理方式排列。
  
  伪扁平化设计
  
  不要以为扁平化只是把立体的设计效果压扁,事实上,扁平化设计更是功能上的简化与重组。比如,有些天气方面的应用会使用温度计的形式来展示气温,或者计算应用仍用计算器的二维形态表现。在应用软件当中,温度计的形象则纯粹是装饰性的,而计算器的计算方式也并不是最简单直接的。相比于拟物化而言,扁平风格的一个优势就在于它可以更加简单直接的将信息和事物的工作方式展示出来。

本文标签: 百科  扁平化  标签  技巧  

为您推荐

excel表格怎么大批量筛选(excel表格怎么大批量筛选重复项并快速删除)

1、在选中单元格后,点击排序和筛选。2、在展开的界面中,点击筛选。3、在单元格界面中,点击全部显示。4、在展开的界面中,点击确定即可。

2023-03-21 15:30

Word2007文档水印怎么去除(word2007文档如何去除水印)

Word2007文档水印怎么去除 Word2007文档水印怎么去除 方法一 页面布局-页面背景-水印-删除水印,文档中的水印被删除. 方法二 页面布局-页面背景

2023-03-15 00:31

Word2003文档中的回车符怎么隐藏(怎样隐藏word里的回车符)

Word2003文档中的回车符怎么隐藏 Word2003文档中的回车符怎么隐藏 隐藏回车符 1.单击菜单栏"工具"下的"选项",在打开的窗口中取消勾选"视图"选

2023-03-15 00:30

Word2007自动滚动怎么设置(如何设置word自动滚动)

Word2007自动滚动怎么设置   Word2007自动滚动怎么设置 1.首先打开一篇长篇文档,单击其左上角的"office按钮"在弹出的快捷菜单中选择"Wo

2023-03-15 00:29

Word2013文档中大纲视图如何使用(word2007大纲视图)

Word2013文档中大纲视图如何使用 在Word 2013中,用户可以使用大纲视图来查看并编辑文档的大纲结构,同时可以对正文进行处理.在大纲视图模式下,文档的

2023-03-15 00:29

Word怎么用快捷键快速修改文字格式 word快捷键修改

Word怎么用快捷键快速修改文字格式   Word怎么用快捷键快速修改文字格式 1.电脑上新建word文件,例如命名为"word技巧" 2.双击"word技巧"

2023-03-15 00:27