一:如何确定设计风格
1.寻找产品气质。(忠于产品目标和产品方向,形式服务于功能。)
2.确定主色,一般品牌色为主色。(主色是应用颜色中的灵魂,更是一种可以强化的视觉的识别信号。)
3.图标插图。(图标和插图可以生动的折射出应用的整体风格。)
4.选用符合产品气质的字体。(恰当地运用字体,可以使产品的定位和内容的情感得到加倍的表达。)
5.排版。(应用界面的排版设计决定应用最终的视觉形象,传达应用的个性气质,对应用的品牌形象有重要的影响。)
6.文案。(文案可以加速产品信息的传播,提高应用效率,直接体现应用的气质。)
二.APP图标特点
1.独特的图形。(功能性和独特性)
2.表意准确。(与用户的心理隐喻贴合)
3.谨慎用色。(研究各种色彩由生活联想而产生的普遍意义,又要充分了解用户的色彩欣赏习惯和审美心理,在众多个性反应中寻找共性因素。)
4.避免使用大量文字。(使用特殊符号或公司标志作象征。)
5.避免使用照片。
6.适应不同场景。(美观、清晰)
三.App图标设计流程
1.寻找隐喻
2.抽象图形
3.竞品分析
4.确定风格
5.调整细节
6.场景测试
四.App图标设计方法
1.正负形组合(提高应用图形的信息承载能力和表达功能,在视觉上具有更强烈的错视感和冲击力,丰富应用图形的表现力。)
2.折叠图形(分析图形的轮廓走向,在图形结尾或转角处做局部折叠处理。)
3.局部提取(提取局部有代表性的元素进行设计。)
4.线性图标(控制线条的粗细,走向,连接或中断,形成各种各样的风格。)
5.透明渐变(对图形放大或者缩小叠加不同透明度的图形,形成一个层次丰富,形态饱满的图形组合。)
6.色块拼接(把图形分割成有规律的块状,并填充颜色,颜色可按照色轮有规律排布。)
7.图形复用(对主图形进行复制,通过透明度或者大小变化,创造出一种图形阵列之美。)
8.背景组合(背景可以选用和主题相关的元素,也可以选用常见的有规律的条纹或格子纹。)
五.iOS图标规范
1.App图标

2.App Store图标(1024*1024)
3.标签栏导航图标(50*50)
4.导航栏图标(44*44)
5.工具栏图标(44*44)
6.设置图标(58*58)
7.Web Clip图标(120*120)

六.Android图标规范


七.iOS系统界面

八.建立规范
目的:统一性、协同性、高效性
颜色规范


文字规范










点九图

网友评论