小程序学习总结
2019-06-10 本文已影响0人
ISIS卡拉肖克
1 基础规范：
1.1 2个 ≤ 底部导航 ≤ 4个（确保点击区域）。
image.png
1.2 操作成功提醒/20字左右的文案提示，都可以设置1.5秒自动消失，用户体验最佳。
image.png
1.3 表单类页面：减少密集输入，合理设计可分步操作，能选择的尽量不要输入。
image.png
1.4 搜索类交互：建议设计搜索历史快捷选项，减少键盘输入进而提升用户体验。
image.png
1.5 点击类控件，其操作区域，建议设计物理尺寸为7mm~9mm之间，用户体验最佳。
image.png
1.6 视觉规范：
1.6.1 字号使用场景规范：
image.png
1.6.2 字体颜色规范：
image.png
主内容 Black 黑色，次要内容 Grey 灰色；时间戳与表单缺省值 Light 灰色；大段的说明内容而且属于主要内容用 Semi 黑。
image.png
蓝色为链接用色，绿色为完成字样色，红色为出错用色 Press 与 Disable 状态分别降低透明度为20%与10%。
image.png
1.6.3 列表
image.png
1.6.4 表单输入
image.png
1.6.5 按钮
image.png
image.png
image.png
image.png
1.6.6 图标
image.png
image.png
1.7 页面路径纵向最多设计5层
小程序页面纵向只有5层，超出时点击页面无任何反馈，页面冻结。所以要严格控制页面的层级数量
1.8 兼顾开发调试测试方便
页面步骤类交互，尽量设计交互的可逆性
1.9 注意不能设计有诱导用户分享类功能
这类过不了审核，同时可能会被封号
2 小程序限制的功能点总结：
- 不支持分享推文链接
- 不可分享到朋友圈
- 不能长按识别二维码
- 不能从小程序跳转至APP；（但是存在特例：如果从APP分享小程序到微信打开，是可以从微信的小程序唤醒APP)
3 小程序对比网站&app的优势：
3.1 开发成本低、效率快（对比app）
app的开发需要ios和安卓的工程师以及后台工程师，有些混合开发还需要H5前端的开发人员
3.2 获取用户成本低（对比app）
app推广难，忠诚度低
微信用户基数大，小程序不需要下载，门槛很低，用户使用目标明确
3.3 推广优势大（对比app）
小程序可以在微信内分享，分享到朋友圈，微信群等，其他人可以打开直接进入程序中，扩散速度呈几何式
3.4 使用门槛低（对比app）
微信小程序在UI和操作流程上对比app更加统一
3.5 可达性高（对比网站）
参考国人操作习惯，输入域名访问操作方式相对复杂
