创业板上市筹备企业

【微信表单制作】制作一个用户友好型表单,用它就够了!

微信表单制作制作一个用户友好型表单,用它就够了!

 

作为负责网页中数据采集功能的头号猛将,表单扮演着十分重要的角色。当然,表单不仅仅是网页设计中的常见元素,也和企业乃至个人都有着休戚相关的联系。因为表单有着强大的数据收集/采集功能。注册、下单、购买,这些日常生活中经常见行为,背后都有表单的影子。既然有着数据采集的功能,那当表单撞上日活超10亿的微信会擦出什么火花呢?那今天就和大家说说微信表单制作的一些事儿。

 

从简单的电子邮件搜集和订阅,到注册、下单、购买,表单一直伴随着网页而存在。涉及到数据收集时,我们大多数情况下也会采用表单。因此,创建一个用户友好型表单对表单的填写效率至关重要。

 

那如何制作一个完美级的用户友好型微信表单呢?我们不妨来看看人人秀H5制作工具的在线表单功能。

 

人人秀H5制作工具——在线表单

 

H5页面中,一个简易的表单通常由姓名、联系方式、和表单提交3部分组成;复杂的表单还可以包括单/复选框、评分、详细信息等更多内容。更加高级的表单需要和问卷调查功能相互配合,二者结合能够做出十分复杂,贴近现实调查表单的一份H5表单。

 

如何制作表单

根据需求的不同,表单的制作方法也不尽相同,不过最基础的部分却是相通的。下面请跟着我来一起做一份表单。如果您没有时间一步一步看下去,请直接看最后一步表单模板一键套用。

 

主要步骤

一、创建姓名框

二、创建手机框

三、创建选择框(以下拉菜单为例)

四、制作评分系统

五、短信验证

六、提交按钮

七、表单美化

八、后台查询数据

 

完成效果

微信表单制作

 

一、创建姓名框

首先打开您的人人秀制作页面,并选择好背景或者模板。

选择屏幕右侧的表单按钮,弹出选项栏,在弹出栏中我们可以看到输入框、单选、下拉菜单等一共14种表单类型和单页模板的链接按钮。我们现在需要姓名输入框,鼠标左键点选输入框。

 

选中我们添加的输入框,在右侧可以调节输入框类型,点击类型下拉菜单,并选择姓名。因为姓名是每个用户的基础信息,我们必须获得,所以勾选必填。然后把输入框调整到一个合适的位置。

 

二、创建手机框

再次创建一个输入框,将类型选择为手机,并调整至合适位置。

这样,人人秀系统就会知道您所需要的数据类型是手机号码,并自动帮您过滤部分虚假手机号。如果您需要邮箱账号,也可以选择邮箱,人人秀系统也会自动帮您识别用户填写内容是否为有效的邮箱格式。

因为每个手机号或邮箱号都只能对应一个有效用户。所以,您需要在右侧勾选唯一。这样,当有人重复填写手机号码时,就会得到人人秀的提醒,并禁止他填写此号码。

如果您需要所有的人都填写自己的手机,那么需要勾选唯一上方的必填。

 

三、创建选择框

获得用户姓名以及联系方式后,我们需要获得一些其他信息,比如性别、职业等。所以我们需要再次点选表单按钮,根据您的需求选择单选、多选、下拉菜单、多级下拉等类型的表单。

这里我们以获得用户所在部门为例,选择下拉菜单,并调整选框位置。更改标题为“部门”。

选择选项中的设置按钮,可以更改下拉选项。点击添加按钮添加选项,点击已添加选项后面的删除按钮可以删除它。我们添加5个选项,并分别填写“人事”、“财务”、“技术”、“生产”、“其它”作为5个下拉选项。

如果我们还需要反馈意见或个人简介等无法使用选择获得的信息,可以再次添加一个输入框,将鼠标放在输入框的边界可以调节大小。然后更改标题,并调整至合适位置,选择类型为文本。这里我们想要获得用户的个人简介,那么可以更改标题为“个人简介”。

 

四、制作评分系统

 

五、短信验证

 

六、提交按钮

 

七、表单美化

完成表单的基本功能后,我们需要对它进行美化,使其更加符合我们的需求。在这里,我们将对表单的整体样式做一个调整。

首先选择您所创建的每一个表单分项,按住鼠标左键拖动它,将其调整至合适位置。

然后点击右侧弹出栏中的样式选项,分别对颜色等属性进行调整。其中的透明度选项是文字透明度,而非表单透明度。

依次调整每一个表单,调整完后如图所示。使用位置可以对表单的位置进行细微调整。

接下来只需要点击发布,就可以使用啦!

 

八、后台查询数据

发布成功后,如果有用户填写了您的表单内容,您可以在个人中心看到用户所填写的资料,并对其进行管理。鼠标移动到自己制作的H5上,点击数据,即可查看。

 

无论是注册流程、多屏分步表单,或者是单调的数据列表界面,表单都是数字产品设计中的重要组成部分。本文会探讨表单设计的注意事项。记住这些只是通用规范,每条准则总有例外。

 

下面分享一些表单设计中应当注意的事项。

 

注意事项1:表单应该只有一列

多列布局会扰乱用户垂直方向的视线移动。

 

注意事项2:顶部标签

顶部标签的表单比左侧标签有更高的完成率。顶部标签的表单也易于移植到移动端。但是,对于有多种选择项的大量数据列表而言,请考虑使用左侧标签,因为它们在一起更易于浏览,能够减少高度,比顶部标签更贴心。

 

注意事项3:把标签与输入框成组排列

把标签和输入框贴近排列,确保项目之间留有足够高度,防止用户困惑。

 

注意事项4:避免全大写标签

全大写标签更难阅读和浏览。

 

注意事项5:逐行说明错误

告诉用户哪里错了,说明原因。

逐行验证要在用户填完一行之后进行(除非填写中验证更有帮助)

别在用户打字的时候进行逐行验证,除非这对他们有帮助——例如创建密码、用户名之类,或者字符数提示信息。

 

注意事项6:不要隐藏基本的帮助提示文案

尽可能直接展示基本的帮助提示文案。对于复杂的提示文案,可以考虑在输入框激活时,展现在它旁边。

 

让表单变得有趣,就用人人秀H5制作工具——在线表单制作功能!


人人秀原创文章,如若转载请注明出处:https://rrx.cn/content-wxbiaodanzz