小程序平台设计了不同的权限管理使得项目管理者可以更加高效管理整个团队的协同工作。
在小程序的平台里,开发者完成开发之后,需要在开发者工具提交小程序的代码包,然后在小程序管理平台[【小程序管理平台】]( http://mp.weixin.qq.com)发布小程序,用户可以通过搜索或者其他入口来进入该小程序。
[【官方文档】](https://developers.weixin.qq.com/ebook?action=get_post_info&token=935589521&volumn=1&lang=zh_CN&book=miniprogram&docid=00062e5b94c9a06b00863ed475bc0a)
[TOC]
## 4.1 协同工作
## 4.2 用户体验审视
### 4.2.1 产品和运营思路
`一切以用户价值为依归`的产品观,让创造发挥价值。
产品设计过程中,开发者亦需要保持一定的克制心态。繁复的需求和商业行为,在用户利益前都需要谨慎平衡。
### 4.2.2 体验和设计评估
9点基础设计原则
1. **导航清晰**
导航需要告诉用户,当前在哪,可以去哪,如何回去等问题。开发者在小程序的设计中,应确保各个页面之间层级清晰明确。每个界面的导航,都指向清晰,有路可退。
![不同页面之间应保持明确的导航层级](https://box.kancloud.cn/fdbbbafd0f4b796148f67dcf2342364e_606x464.png)
:-: 图5-4 不同页面之间应保持明确的导航层级
2. **流程明确**
用户进行操作时,应确定当前页面只设置了单一任务,且不出现目标流程之外的内容。此举有利于让用户明确当前操作的目的,从而集中精力聚焦当前任务,并通过简单操作达到结果。
![出现目标流程之外的操作而打断用户的体验](https://box.kancloud.cn/68887fbc965e6fe413fdc47b0bf259db_845x509.png)
:-: 图5-5 出现目标流程之外的操作而打断用户的体验
3. **重点突出**
每个页面都应有明确的重点,以便于用户每进入一个新页面的时候都能快速理解页面内容。在确定过了重点的前提下,应尽量避免页面上出现其它与用户的决策和操作无关的干扰因素。
![搜索功能](https://box.kancloud.cn/c2642ddf4f9e6bb030d9a81e75bea06f_612x516.png)
:-: 图5-6 案例说明:搜索功能
![多按钮情况](https://box.kancloud.cn/42d88ae36a73ac66bdcfe9acd4dab395_610x520.png)
:-: 图5-7 案例说明:多按钮情况
4. 符合预期
对用户友好的产品,需要在其设计阶段便将自身信息架构和模型与用户的心理模型匹配,以便于用户能够依据以往的使用经验或其他生活经验,降低使用的理解和学习成本,从而快速达成使用目的。
5. **等待与反馈**
页面过长时间的等待会引起用户不良情绪。在不得不需要用户以一定的加载等待时间作为代价时,我们需要用明确的等待状态告知用户,以舒缓用户在等待时期的不良情绪。
在设计加载等待状态时,应注意以下事项:
* 若载入等待时间较长,应提供取消操作,并使用进度条显示载入的进度;
* 载入过程中,应保持动画效果;无动画效果的加载很容易让人产生该界面已经卡死的错觉;
* 不要在同一个页面同时使用超过1个加载动画。
![标题栏加载、Toast加载、按钮加载](https://box.kancloud.cn/452b95a4ec2e4720ab7c4c169f5c3caf_859x391.png)
:-: 图5-8 加载样式举例:标题栏加载、Toast加载、按钮加载
对于用户的操作结果,小程序也需要给出明确的结果反馈,以增强用户的操作信心和控制感。开发者可以根据实际情况,选择不同的反馈样式。例如,对于页面局部的操作,可在操作区域予直接反馈。对于页面级别的操作结果,可使用弹出式提示、模态对话框或结果页面展示。
![图标反馈、页面结果反馈、模态对话框反馈](https://box.kancloud.cn/9cfda6749ae9fa0655414f3cbb79f35d_856x365.png)
:-: 图5-9 反馈样式举例:图标反馈、页面结果反馈、模态对话框反馈
6. **异常处理**
在出现异常的时候需要给予用户清晰的状态提示,并告知解决方案,使其有路可退。
上文提到的模态对话框和结果页面都可以作为异常状态的提醒方式。除此之外,在表单项较多的页面中,应明确指出出错项目,以便用户修改。
:-: ![表单异常提醒](https://box.kancloud.cn/d45ec8d1c6ad88e680f3422261928059_308x409.png)
:-: 图5-10 表单异常提醒
7. **内容和文案准确友好**
需要斟酌使用内容和文案。使用的语言应当简洁,礼貌并容易被用户理解。此外,还要注意专业术语需要被清楚解释,特有词汇全局需用统一的特定表达,重要内容能够被快速获取,且页面不存在无关文案干扰用户决策。
8. **和谐统一**
小程序内的设计风格应该是统一、和谐且具有延续性的,这样才能确保用户建立完整的产品品牌认知,更好地辨析不同的小程序。
9. **平台适配**
在小程序的设计过程中,应该充分考虑iOS与Android平台不同的设计规范,对设计进行适当调整以适应不同平台上的用户使用习惯。
设计文档内容将不断进行修改、完善并更新,可以查看[【线上资讯】](https://mp.weixin.qq.com/debug/wxadoc/design/index.html)获取最新小程序信息。
### 4.2.3 用户体验测试和完善体验
我们建议开发者在发布之前,结合体验和设计评估过程,同步进行用户体验测试,以发现更多设计在实际场景和应用中,存在的难以预见的可用性问题。或者以用户测试环节,验证体验和设计评估迭代成果,在不断的更新和迭代中打磨小程序体验。
以下是我们关于进行用户体验测试的一些建议:
1. 用户体验测试,可以在设计、开发、测试等全部阶段使用。是一种低成本检测设计质量的方法。
2. 尽早进行用户体验测试。在产品及设计过程中,尚未启动开发时,便可以用低保真/高保真模型进行用户体验测试,以检测设计质量。这样更有利于及早发现问题并进行调整,减少开发成本。
3. 用户测试之前需要确定好需要被检验的流程和任务,需要为用户构建明确的目标,并提示用户以完成任务的方式完成目标。
4. 最好选择产品真实的受众,作为被测试的用户。并在测试时,使用户处于真实的场景和时间下。
5. 设计开放性的问题让用户回答。不用带有主观性的询问语言,引导用户回答。
6. 在用户测试过程中,需要全程做好记录。
- 微信
- 小程序
- 1. 代码组成
- 1.1 JSON配置--'*.json'文件
- 1.2 WXML模板--'*.wxml'文件
- 1.3 WXSS样式--'*.wxss'文件
- 1.4 JavaScript脚本--'*.js'文件
- 2. 客户端运行
- 2.1 逻辑层和渲染层
- 2.1.1 逻辑层--App Service
- 2.1.2 渲染层/视图层--View
- 2.1.3 通信模型
- 2.1.4 数据驱动
- 2.1.5 双线程下的界面渲染
- 2.2 程序与页面
- 2.3 组件
- 2.4 API
- 2.5 事件
- 2.6 兼容
- 3. 应用设计
- 3.1 Flex布局
- 3.2 界面常见的交互反馈
- 3.3 发起HTTPS网络通信--wx.request
- 3.4 微信登录
- 3.5 本地数据缓存
- 3.6 设备能力
- 4. 小程序的协同工作和发布
- 4.1 协同工作
- 4.2 用户体验审视
- 4.3 发布
- 4.4 运营
- 5. 底层框架
- 5.1 双线程模型
- 5.2 组件系统--Exparser框架
- 5.3 原生组件
- 5.4 小程序与客户端通信原理
- 6. 运行和性能优化
- 6.1 启动--代码加载
- 6.2 页面准备
- 6.3 数据通信
- 6.4 视图层渲染
- 6.5 原生组件通信
- 7. 小程序基础库的更新迭代
- 8. 微信开发者工具
- 腾讯云支持
- wafer
- Wafer2 快速开发 Demo - PHP
- WXAPI
- api列表