10组扁平化设计案例,看看哪些可以学习借鉴!

更新时间:2023-02-10 10:39:41

扁平化设计的纯粹和简单,以及它倡导的”歇斯底里的简约”,逐渐被用户认可、欣赏。扁平化设计概念最核心的地方就是:去掉冗余的装饰效果,意思是去掉多余的透视,纹理,渐变等等能做出3D效果的元素。让“信息”本身重新作为核心被凸显出来。并且在设计元素上强调抽象、极简、符号化。


人们普遍认为,扁平化设计最早是受到了国际印刷风格新兴风格的影响。


上世纪 50、60 年代的设计风格被认为是扁平化设计的开山鼻祖。2002 年,美国微软公司发布的 Windows 媒体中心和 2006 年发布的 Zune MP3 播放器都包含了扁平化设计的元素。Zune 的界面设计风格显得十分简约,其界面出现了大号的小字体排版,剪影风格的 LOGO 和纯色风格的字体颜色。2008 年由 Google 提出 Flat Design 这个英文扁平化设计概念。在2010年发布的Windows Phone 7里,微软延续了Zune MP3 这一设计理念,其中出现了大尺寸、清新明亮的风格、无衬线字体、扁平化的图标,以及网格状的菜单。Windows Phone 7 的界面设计大获成功、广受好评。2013 年美国苹果公司发布了 iOS 7 ,其界面首次采用扁平化的设计,一改之前旧版本的仿真设计风格。


如果你厌倦了繁琐的这一切,想依靠点什么来玩些新花样,那么是时候在你的稿子里注入 Flat Design 的因子了。今天我给大家整理了一些优质的扁平化设计案例,希望能够为你带来对扁平化设计的思考和帮助。


以下资源均支持版权开放。所有开源作品将遵循 CC BY 4.0 等知识共享许可协议,任何人在符合并满足许可的基础上,都能自由地复制、修改并使用每一份开源作品,包括商业用途。


扁平化商务生活办公场景插画

作者:JanieChang

扁平化设计案例


获取方法:

点击扁平化商务生活办公场景插画进入该案例页面,点击「使用」-点击「保存并打开文件」,即可进行使用或者在编辑态页面进行编辑。

如果暂时只需要保存下来备用,则可以点击「仅保存」,文件即被保存到工作台。

24个APP扁平化图标

作者:碳纤维猫咪

获取方法:

点击24个APP扁平化图标进入该案例页面,点击「使用」-点击「保存并打开文件」,即可进行使用或者在编辑态页面进行编辑。

如果暂时只需要保存下来备用,则可以点击「仅保存」,文件即被保存到工作台。

45个扁平化空状态分享

作者:1312xxx6969

获取方法:

点击45个扁平化空状态分享进入该案例页面,点击「使用」-点击「保存并打开文件」,即可进行使用或者在编辑态页面进行编辑。

如果暂时只需要保存下来备用,则可以点击「仅保存」,文件即被保存到工作台。

彩色扁平化母婴图标分享

作者:jiangrui

获取方法:

点击彩色扁平化母婴图标分享进入该案例页面,点击「使用」-点击「保存并打开文件」,即可进行使用或者在编辑态页面进行编辑。

如果暂时只需要保存下来备用,则可以点击「仅保存」,文件即被保存到工作台。

毕业季欢呼雀跃扁平化插画

作者:海盐可爱多

获取方法:

点击毕业季欢呼雀跃扁平化插画进入该案例页面,点击「使用」-点击「保存并打开文件」,即可进行使用或者在编辑态页面进行编辑。

如果暂时只需要保存下来备用,则可以点击「仅保存」,文件即被保存到工作台。

21个扁平化插画

作者:Freedom*

获取方法:

点击21个扁平化插画进入该案例页面,点击「使用」-点击「保存并打开文件」,即可进行使用或者在编辑态页面进行编辑。

如果暂时只需要保存下来备用,则可以点击「仅保存」,文件即被保存到工作台。

APP-智能日历

作者: Nitya Gupta

由设计师 Nitya Gupta 设计一款智能日历应用程序,Calzie 是一个智能日历 UI 工具包,专为那些正在寻找应用程序来更好地管理日常生活的人而设计。

获取方法:

点击APP-智能日历进入该案例页面,点击「使用」-点击「保存并打开文件」,即可进行使用或者在编辑态页面进行编辑。

如果暂时只需要保存下来备用,则可以点击「仅保存」,文件即被保存到工作台。

扁平化星星IP

作者:jeoloso

获取方法:

点击扁平化星星IP进入该案例页面,点击「使用」-点击「保存并打开文件」,即可进行使用或者在编辑态页面进行编辑。

如果暂时只需要保存下来备用,则可以点击「仅保存」,文件即被保存到工作台。

扁平化矢量管理员工作场景插画

作者:椰子噗噗

获取方法:

点击扁平化矢量管理员工作场景插画进入该案例页面,点击「使用」-点击「保存并打开文件」,即可进行使用或者在编辑态页面进行编辑。

如果暂时只需要保存下来备用,则可以点击「仅保存」,文件即被保存到工作台。

扁平化互联网图标轻拟物

作者:婷婷不停停

获取方法:

点击扁平化互联网图标轻拟物进入该案例页面,点击「使用」-点击「保存并打开文件」,即可进行使用或者在编辑态页面进行编辑。

如果暂时只需要保存下来备用,则可以点击「仅保存」,文件即被保存到工作台。