启动图标 加载页 引导页 首页 内容页
首页 状态栏 导航栏 内容区
电商App首页主要包括轮播图 快速通道 商品促销和展示
标签栏
底部为标签栏
APP设计的主要流程包括产品定位、交互设计、视觉设计、用户体验、项目开发、测试和运营
APP设计用色规范
主色
决定画面风格趋向的色彩 一般在LOGO和视觉面积较大的导航栏上使用。
辅助色
一般应用在APP中的控件、图标和插图上
点睛色
主要用在提示性的小图标或者需要重点突出的图形中
色彩对比
明暗对比 色相对比 面积对比 纯度对比
单个页面的颜色应保持在 3种以内
UI设计风格
1 扁平化 2 拟物化
扁平化风格 去掉多余透视 纹理 渐变 以及能做出3D效果的元素 而强调通过抽象 简化 符号化的设计元素来完成设计
扁平化设计要求所有元素的边界都干净利落 简单直接的将信息和事物的工作方式展示出来
五大原则
拒绝特效 仅使用简单元素 注重排版 关注色彩(趋势在于复古颜色的使用 浅橙色 紫色 绿色 蓝色) 最简方案
拟物化风格是指模拟现实物品的造型和质感 通过叠加 高光 纹理 材质 阴影等效果对实物进行再实现
ios 分辨率 750 1334
状态栏 75040 字体 24px
导航栏 75088 标题文字大小 34-40px 按钮文字一般不大于 32px
内容区 7501180 字体大小在22-36px
标签栏 75098 字体大小22-24px
android 分辨率 750 1280
状态栏 75050 字体 24px
导航栏 75096 标题文字大小 34-40px 按钮文字一般不大于 32px
内容区 7501038 字体大小在20-36px
标签栏 72096 字体大小22-24px