• 2017年7月2日,氧16网正式改版,增加会员登录注册功能,感谢群里小伙伴的支持!
  • 氧16网设计交流1群:331622745,设计交流2群:536159510,欢迎志同道合的朋友加入!
  •    4年前 (2013-06-16)  UI设计 |   9 条评论  3 
    文章评分 0 次,平均分 0.0

    扁平化,最近听到最多有关UI设计的词,就连一直推崇拟物设计的苹果也开始扁平化设计,难道界面扁平化的时代正的来了吗?

    这种风格很带感,但大多数设计师不能彰显这种风格,或者直接讨厌这种风格。

    我认为只要是美的东西都是好设计!虽然最近流行的扁平风格,但它不适合所有的项目,所以别硬套这种设计风格。让我们我们来"戏说"一下什么叫扁平风格。

    bph1

    bph2

    bph3

    扁平化设计以其形命名,“平”就是其独特的二维风格。谁说“平胸”不好看,时代已经不一样了!

    这一概念不需点缀任何阴影、渐变或添加效果。每个元素菱角分明,以色块区分,不添加额外的元素使得看起来更加逼真,不像skeuomorphic设计项目中使用技巧来使元素更逼近3D。扁平化不需要多复杂的设计效果,配色和图片的选择便尤为重要。我们如何拿捏呢?

    bph4

    bph5

    bph6

    bph7

    首先要简化元素,设计师只需找些简单的形状,如矩形、 圆形或正方形,保持每个形状孤立。形状边缘可以完美地方角化或者包含一点点圆角。每个UI元素应该只是简单和容易单击或切换。这样对用户是很直观的互动,不用为了表达为设计意图而作的过度设计。除去简单的样式,扁平化还鼓励大胆的给按钮上色。但不要混淆简单元素和简单设计,扁平设计的概念也可以像其他设计方案一样复杂。

    bph8

    bph9

    bph10

    由于元素在平面设计中的简单特性,排版是极其重要的。字型的定格应和整体方案的设计相符,不同的字体可能看起来奇怪反对一种超简单的设计。使用加粗字体和简单地和高效的单词来使最终产品具有一致性,可以在可视化方式和文本上作些努力。为设计多、添加一些别致的触点,一个新奇的字体来作为设计的元素,但小心别使用过火的专业字样。字体设计中还应该告诉用户如何使用该设计。标签按钮和其他元素增加引入的易用性和交互性。

    bph11

    bph12

    bph13

    颜色是扁平化设计中重要的环节。不同于其他UI设计,扁平设计中颜色往往更鲜艳但饱和度又不那么高。虽然大多数设计都专注于两三种颜色,但扁平设计中通常使用六至八个颜色。扁平设计中色调趋向充满活力,多使用纯色和其相近色或对比色。另外,一些特定颜色的使用频率较高,在重复的扁平设计中,复古的颜色包括鲜肉色、紫色、绿色和蓝色这些是较受欢迎。

    bph14

    bph15

    bph16

    扁平化的设计本质上是简单的,它与整体简约的设计方法相得益彰。在网站的整体设计中避免太多花哨的东西。简单的颜色与文字就已足够。如果你要添加视觉效果,选择简单美观的图像是个不错的选择。

    bph17

    bph18

    bph19

    bph20

    bph21

    更多设计师都倾向并赞同的风格,就是“接近”扁平化的设计。在“接近”扁平化的设计中,使用了扁平化风格的基本主题,但是一些特效被添加到设计方案中。例如按钮,可能包含轻微的梯度或者阴影。设计师通常挑选一种特效并专门用在一种“接近”扁平化的项目中。

    这个风格,相对于一些扁平化设计背后的具有了更多的弹性。

    扁平化设计——设计师们因为附加的深度和纹理而喜欢它。用户们喜欢它是因为这个风格简单美观,并且有利于引导适当的交互。另一方面,设计师们不喜欢它是因为它以一种相对固定风格,而这种方式的设计缺少了设计师本身风格的定义。

    还必须提到的一点是,这种设计上的简单要配合开发的不简单,使用更多特效让简单的界面动起来,这样才会使得交互体验上更好!

     

    除特别注明外,本站所有内容均来自氧16网网络,取之于民用之于民,转载请注明出处来自http://yang16.com/279.html

    关于
    氧16网 — 分享设计&素材&工具|文章烂,更新少,茫茫人海,能够被你关注真是三生有幸

    发表评论

    表情 格式
    1. 好!!!!!!!

      徐晓怡 评论达人 LV.1 2年前 (2015-12-30) [0] [0]
    2. 把那个登陆页面仿了去

      程晨 评论达人 LV.2 4年前 (2013-11-07) [0] [0]
    3. 收藏了

      DIng 评论达人 LV.4 4年前 (2013-09-22) [0] [0]
    4. 赞一个。

      JZC 评论达人 LV.4 4年前 (2013-08-22) [0] [0]
    5. 人齐很旺啊,比我的站强多了,看多分享资源和技术的都很受欢迎。唉

      You87-分享互联网的精彩! 评论达人 LV.1 4年前 (2013-08-20) [0] [0]
    切换注册

    登录

    忘记密码 ?

    您也可以使用第三方帐号快捷登录

    切换登录

    注册

    扫一扫二维码分享