APP178手游网
全部
您的位置:APP178手游网 > 综合新闻 > 微信小程序设计指南 微信小程序ui设计规范汇总

微信小程序设计指南 微信小程序ui设计规范汇总

时间:2016-11-04 18:11:21 作者:游戏厂商 来源:APP178手游网整理 我要评论

  页面全局操作结果——模态对话框

  对于需要用户明确知晓的操作结果状态可通过模态对话框来提示,并可附带下一步操作指引。

微信小程序设计指南 微信小程序ui设计规范汇总20

  页面全局操作结果—结果页

  对于操作结果已经是当前流程的终结的情况,可使用操作结果页来反馈。这种方式最为强烈和明确的告知用户操作已经完成,并可根据实际情况给出下一步操作的指引。

微信小程序设计指南 微信小程序ui设计规范汇总21

  异常可控,有路可退

  在设计任何的任务和流程时,异常状态和流程往往容易被忽略,而这些异常场景往往是用户最为沮丧和需要帮助的时候,因此需要格外注意异常状态的设计,在出现异常时予以用户必要的状态提示,并告知解决方案,使其有路可退。

  要杜绝异常状态下,用户莫名其妙又无处可去,卡在某一个页面的情况。2.2中所提到的弹窗和结果页面都可作为异常状态的提醒方式。除此之外,在表单页面中尤其是表单项较多的页面中,还应明确指出出错项目,以便用户修改。

  异常状态——表单出错

  表单报错,在表单顶部告知错误原因,并标识出错误字段提示用户修改

微信小程序设计指南 微信小程序ui设计规范汇总22

  便捷优雅

  从PC时代的物理键盘鼠标到移动端时代手指,虽然输入设备极大精简,但是手指操作的准确性却大大不如键盘鼠标精确。为了适应这个变化,需要开发者在设计过程中充分利用手机特性,让用户便捷优雅的操控界面。

  减少输入

  由于手机键盘区域小且密集,输入困难的同时还易引起输入错误,因此在设计小程序页面时因尽量减少用户输入,利用现有接口或其他一些易于操作的选择控件来改善用户输入的体验。

  减少输入,巧用接口

  例如下图中,在添加银行卡时,采用摄像头识别接口来帮助用户输入。除此之外微信团队还对外开放例如地理位置接口等多种微信小程序接口 ,充分利用这些接口将大大提高用户输入的效率和准确性,进而优化体验。

微信小程序设计指南 微信小程序ui设计规范汇总23

< 1 2 3 4 5 6 7 8 >

网友评论
  • 新游榜
  • 总排行