微信小程序设计怎样提高用户体验

2017年6月14日，微信小程序设计已经是当下最热门的话题，下面将从多方面来谈谈微信小程序设计怎样提高用户体验相关的内容。

6月14日消息，据彭博社报道，为了与新东家沃尔玛（Walmart）融合得更加顺畅，Jet.com（去年8月被沃尔玛以33亿美元收购）正计划逐步剔除自己平台上所售的Costco旗下品牌产品。

6月18日，永辉将在福州开出第一家永辉生活店。值得注意的是，这也是永辉首家24小时营业门店。据了解，这家24小时门店商品由永辉物流统一配送，没有熟食但提供蔬菜水果以及冷冻冰鲜类商品。

基于小程序轻快的特点，在充分尊重用户知情权和操作权的基础之上，如何建立友好、高效、一致的用户体验呢?

1、重点突出

每个页面都应有明确的重点，以便于用户每进入一个新页面的时候都能快速地理解页面内容，应尽量避免无关的干扰因素。

以查询为例，页面内容可以出现的应该是：最近搜索词、热点搜索词，这些可以提升用户操作体验的内容。

过多与用户的目标无关内容，易造成用户的迷失。下图案例，广告的内容基本占了整个版面的50%，极度可能被拒绝上架。

2、流程明确

在用户进行某一个操作流程时，应避免出现用户目标流程之外的内容而打断用户。比如：用户在使用租车服务时，弹出来的抽奖活动

3、导航明确

小程序的全部页面，均会自带有微信提供的导航栏，统一解决当前在哪，如何回去的问题。在微信层级导航保持体验一致，有助于用户在微信内形成统一的体验和交互认知，无需在各小程序和微信切换中新增学习成本或改变使用习惯。

小程序各种限制跳转层级，并明确指出建议开发者可以让用户2步到想到的地方，这就需要不同导航方式进行配合使用了。

(1)微信导航栏，直接继承于客户端，除导航栏颜色之外，开发者无需亦不可对其中的内容进行自定义。选择的颜色需要在满足可用性前提下，和谐搭配微信提供的两套主导航栏图标。

(2)页面内导航，开发者在页面内添加自有的导航需保持不同页面间导航一致。因尽量简单，若仅为一般线性浏览的页面建议仅使用微信导航栏即可。

(3)标签分页(Tab)导航，可固定在页面顶部或者底部，便于用户在不同的分页间做切换。标签数量不得少于2个，最多不得超过5个，为确保点击区域，建议标签数量不超过4项。一个页面也不应出现一组以上的标签分页栏

顶部标签分页栏颜色可自定义。在自定义颜色选择中，务必注意保持分页栏标签的可用性、可视性和可操作性。

4、加载反馈

当不可避免的出现了加载和等待的时候，需要予以及时的反馈以舒缓用户等待的不良情绪。

(1)启动页加载，小程序启动页是小程序在微信内容一定程度上展现品牌特征的页面之一，开发者只能定义品牌Logo、小程序名称。无需开发者开发。

(2)页面下拉刷新加载，开发者无需自行开发。标准的刷新样式和动画，能向用户明确的小程序归属者，防止造假与作弊。

(3)页面内加载反馈，开发者可在小程序里自定义页面内容的加载样式，自定义加载样式都应该尽可能简洁，并使用简单动画告知用户加载过程。

(4)局部加载反馈，即只在触发加载的页面局部进行反馈，这样的反馈机制更加有针对性，页面跳动小，是微信推荐的反馈方式。

注意事项：

若载入时间较长,应提供取消操作,并使用进度条显示载入的进度。

载入过程中,应保持动画效果 ; 无动画效果的加载很容易让人产生该界面已经卡死的错觉。

不要在同一个页面同时使用超过1个加载动画。

5、结果反馈

根据实际情况，操作的结果也应予以明确反馈，可选择不同的结果反馈样式。

(1)页面局部操作结果反馈，可在操作区域予以直接反馈。常用控件，微信设计中心将提供控件库，其中的控件都已提供完整操作反馈

(2)页面级操作结果反馈，可使用弹出式提示(Toast)、模态对话框或结果页面展示

①弹出式提示(Toast)适用于轻量级的成功提示，1.5秒后自动消失，并不打断流程，对用户影响较小，适用于不需要强调的操作提醒，例如成功提示。特别注意该形式不适用于错误提示，因为错误提示需明确告知用户，因而不适合使用一闪而过的弹出式提示。

②模态对话框，对于需要用户明确知晓的操作结果状态进行提示，并可附带下一步操作指引。比如：用户信息和地理位置的获取操作。

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

6、有路可退

在出现异常时予以用户必要的状态提示，并告知解决方案，使其有路可退。在表单页面中尤其是表单项较多的页面中，应明确指出出错项目，以便用户修改。

7、减少输入

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

①采用摄像头识别接口来帮助用户输入

②利用组件让用户做选择而不是键盘输入(picker三级联动等)

8、统一稳定

除了以上所提到的种种原则，建议接入微信的小程序还应该时刻注意不同页面间的统一性和延续性，在不同的页面尽量使用一致的控件和交互方式。

统一的页面体验和有延续性的界面元素都将帮助用最少的学习成本达成使用目标，减轻页面跳动所造成的不适感。正因如此，小程序可根据需要使用微信提供的标准控件，以达到统一稳定的目的。

当然这一切的前提是你的小程序是可以被上架的。至于你的小程序是否可以上架的判断?请参考 知道吗?你的小程序可能不能上线! ，更加详细的内容，请移步腾讯官方规范内容。

 

想了解更多微信小程序开发和微信小程序大全都可以进入微信小程序商城系统开发了解。