微信小程序的设计要求,须遵从轻巧的原则

    微信小程序设计应遵循“轻、巧”的原则。 所谓的“轻”,即轻量,用户可以在短时间内进入所需服务页面,在享受小程序带来的服务时没有心理负担,可以迅速离开服务页面。  ; 所谓的“巧”,就是巧妙的,包括巧妙的界面设计,巧妙的操作流程,巧妙的导航设计和巧妙的异常控制等,并且小程序的每个部分的设计都应该具有创造性。 如果仅将Web或APP上的服务移植到applet,就很难吸引用户,因此applet本身的设计应该在满足用户需求的基础上进行创新。

微信小程序的设计要求,须遵从轻巧的原则

    下面是微信官方发布的一些关于微信小程序设计原则的具体要求。


    1、重点突出,别除千扰


    微信小程序在设计页面时要突出重点,让用户在进入页面时能够快速理解,其页面内容,同时,在页面设计时还要剔除与用户决策和操作无关的干扰项。


    下面通过正面例子和反面例子来解释一下什么是“重点突出,剔除于扰”。例如,微信小程序的查询页面,按照其设计原则,只需要突出“请输入査询内容”即可,而不能涉及与查询无关的内容,这样才能突出页面主题。当然,在技术和页面控件允许的情况下,可添加一些有助于用户查询的帮助内容,比如,“最近搜索词”、“常用搜索词词”等信息。


    那么,什么是错误的页面查询示例呢?例如,有些人会在页面上加入“广告信息”,或者加入其他业务入口,比如,“今日日热点”、“头条新闻”、“最佳折扣”等信息。无论是广告还是与用户目标无关的入口,这些对用户来说都是干扰信息,容易让用户在操作过程中迷失。


    另外,为了尽可能地为用户剔除干扰,还要减少选择项目,以避免并列过多操作让用户难以选择。例如,页面出现“操作一”、“操作二”、“操作三”等选项,倒不如区分操作主次,以“主要操作”和“辅助操作”为选项,从而减轻用户的选择难度。


    总之,微信小程序设计要尽量避免影响用户,不增加任何干扰信息影响用户决策和操作,也不采用任何让用户为难的操作。


    2、流程明确,避免打断


    微信小程序在页面设计时为了让用户在操作过程中变得更流畅,应避免在操作流程中出现任何能打断用户操作的内容出现,比如,抽奖信息、广告信息、多余的提醒信息等。例如,当小程序用户进入搜索页面时,却被一个突如其来的抽奖弹窗所打断。


    很多人对一些突如其来的抽奖页面会很反感,即使是免费抽奖也被用户认为是一种很不友好的干扰,这将是小程序的减分项。即使有些用户被抽奖活动所吸引,跑去抽奖,这时可能就会把原本的目标遗忘,这时小程序就会失去对产品真正价值的利用和认识。因此,小程序创业者在设计操作流程时,一定要明确“下一步”该干什么,不能出现任何打扰用户操作的信息。例如,在“添加银行卡”页面面(如图5-6所示),只需要包含两项信息即可,包括“持卡人”和“卡号”,然后点击“下一步”即可。


    总之,微信小程序在设计操作页面时,一定要明确各个流程的操作信息,并尽可能地减少操作流程。


    3、导航明确,来去自如


    关于导航的内容,之前已经做了一些介绍,下面将对小程序创业者如何正确设计导航做详细介绍。导航是指导用户浏览网页、跳转网页的最关键因素,让用户知道“我在哪”、“我可以以去哪”、“如何返回”等信息。


    对微信小程序创业者而言,设计导航会更简单一些,因为微信为大家提供了统一的导航栏样式,能帮助用户统一解决“我在哪”、“我可以去哪”、“如何返回”等问题。微信之所以为开发者提供统一的层级导航栏,这主要是使微信小程序在微信内形成较为统一的体验和交互认知,而且还可以降低开发者在小程序和微信切换中的学习成本。


    微信为小程序提供的导航栏是固定的,与微信客户端的导航栏是一致的,不能对其样式进行自定义设计。开发者的主要工作就是设计小程序各个页面的跳转关系,要确保页面导航清晰明确,能让用户知道自己身在何处、又可以往何处去,让用户能够在页面之间来去自如,从而为用户提供安全、偷说的用户体验微信导航栏分为导航区、标题区和操作区三部分。目前,导航栏分深浅两种基本配色,而且在iOS和 Android系统中的展示也是不同的。其中,iOS导航区通常情况下只有返回上一级页面这一操作,开发者可定义各部分的内容,但不可对其样式进行自定义修改。


    Android导航区在系统导航左侧一般只有“离开小程序,回到微信,程序后台运行”这个唯一操作。当用户进入小程序次级页面后,建议小程序创业者可以设计返回操作,同H时用户也可以通过 Android系统自带的硬件返回按钮返回上一级。


    微信小程序开发者虽然不能改变导航栏的样式,但可改变导航栏的背景颜色。而选择的颜色需要在满足可用性、可视性的前提下,选择与提供的顶栏颜色相相和谐搭配的背景色。例如,米黄色和白色两者的可视性较差,导航栏所选择的背景色不能是米黄色,且字体是白色,或者背景色是白色,字体是米黄色。


    简而言之,页面导航设计应根据用户预期的操作步骤进行。 例如,当用户需要跳至下一页时,小程序仅需要出现一个允许用户跳出的操作按钮,并且不应随其弹出无关的广告,彩票和其他干扰项,因为这些内容 不符合用户进入下一页的预期。 此外,小程序导航设计还应旨在快速解决用户问题,并为用户提供清晰一致的导航步骤。 实际上,让开发人员这样做的目的还在于使微信小程序与张小龙提出的“用完即走”的概念相吻合。

我来说两句

0 条评论

推荐阅读

  • 响应式布局CSS媒体查询设备像素比介绍

    构建响应式网站布局最常见的是流体网格,灵活调整大小的站点布局技术,确保用户在使用的幕上获得完整的体验。响应式设计如何展示富媒体图像,可以通过以下几种方法。

    admin
  • 提升网站的性能快速加载的实用技巧

    网站速度很重要,快速加载的网站会带来更好的用户体验、更高的转化率、更多的参与度,而且在搜索引擎排名中也扮演重要角色,做SEO,网站硬件是起跑线,如果输在了起跑线,又怎么跟同行竞争。有许多方法可提升网站的性能,有一些技巧可以避免踩坑。

    admin
  • 织梦CMS TAG页找不到标签和实现彩色标签解决方法

    织梦cms是我们常见的网站程序系统的一款,在TAG标签中常常遇到的问题也很多。当我们点击 tags.php 页的某个标签的时候,有时会提示:“系统无此标签,可 能已经移除!” 但是我们检查程序后台,以及前台显示页面。这个标签确实存在,如果解决这个问题那?

    admin
  • HTML关于fieldset标签主要的作用

    在前端开发html页面中常用的标签很多,今天为大家带来的是关于HTML中fieldset标签主要的作用说明,根据技术分析HTML

    admin

精选专题