扁平化设计原则 已翻译 100%

曾沙 投递于 2013/06/07 10:10 (共 7 段, 翻译完成于 06-08)
阅读 12940
收藏 189
14
加载中

扁平化设计 – 设计群体实在无法停止谈论它。

这种设计感觉很强烈。大多数设计师既不能充分捕捉这个潮流,也不能完全讨厌它。

我的态度中庸。好的设计是与创造一些有用的东西有关。如果答案在于扁平时尚的设计,那就顺其自然。但这个趋势可能不是对所有项目都行得通,因此这不应该是强制性的。

所以我们观察一下是什么使得事物变得扁平。有五个不同寻常的特点。我们逐一看一下,再加上一个“近似”扁平化设计的介绍。

super0555
super0555
翻译于 2013/06/07 15:29
2

去除特效

TriplAgent

Into the Arctic

Task app

扁平化设计以其形命名。平的设计就是其独特的二维风格,简单地平。


这一概念不加点缀——阴影、棱台、压花、渐变、不用其他工具的增加色彩深度 . 每个元素、框,从图像帧到按钮再到导航工具 , 注重干净利落 , 不使用边缘羽化和阴影。


不添加额外的元素看起来更加逼真些 ,不同于skeuomorphic 设计项目中使用技巧来使元素更逼近3D 。扁平化的图层反映在其他项目中,就是不设计另类的背景图 、前景色或按钮 、文本和导航.


那么它是如何工作的捏 ? 平面设计有独特的外观和感觉,但没别的了。它需要设计明确的层次结构和元素放置 , 使用户可以更加容易专注项目,理解交互。虽然越来越多的网站使用扁平化设计风格,或许移动设计和应用中的风格更受欢迎。较小的屏幕占用 , 少的按钮和选项 , 让扁平界面的应用使用起来嘎嘎容易 (so easy?).

MtrS
MtrS
翻译于 2013/06/07 19:29
1

简元素

iPad Calendar Login

Filetypes

Square UI

Simone Marcarino

平面设计使用一些简单的用户界面元素如按钮和图标。设计师只需找些简单的形状,如矩形、 圆形或正方形,保持每个形状孤立。形状边缘可以完美地方角化或者包含一点点曲率。

每个 UI 元素应该只是简单和容易单击或切换。对用户很直观的互动,没有一些为设计而作的过度设计。

除去简单的样式,鼓励大胆的去可点击的按钮上色。但不要混淆简单元素和简单设计,扁平设计的概念也可以像其他设计方案一样复杂。

需要获得帮助开始你的设计吗(译者注:下面是广告)?Designmodo 提供了各式各样的 UI 工具包使用平面样式 —— 从 Square UI FreeFlat UI Free,包含一些简单的 PSD/HTML 用户界面工具包与基本组件,到Square UIFlat UI Pro 完整打包 PSD/HTML 用户界面包的网站和应用的设计项目。

MtrS
MtrS
翻译于 2013/06/07 19:48
2

专心搞排版

Courtney & Andrew

Plover

Flatmate

由于 元素 平面 设计 简单 特性 排版 极其 重要

字型的定格 整体方案 设计相符 — — 高度 点缀 字体 可能 看起来 奇怪 反对 超简单 设计 使用加黑字体 简单地 高效的单词 使 最终 产品 一致 可以在可视化方式 文本上 作些 努力

考虑 一个 简单 衬线 (sans serif)类型 很多 变化 权重 版式 使用 平面 设计 站点 添加 一些别致的 触点 一个 新奇的 字体 来作为 设计 元素 小心 使用过火 专业 字样

字体设计中 应该 告诉 用户 如何 使用该设计 标签 按钮 其他 元素 增加 引入的 易用性 交互性
MtrS
MtrS
翻译于 2013/06/07 20:03
1

专注于颜色

Close landing page

Online Radio

Squirrel Settings

颜色 平面 设计 一部分 。不同于其他网站 设计,扁平设计中 颜色 调色板 往往 是强调 很多 更亮 鲜艳

扁平设计中的颜色 调色板 项目 通常 包含 更多的 色调 虽然 大多数 颜色 调色板 专注 三种 颜色 但扁平 设计 中调色板 通常 使用 八个 颜色

