从《微信小程序设计指南》提取出的界面设计理念

我最近读了一下《微信小程序设计指南》,发现该指南提供了一种界面设计范本,这种指南不仅仅适用于微信小程序,还能为其他产品的界面设计提供一种思路。以下是提取出来的摘要,供界面设计时参考。

  1. 友好礼貌
    1. 重点突出——减少无关目标对用户的干扰,尽量避免页面上出现其它与用户的决策和操作无关的干扰因素
      建议:
      (1)减少焦点
      (2)操作有主次
    2. 流程明确——避免出现无关内容打断用户
  2. 清晰明确
    1. 导航明确,来去自如——当前在哪、可以去哪、如何回去
      建议:
      (1)移动端设计时,建议所有的次级页面左上角提供返回上一级页面操作;iOS用户可通过界面边缘向右滑动操作,返回上一级;安卓用户通过物理返回键返回上一级。
      (2)提供简单清晰的导航样式:标签导航介于2~5个之间,一般不要超过4个;导航颜色要清晰可见、便于区分。
    2. 减少等待
      等待和加载期间,考虑以下情况,并保持简洁:
      (1)启动页加载——突出品牌,提供加载进度
      (2)页面下啦刷新加载
      (3)页面内加载反馈
      (4)模态加载(覆盖整个页面)——谨慎使用,仅用于全局性操作
      (5)局部加载反馈(如按钮操作加载)——推荐
      (6)全局加载反馈——建议在标题处提供反馈
      加载反馈设计建议:
      (1)载入时间较长时提供取消操作,使用进度条显示载入的进度。
      (2)加载时保持动画效果。
      (3)1个页面仅出现1个加载动画。
    3. 反馈及时
      结果反馈样式的参考:
      (1)页面局部操作结果反馈(常用的控件,如复选框、单选框)
      (2)页面全局操作:图标型弹出提示——用于不需要强调的操作题型,如成功提示;切勿用于错误提示
      (3)页面全局操作:文字型弹出提示(诸如安卓Toast)——适用于轻量化文字提示、不严重的错误
      (4)页面全局操作:模态对话框——需要用户明确知晓的操作结果状态,可附带下一步操作指引
      (5)页面全局操作:结果页——最为强烈、明确的结果,可提供下一步操作指引
    4. 异常可控,有路可退——在用户沮丧、需要帮助时,提供黄台提示,并告知解决方案,时期有路可退
      例如表单出错:告知错误原因吧,并标识出错误字段,提示用户修改
  3. 便捷优雅
    1. 减少输入——减少使用键盘输入
      设计建议:
      (1)需要输入时,可选择利用接口输入,如摄像头识别、定位、语音输入
      (2)尽量减少用户手动输入,尽量让用户选择,如搜索历史记录
    2. 避免误操作——组件设计时,考虑页面点击效果和不同屏幕的适配
    3. 利用接口提升性能
  4. 统一稳定——留意不同页面之间的统一性和延续性,尽量使用一致的控件和交互方式,以便减少学习成本

已发布

分类

来自

评论

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

评论审核已启用。您的评论可能需要一段时间后才能被显示。