千锋教育-做有情怀、有良心、有品质的职业教育机构

手机站
千锋教育

千锋学习站 | 随时随地免费学

千锋教育

扫一扫进入千锋手机站

领取全套视频
千锋教育

关注千锋学习站小程序
随时随地免费学习课程

当前位置:首页  >  技术干货  > 面性图标的ui应该如何设计

面性图标的ui应该如何设计

来源:千锋教育
发布人:qyf
时间: 2022-08-31 17:10:02 1661937002

面性图标的ui应该如何设计

  面性图标的ui应该如何设计?与线性图标相比,面性图标设计没有那么繁琐,有更多的选择性与延展性,对于ui设计培训的设计小白来说应该怎么设计好面性图标确实值得我们的注意。

  一、面性图标

  面性图标比线性图标更能表达出图标的力量感和重量感,比线性图标会更加容易吸引用户目光,在识别度上,面性图标更加依赖于外轮廓的清晰度,因此在设计时对于外形的打磨是重中之重,清晰的外轮廓可以帮助提高识别度。

  二、面性图标的基础分析及想法

  1、镂空对比

  适当的镂空除了补充了图形的识别度外,还提升了面性图标的设计细节。另外,需要控制好镂空部分与整体的外形比例,过小或过大都可能影响图标的平衡感。

  2、繁简对比

  设计面性图标时,对于多余细节的管理也很重要。随着细节的增加,块面切割过多,会使得整体图标变得过于零碎,保持简约的设计提高图标的识别度,在关键的特征细节上做补充。

  3、轮廓对比

  轮廓的差异会体现出不同的气质,流畅的外形可以让面形图标的整体更加简洁、规整。

  4、形体对比

  形态上的差异也会具有不一样的视觉感知,单独形体与组合之后的形体相比视觉感知更直观些,而组合形的图标相对会精致一些,多了一些层次。ui设计的经验是:越小的图标形体应该越简单,因此建议单体出现较好;若图标的尺寸足够大时可采用组合型的设计,补充图标的细节。

  三、面性图标类型拓展

  1、微质感渐变

  微弱的渐变提升了图标的质感,渐变的方向会影响整体图标的视觉效果,因此可以根据不同设计的需要进行调整。

  2、单色面+点缀色

  整体的外形使用统一的颜色,结合图标的属性感知使用不同的颜色进行点缀,通过点缀色提亮了图标的视觉效果,达到既统一又具有差异化的效果。

  3、颜色叠加穿透

  图标透明叠加之后产生了交错的负形,叠加出第三个面,虽然整体设计依然保持着扁平化,但却多了一份层次感,并且增加了图标的细节。

  面性图标的ui应该如何设计?面性图标类型的拓展还有很多种形式,设计师们在实际操作过程中,可以结合产品特性,适当增加或选择不同的呈现形式,来提高面性图标的设计感与实用性。

  更多关于“UI设计培训”的问题,欢迎咨询千锋教育在线名师。千锋教育多年办学,课程大纲紧跟企业需求,更科学更严谨,每年培养泛IT人才近2万人。不论你是零基础还是想提升,都可以找到适合的班型,千锋教育随时欢迎你来试听。

tags:
声明:本站稿件版权均属千锋教育所有,未经许可不得擅自转载。
10年以上业内强师集结,手把手带你蜕变精英
请您保持通讯畅通,专属学习老师24小时内将与您1V1沟通
免费领取
今日已有369人领取成功
刘同学 138****2860 刚刚成功领取
王同学 131****2015 刚刚成功领取
张同学 133****4652 刚刚成功领取
李同学 135****8607 刚刚成功领取
杨同学 132****5667 刚刚成功领取
岳同学 134****6652 刚刚成功领取
梁同学 157****2950 刚刚成功领取
刘同学 189****1015 刚刚成功领取
张同学 155****4678 刚刚成功领取
邹同学 139****2907 刚刚成功领取
董同学 138****2867 刚刚成功领取
周同学 136****3602 刚刚成功领取
相关推荐HOT