优秀的表单设计:能顺利的让用户达到目的

文章描述:以用户视角出发的表单之旅.

用户使用发布表单,就像是一次旅行。旅行的目的是否能达到?过程是否让人满意?这些都决定了用户会否再来这里。

一、那么为什么要以用户的视角呢?

作为设计师,你是否遇到过这种情况:

· 我们额外加一个填写项,用来收集用户信息吧;
· 我们的表单之所以复杂,是因为我们希望用户多填写内容,这些内容都是有用是;
· 我们的表单应该在这最重要的一步出现,这样就能让更多的用户看到它…….

作为用户填表单时,你是否这样想?

· 我们填写表单只是为了达到我想要的目的,才不是为了你们收集信息;
· 如果可以,我希望填写更少的信息或者不用填写表单,来达到同样的目的;
· 在我想做A事情的时候,我根本不想看到B表单…….

以上的情境可能有些夸张,但是不可否认的是,有时候我们做表单设计的时候,并没有从用户的角度出发,看他们想要的是什么,而是从我们所在的产品端的角度,让用户去做我们想要他们做的事情。

二、如何以用户视角看post表单?

现在我们把之前的旅行的步骤放到post表单设计中,我们可以得到如下思路:

从中我们可以发现,似乎发布前和发布后这两个流程,比较容易被忽略。而过程中的设计点具体应该如何做呢?作为用户出发看看吧。

三、作为用户出发看表单

思路已经有了,那让我们作为用户出发探索一下post表单吧。

发布前:

作为用户,我会抱着一定目的,来找我需要的工具——post表单。

首先,我要从哪进入表单?

这个问题是针对用户在什么样的情境下会被引导到post表单,看下这个例子吧:

上图的post表单安排在你对网站有个基本认识,并且有意愿联系后出现,而且这样的从属关系让人很容易接受。

上图中的post入口都安排在账号相关的区域,而不是业务相关的区域,没有足够的理由说服用户从此来发布。

然后,它跟我的目的是否相符?

表单的开头应该向用户清楚的传达,该表单是做什么的,是否符合用户的期望,如果不,那么用户应该去哪?

上图的表单很清晰的向用户传达了目的,并提供了快速逃离出口。

图四中一些简要的介绍,会让用户对表单有个大致的认识,对复杂的信息有个心里准备,并且更能确认自己的目的。

而上图个页面,用户一进来印入眼帘的是长篇的规则介绍和各种功能入口,破坏了之前的引导传达给用户的印象,作为新用户的话,很难确认这里就是自己要找的地方。

发布中:

填写表单本身就是一件枯燥的事情,我希望能尽可能减少填写时的痛苦。

第一步,进入表单后,我希望看见干净简洁的页面。(整体感受)

这点虽然不能用数据量化,但是对用户的影响却不容忽视。

上图是改版前后的对比,能很明显的对比出页面的清爽与否,而且在数据上,改版后的也有较为明显的提升。

[1] [2]  下一页

时间: 2024-08-30 11:51:15

优秀的表单设计:能顺利的让用户达到目的的相关文章

优秀注册表单设计方法及案例分析

中介交易 http://www.aliyun.com/zixun/aggregation/6858.html">SEO诊断 淘宝客 云主机 技术大厅 摘要: 优秀注册表单设计方法及案例分析以下对国内外近20个网站的注册表单进行的分析,并归类总结优秀表单的设计方法.文章最后对其中三个案例进行优化对比. 1. 越少的填写项越好 Site inspire CSS web site award Tumblr De... 优秀注册表单设计方法及案例分析 以下对国内外近20个网站的注册表单进行的分析,

激发灵感的30个优秀定价表单设计

  每当用户准备在网上买东西或购买服务性商品时,他们主要看重产品特点和价格.销售就是要吸引用户的注意力,让产品特点和价格成为卖点,成功进行销售. 为此,简洁明了的定价表界面是非常重要的.你得让你的用户觉得,我们懂得存款的来之不易,所以我们的定价既能满足他们的需求又能符合预算. 在本文中,我们将会介绍30个激发灵感的优秀定价表设计,让你看到最好的设计作品. Hellothemes Skype Obox-Design Infusion Soft Form Stack Browser Mob Shop

学习网页制作之浅议 Web 表单设计

