必看！弥散风UI设计风格应该这样用
深圳/产品设计师/1年前/827浏览
版权
必看！弥散风UI设计风格应该这样用
弥散光设计风格是近几年非常流行的设计趋势，虽然实际应用的地方很多，但落地到咱们中文字上，效果还是差强人意，每种风格有自己的特征，设计上需要克制。
01 定义
弥散风格定义：是一种通过色彩渐变模糊，形成虚实结合的有色光感效果的设计风格。这种风格的特点包括模糊、噪点、朦胧、虚化、暧昧等，营造出一种梦幻、抽象的氛围。
简而言之，就是通过渐变和其他设计元素相结合，可增强画面设计感，视觉效果更强烈，让信息更聚焦！对于弥散风可以概括两个字：
酷炫！
02 特点
弥散风格特点：虚实结合：弥散风格通过虚实变化，颜色边缘保留了较为清晰的轮廓，整体从观感上多了一些动感与变化层次，给人一种虚实结合的魔幻感噪点质感：在原有基础上多了一些复古气质，而且细节丰富，让画面看起来更有肌理感；视觉聚焦：聚焦重点信息，通过颜色对比来吸引人的目光，聚焦在想要凸显重要信息上；色彩流动感：渐变、光晕、流动与叠加等手法，色彩流动，多色融合，给人酷炫潮流之感；颜色叠加：不同颜色渐变叠加，打造柔和的背景纹理，提升设计的层次感；光晕模糊：模糊色彩柔化来达到虚幻和层次，通过光斑的运用来突出主题内容信息，增加设计的神秘感。
Dribbble和Behance上很多弥散风的案例，英文内容较少，排版非常适合符合这个风格，呈现的非常炸裂酷炫，把弥散风格的特点体现非常极致。
03 运用（重点）
根据其特点运用在中文排版上，感觉就差了很多（如下图）。在花瓣一搜，大部分的感觉都非常一般，达不到“酷炫”两字。
我个人感知而言，每个风格应该有自己调性，也就是自己性格。
弥散风格更符合用在
比较个性化
、
超前未来场景
，例如：音乐App、冥想App、Web3和元宇宙、登录注册页面、科技大会大型海报、发布会PPT等等。
1、元素之间的颜色对比反差要大，饱和度不能太低；
2、应用的产品和场景要求个性化、科技感比较强；
3、海报类需要与英文相结合。
国内QQ音乐APP运用得还是比较好的。
04 技法
https://www.uisdc.com/group/544991.html
总结
8种
常见的弥散渐变主视觉运用技巧
1、 深色背景上，使用高饱和度、明亮简洁的图形来呈现门的视觉感受，同时结合弥散渐变呈现神秘光效，营造简洁高级、神秘、吸引人的视觉效果。
2、 弥散渐变和背景弥漫过渡，视觉效果自然柔和，有层次。
3、 和人物结合可呈现柔和的氛围感。
4、 和图形图案结合画面更有设计感。
5、 渐变作为主视觉有节奏有对比，还可打造纵深感，重要信息更聚焦。
6、 运用弥散渐变呈现出数字的设计手法参考
7、 和磨砂玻璃相结合的设计手法参考
8、 运用在海报上的案例欣赏
04 参考
提供一些类型产品的源文件
（Figma/Sketch）
给大家参考临摹参考。
关注公众号：“
UX设计笔记
” ，回复 “ 弥散风 ” 就可获取链接。
12
举报
声明
3
分享
相关推荐
评论你的想法~
表情
喜欢TA的作品吗？喜欢就快来夸夸TA吧！
推荐素材
你可能喜欢
相关收藏夹
登录注册
12登录即可同步推荐记录哦
3登录即可加入我的收藏
评论登录即可评论想法
分享分享