扁平设计中色调趋向 充满活力 — — 颜色 转盘 — —     没有 淡色 最纯 初级和 次级 颜色 最受欢迎 另外 ,一些特定颜色的使用频率较高, 重复 扁平 设计 方位色,复古 颜色 — — 包括 鲜肉色 紫色 绿色 蓝色 — —  这些 受欢迎
MtrS
MtrS
翻译于 2013/06/07 20:15
1

简约的方法

Personal Site

DBX - Dropbox

Mud

扁平化的设计本质上是简单的,它与整体简约的设计方法相得益彰。

在网站的整体设计中避免太多花哨的东西。简单的颜色与文字就已足够。如果你要添加视觉效果,选择简单的图像。

有些零售网站,比如Svpply(见上),使用效果很棒的扁平化设计,这是将一些条目放在一个简单的背景上做到的。(提醒一下这些图片确实具有一些自然深度,但仍然和谐融入到整个扁平化的设计中)

super0555
super0555
翻译于 2013/06/07 21:19
1

“接近”扁平化的设计

Nagging popup

Calc

SimpleMail

Coming project

Music Web Application

一个更多设计师都倾向于赞同的风格,就是“接近”扁平化的设计。

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

这个风格,相对于一些扁平化设计背后的、无特效思想中的刚性,容纳了更多一些的弹性。

设计师们因为附加的深度和纹理而喜欢它。用户们喜欢它是因为,这个风格没有那么生硬,并且有利于引导适当的交互。另一方面,设计师们不喜欢它是因为,它以一种方式结合了两种风格,而这种方式可能缺少了对于一个真正风格的定义。

关于扁平化设计的更多信息


Designmodo已经成为扁平化设计趋势的讨论中的领导者。阅读我们之前的文章,了解关于扁平化设计的更多信息。

尚御博豪
尚御博豪
翻译于 2013/06/07 22:14
2
本文中的所有译文仅用于学习和交流目的,转载请务必注明文章译者、出处、和本文链接。
我们的翻译工作遵照 CC 协议,如果我们的工作有侵犯到您的权益,请及时联系我们。
加载中

评论(31)

grath
grath
无论是什么风格 推崇至简主义
纯洁徐
纯洁徐

引用来自“赵亮-本人”的评论

设计潮流是怎么产生的?就是一大帮庸才只会跟着少数人才后面模仿,把好东西一直弄到稀烂。而真正有个性的不附庸主流的人才,也在那个污浊不堪的浑流当中冲刷得无立足之地,不是湮没就是投降。直到大众感到厌烦时,“天时地利人和”有了,才能掉头搞逆向设计。所以这种事情,在大层面上只是天命使然,所谓设计思想或技术,只是小把戏而已。

不是说扁平化的好,也并非拟真效果糟;关键还是看用的人;看看小米和Google的设计进行对比,大家就会明白,什么叫精髓,什么叫肤浅;
唐海康
唐海康

引用来自“缪斯的情人”的评论

扁平化容易审美疲劳,一个贫胸妹纸,长得再漂亮,没有质感,时间久了你也会觉得无感的。

魂淡,贫乳是稀缺资源啊!!!
Jony灬
Jony灬
有些设计还是比较喜欢
Xsank
Xsank
喜欢扁平
super0555
super0555

引用来自“缪斯的情人”的评论

扁平化容易审美疲劳,一个贫胸妹纸,长得再漂亮,没有质感,时间久了你也会觉得无感的。

哈哈,这两个是不一样的哦。
赵亮-碧海情天
赵亮-碧海情天
设计潮流是怎么产生的?就是一大帮庸才只会跟着少数人才后面模仿,把好东西一直弄到稀烂。而真正有个性的不附庸主流的人才,也在那个污浊不堪的浑流当中冲刷得无立足之地,不是湮没就是投降。直到大众感到厌烦时,“天时地利人和”有了,才能掉头搞逆向设计。所以这种事情,在大层面上只是天命使然,所谓设计思想或技术,只是小把戏而已。
lylvgg
lylvgg

引用来自“duandi”的评论

难道没有人和我一样觉得扁平化很小清新吗?

哈哈,我也觉得很清新。
高跟男爵
高跟男爵
你们都别用 就让我一个人用·· 就这么定了···
duandi
duandi
难道没有人和我一样觉得扁平化很小清新吗?
返回顶部
顶部