火星网校
UI设计之扁平化设计的魅力
发布时间：2024-01-12 17:50:22 浏览量：232次
扁平化优劣分析：
优点
1.降低移动设备的硬件需求，延长待机时间；
2.可以更加简单直接的将信息和事物的工作方式展示出来，减少认知障碍的产生；
3.随着网站和应用程序在许多平台涵盖了越来越多不同的屏幕尺寸，创建多个屏幕尺寸和分辨率的skeuomorphic设计既繁琐又费时。设计正朝着更加扁平化的设计，你可以一次保证在所有的屏幕尺寸上它会很好看。扁平化设计更简约，条理清晰，最重要的一点是，更好的适应性。
缺点
1.降低用户体验，在非移动设备上令人反感；
2.缺乏直观，需要一定的学习成本；
3.传达的感情不丰富，甚至过于冰冷。
对于复杂需要大量的视觉效果来堆砌的界面以及某些复杂的插图慢慢的已经退出历史舞台，取而代之的是扁平化的崛起，这种简单直观的风格给予了用户最好的体验，功能展示更加鲜明，形象展示更加简单。
传统场景之间的对比
游戏原画之间的对比
扁平化设计五大原则：
1.拒绝特效：抛弃所有繁琐的特效，简单的色块。
2.仅使用简单的元素：去掉复杂元素，凸出主题。
3.注重排版：更加注重排版，因为简单。
4.关注色彩：颜色选择更加重要。
5.极简主义：简单明了，信息传达准确。
附加：“准”扁平化
扁平化设计概念
扁平化概念的核心意义是：去除冗（rong）余、厚重和繁杂的装饰效果，这样可以让“信息”本身重新作为核心被凸显出来。同时在设计元素上，则强调了抽象、极简和符号化。
例如：Windows、Mac OS、iOS、Android等操作系统的设计已经往“扁平化设计”发展。
应用范围：
APP ，web，插画，各种benner。
总结：皮影戏引入
最早的扁平化，中国传统。
用到工具：
新建：
命名，数值：随便输入手机大小新建，分辨率：一般使用像素/英寸，RGB：不牵扯打印的情况用RGB。背景内容：通常选择白色。
图层：
图层顺序类似书页，在上地会覆盖下面的。图层工具：文件夹和新建还有删除的用法和作用：强调拖入到新建会复制，拖入到垃圾桶会删除
。
放大工具：
按住ALT会变化放大镜的放大缩小图标。拖动或者直接点击画布会进行放大和缩小。
移动工具：
画布移动工具。移动图层上面的所有图像。
小黑，小白：
，形状路径图形选择工具，锚点选择工具，锚点选择可以调整杠杆。
路径工具：
路径工具现在有两种形式，一种是可编辑，一种是形状
大小编辑。自定义形状工具，
可以添加很多系统自带或者是自己下载的形状。
钢笔工具：在没有进行调整的情况下，默认是路径，填充和描边从一个端点出发，按住Ctrl转换为小白选择工具。调整杠杆可以任意变换弯曲形状，按住Alt打断。
图像大小调整:Ctrl+T,鼠标左键进行拖动按住Shift进行等比缩放。
扁平化卡通形象设计理念
1.教学方法，以圆形为基础通过对圆形的变形来创造卡通形象。各种圆形对比各种脸型相同五官下的效果。
2.结合其他形状制图
扁平风格卡通人物肖像绘制（定制头像）
1.路径绘制：通过小白工具进行下端点的调整，拾取想要的颜色
2.两个小椭圆放在脸的背后，颜色加深。
3.类似耳朵的方法绘制腮红：
4.绘制眼睛，四个圆形。
然后进行打组。
5.水平翻转添加眼睛，
6.耳朵和嘴:
7.两个圆形，一个在前一个在后，绘制出一个头发的基本型。
8.脖子和头发细节的绘制。脖子利用圆角工具进行绘制。
9.衣服的绘制，两个圆角矩形相交。
10.衣领的绘制
11.最后添加矢量蒙版。
头像绘制成功，可以换一些其他发型。
本次讲解就到这里，源码时代各校区ＵＩ设计班将在６月开班，敬请关注。
热门课程推荐
热门资讯
-
想要了解iPhone6界面设计的尺寸规范吗？这里为您详细介绍iPhone6的UI设计尺寸规范，包括界面尺寸、图标尺寸、可点击高度规范、搜索栏高度规范以及界面元素之间的距离规范。
-
将为大家介绍12个绝佳的UI设计网站,这些网站不仅可以为你提供灵感,还可以帮助你学习新的技巧,助力你的创意之旅!dribbbleDribbble 是一个面向设计师的...
-
3. 移动端UI设计中常见的5种APP界面类型，你get到了吗？
通过介绍移动端UI设计中的闪屏页、引导页、浮层引导页、空白页和首页等5种APP界面类型，帮助大家更好地了解UI设计的基本知识
-
怎样可以提升你的UI设计能力!第一个:站酷站酷想必是设计师都知道的一个网站,里面不止有UI设计的资源,还有其他设计的,不如:平面设计、网页设计、字体...
-
在移动端设计中,列表页和表单页是不可或缺的部分。一个好的列表页和表单页设计能够让用户轻松地获取信息并产生点击欲望,从而提高点击率。本文将为你...
-
对于想要提高自己的设计能力和创造力的小白和UI设计师来说,这本书是一个很好的选择。4.《设计的觉醒》(IKKO TANAKA)推荐理由: 这本书是日本现代平面...
-
探索零基础UI设计培训的时长与薪资前景。了解数字艺术教育领域的专业课程，以及培训后的职业发展机会。
-
ui设计应该让用户一目了然,能够快速找到所需的信息和功能。在设计过程中,应尽量使用简洁的图标、文字和色彩,避免过多的视觉干扰。符合用户习惯:ui设...
-
想了解武汉UI设计培训班的费用是多少吗？不知道学UI设计要花多少钱？不妨看看这篇文章，了解UI设计培训班的学费价格以及学习内容。
-
10. 设计中的色彩心理学:浅析中西方色彩的历史演变与设计应用
摘要:本文探讨了色彩的历史演变和设计应用。通过对色彩在早期文明社会中的实用运用、不同文化背景下色彩观念的差异、色彩在设计中的重要性以及新兴技...
