1 / 8
文档名称:

UI设计基础教程.docx

格式:docx   大小:267KB   页数:8页
下载后只包含 1 个 DOCX 格式的文档,没有任何的图纸或源代码,查看文件列表

如果您已付费下载过本站文档,您可以点这里二次下载

分享

预览

UI设计基础教程.docx

上传人:fangjinyan2017001 2021/4/14 文件大小:267 KB

下载得到文件列表

UI设计基础教程.docx

相关文档

文档介绍

文档介绍:图标设计基础教程
UI 最重要组建之一就是图标, 随着扁平化设计的发展趋势, 越来越注重图标的 简洁与寓意 表达,平面图标已占主导
地位。 `
【一】概念类别
扁平化图标大部分无非就是 剪影表现 ,而这里为什么重点是讲图标的形状设计,而非色彩,因为一切先有形才考虑
下一步。形不好再怎么营造整体风格都白费力,好比建筑造型与装修的关系,而色彩等营造的风格都可另起文章分
析 。图标造型表现上无非就是典型的 2 种:面与线 。运用这两种基础元素去造型也可以进行多种组合不同的表现 。
组合造型一般有单体造型、多个元素组合造型,线与面之间的独立与结合的变化。
简化的微写实图标
这类通常是彩色一体表现, 造型和组合上较写实, 不是纯剪影, 是写实过渡来的简化, 又接近剪影, 扁平简化设计,
这里主要是利用 面和颜色 来进行造型的设计。 质感风格上也有 6 种(已有人分析) ,大概是 纯平面、 折叠、轻质感、
折纸风、长投影、微立体 。这种相对剪影的好画很多,也更加容易塑造风格,更多是在色彩上有得发挥和考究,用
在界面里也是最为突出的。最近还非常流行用色块来进行二维、三维的装饰表达,叫所谓的“低面建模”。
上面提到的元素组合, 比如下图这个图标目前是 2 个元素 -- 信封加
信纸, 如果还要再加什么功能状态示意, 最多在右上角加个很小的
消息提醒。因为元素越多越复杂,所表达的含义也就越多,同时也
会影响造型的调动。 不管多少个元素总有一个 最重要的对象 ,其他
为辅助图形,在塑形大小复杂度上有区别。
剪影的正负形图标(面、线)
这类通常是 单色表现 ,当然也有综合彩色的。其更加

简洁抽象,

言简意赅 ,高度提炼精华,讲究

表象意境 ,具有
理解的门槛。所以这才是最难设计的一关。非常考究设计的理性与感性之间在 功能传达 上的逻辑思维。也是 UI 界
所谓 现代极简主义 的代表,注意,没把握好就会变得很“空虚”,把握好了就是时尚的 feel 啦 ~
负形图标 :以线绘制 的图形, 高度的轮廓概括 ,就跟画骨骼一样的要求精准到位,也叫 线形图标 。负形剪影是所有
图标中最讲究也最难表达型的一种风格,如果画不好就很容易俗气和简陋。
正形图标 :以面绘制 的图形,也有和线综合表现情况,自己根据需要进行创造变化吧。通常与负形图标之间做当前
状态的转换 ,手机 tab 上最常见,如 ios7 。
优点:简洁 清新优雅 ;极具现代感(虽然远古时代就有高度概括的符号表达, 这里指的范围是互联网上的全新应用) ;
具有设计与涵义综合的拓展性;还可以完成一些抽象词汇的图形传达。
图标为上传到云端的之意,这里的主对象是云