web|设计|网页 "输入框( Input )应当符合逻辑地划分为小组,这样大脑就可以很好的处理大堆区域间的关系."– <HTML权威指南> Web 应用程序总是利用表单来处理数据录入和配置,但并不是所有的表单都保持一致.输入区域的对齐方式,各自的标签(label),操作方式,以及周围的视觉元素都会或多或少影响用户的行为. 表单布局 考虑到用户完成表单填写的时间应当尽可能的短,并且收集的数据都是用户所熟悉的(比如姓名.地址.付费信息等),垂直对齐的标签和输入框可以说是最佳的

谈谈网页中的表单设计

Don't make users abandon in the first step!--谈谈网页中的表单设计 电子商务网站都会遇到用户常常在付款的最后一步放弃http://www.aliyun.com/zixun/aggregation/17553.html">购买商品(abandon in the last step),也就是常说的"购物车丢弃(shopping cart abandonment)".其实面对网络上越来越多的注册.登录信息的输入,用户常常因为&quo

Web表单设计:表单结构

你是否曾为表单设计感到过沮丧或不知所措呢?接下来三篇文章,希望能彻底改变你的看法,真正爱上Web表单设计.首先感谢Luke Wroblewski的帮助,让我有机会细心品味设计表单的乐趣.总体来说,Web表单主宰着结算.注册和数据输入.每天eBay.Taobao上的大量物品主要通过出售物品(Sell Your Item)表单售出:MySpace.Facebook等超过几亿的用户都是通过Web表单加入网站社区的:YouTube.Youku通过上传视频(Upload Your Video)表单收集了大

登陆表单设计案例:网页和APP登陆表单

文章描述:网页与APP中那些优美的登陆表单. 我从Dribbble收集了20个漂亮的登陆表单案例.希望你看后能从中受益,并对你以后的登陆表单设计有帮助.设计一个登陆表单看上去非常容易,但大多设计都很糟糕.毫无亮点.无论如何,这篇Dribbble案例集锦绝对走的是另一个极端.希望它们能赢得你的青睐!来一起欣赏吧:) 网站与APP中的登陆表单 继承了iOS7的精髓,这件登陆界面作品将iOS7微妙的动画背景上升到一个新的层面.此处的背景完全是一张动画图片--甚至可能是GIF.尽管这背景事实上没有那么精

Web表单设计:表单结构

[版权声明]:版权归作者Alite所有,转载时请以超链接形式标明文章原始出处和作者信息及本声明 原文地址::http://www.alitedesign.com 你是否曾为表单设计感到过沮丧或不知所措呢?接下来三篇文章,希望能彻底改变你的看法,真正爱上Web表单设计.首先感谢Luke Wroblewski的帮助,让我有机会细心品味设计表单的乐趣.总体来说,Web表单主宰着结算.注册和数据输入.每天eBay.Taobao上的大量物品主要通过出售物品(Sell Your Item)表单售出:MySp

网站表单设计:关于QQ邮箱注册过程的优化建议

中介交易 http://www.aliyun.com/zixun/aggregation/6858.html">SEO诊断 淘宝客 云主机 技术大厅 最近,研究了一下web表单的设计,收获颇多.从接触互联网以来,我们就一直在和各种表单打交道,它们无处不在,同时也为我们增添了很多不必要的烦 恼.但随着时间的推移,大多数网络用户对很难用却又千篇一律的表单已经产生了一种习惯,似乎即使体验过程并不美好,也不会发出反对声音,继续钻研. 但是,随着电子商务的兴起,表单设计的重要性又上了一个层次,因为很

WEB表单设计

设计师不再只是为互联网创造漂亮美观的图形那么简单了,作为一个WEB设计师,我们还需要考虑一些其他的问题,比如用户体验,算法,代码等等.如今用户体验设计越来越重要,对于WEB表单的设计尤其如此. WEB表单设计的目标是设计出一套让用户能够从填表到点击提交按钮的最简单的流程.这个过程中不需要太多的炫目效果,虽然jQuery的表单插件一直都很受欢迎.在这片文章中我们只关注于表单的用户体验和交互过程.这里的概念也能够有效的帮助你减少用户在填表过程中的挫折感. 保持醒目和简洁 我听过不计其数的用户抱怨注册