写点什么

表单设计: 一页只做一件事(三)

  • 2019-12-30
  • 本文字数:1315 字

    阅读完需:约 4 分钟

表单设计:一页只做一件事(三)
  1. 解决了性能问题


如果每件事都复杂无比——单页应用就是一个极端例子——性能问题就很难解决。是因为执行时间问题?内存泄漏?还是 AJAX 请求导致的?


人们很容易认为 AJAX 能提升用户体验,但增加代码量很少情况能创造更快的体验。


复杂性转移到客户端,会掩盖服务端的根本问题。但如果页面只做一件事情,性能问题就不容易产生。如果真发生了问题,排查原因也很容易。


  1. 它有一种在前进的感觉


因为用户在不停地前往下一步,会产生一种正在前进的感觉,在用户填写表单时给他们一种积极的感受。


  1. 降低丢失信息的风险


长表单需要更长时间来完成。如果所花时间太长,页面超时可能导致信息丢失,产生严重的挫败感。


又或者,电脑可能卡死,*《我是布莱克》*里的主角 Daniel 就是这样的例子。他的健康每况愈下,而且第一次用电脑就遇到了死机,然后数据丢失。最终他放弃了。


  1. 第二次使用的体验更顺畅


比如,假设我们储存了用户的支付信息,我们可以直接跳过那一页,直接带他们去“结账确认”页面。这会减少阻碍,提升转化率。


  1. 这是移动优先设计的一种补充


移动优先的设计,提倡在小屏幕上只呈现最重要的信息。一页只做一件事,也遵循着相同的方式。


  1. 设计过程很简单


当我们设计一套复杂流程时,分解成细小页面和组件,可以让人更容易理解这些问题。


还可以方便地调换页面来改变顺序。我们一次只研究一件事,这点和用户一样,能让我们更轻松地分析问题。


这可以减轻设计负担——这种模式让用户受益的同时,还能有这样的附加福利。


这种模式适合所有情况吗?


也不完全是。Caroline Jarrett 在 2015 年写过一篇文章《一页只做一件事》,里面讲得很清楚。她解释道,用户调研“会告诉你某些问题组合起来放在长页面里更合适”。


但是反过来,她也提到了“对于设计师来说‘属于一组’的问题……对于用户而言,并不一定要放在一个页面上”。


她提出了一个颇具启发性的例子,GOV.UK 的验证页面中,他们尝试把“创建用户名”和“创建密码”先后放在两个页面上。


就像许多设计师所认为的,Caroline 觉得把这两者放在不同页面有点太过了。实际上,用户对此一点也不介意。


关键在于,以一页只做一件事为出发点,然后通过用户研究,验证把其中一些项目编组合并,是否能进一步改善用户体验。


这并不代表最终结果一定是把页面合并——在我经验中,最好的结果往往是把事情拆分开来,仅此而已。当然,我也希望听听你的经验。


总结


这种低调不起眼的用户体验设计模式很灵活、高性能、有包容性。这是真正拥抱互联网的方式,对于自信满满和小心翼翼的用户而言都很简单。


一个页面上展现很多(或者全部)内容可能会营造一种简单的幻象,但就像代数式问题一样,除非把它们分解,否则很难处理。


如果把任务看作是用户想要完成的一笔交易,把它分解为多个小步骤很有必要。这就像我们在用网页的一砖一瓦来搭建渐进式表单。每一页背后的隐喻,都给潜意识营造一种正在前进的感觉。


我还没有遇到过哪种其他的设计模式,能具备这么多的优点。这就是那种真理时刻——答案总是最简单的。


作者信息:Adam Silver


原文链接:https://www.smashingmagazine.com/2017/05/better-form-design-one-thing-per-page/


本文转载自 Think 体验设计公众号。


原文链接:https://mp.weixin.qq.com/s/7yIAqH7nFhPHMtfmi_VeaQ


2019-12-30 18:02700

评论

发布
暂无评论
发现更多内容

昇思MindSpore全场景AI框架 1.6版本,更高的开发效率,更好地服务开发者

Geek_32c4d0

mindspore 昇思 全场景AI框架

虎符交易所HOO持续创造今年新高,你的HOO囤够了吗?

区块链前沿News

加密资产 Hoo 虎符交易所 平台币

web前端培训:react高频面试题分享

@零度

前端开发 React

【IT运维】多台海外主机运维用什么工具好?

行云管家

服务器 IT运维 服务器运维 海外主机

程序员最讨厌的四件事,它能解决!

博文视点Broadview

数据预处理和特征选择

云智慧AIOps社区

数据挖掘 机器学习 算法 特征选择 数据预处理

来,2W字+23张图+5W1H分析法帮你彻底拿下缓存

小梁编程汇

缓存 缓存穿透 缓存击穿 缓存并发 缓存服务

网络协议之:socket协议详解之Socket和Stream Socket

程序那些事

网络协议 程序那些事 3月月更 MIME

HertzBeat赫兹节拍 v1.0.beta.5 发布,易用友好的监控告警系统

TanCloud探云

Java angular 告警 应用监控 开源监控系统

Java面向对象知识点拆分(一)

逆锋起笔

面向对象 java基础 3月月更 Java面向对象

MySQL系列文章---初识MySQL中的锁

NoLongerConfused

3月月更

浏览器工作原理和V8引擎

CRMEB

【ELT.ZIP】OpenHarmony啃论文俱乐部——多维探秘通用无损压缩

ELT.ZIP

OpenHarmony 压缩算法

小白入门HarmonyOS Connect设备开发的“芯”路历程

HarmonyOS开发者

芯片 HarmonyOS 设备

三级等保是最高的吗?有什么用?

行云管家

网络安全 等保 等保2.0

N个技巧,编写更高效 Dockerfile|云效工程师指北

阿里云云效

阿里云 云原生 Dockerfile 部署与维护 构建工具

ICASSP 2022 | 前沿音视频成果分享:基于可变形卷积的压缩视频质量增强网络

阿里云CloudImagine

阿里云 计算机视觉 音视频 视频编码 视频云

全链路压测(六):确认范围和识别风险

老张

性能测试 全链路压测 稳定性保障

如何保持系统的整洁

蜜糖的代码注释

设计原则 项目开发 3月月更

轻松应对1亿+月活,《迷你世界》背后有啥黑科技

华为云开发者联盟

分布式数据库 中间件 RDS 迷你世界

Java基础系列文章---异常

NoLongerConfused

3月月更

人工智能开源录 | 对话OpenI启智社区:智能无处不在,AI开源创新的发展与探索

OpenI启智社区

软件工程 大模型 东数西算 人工智能开源

AI语音处理-文字合成语音功能

DS小龙哥

3月月更

基于CREATE TYPE语法自定义新数据类型

华为云开发者联盟

数据库 数据类型 CREATE TYPE 复合类型

Go语言实战之映射的内部实现和基础功能

山河已无恙

golng 3月月更

[ CKS 备考指南 -01 ] 总览(送免费 15% 折扣券)

baiyutang

Kubernetes 运维 k8s 开源文化 CKS

RocketMQ系列文章---RocketMQ整体架构

NoLongerConfused

RocketMQ

Redis二三事之事前预防和事中恢复

NoLongerConfused

3月月更

教你如何解决JS/TS里特定String进行拆分然后遍历各个元素

华为云开发者联盟

JavaScript string 遍历 字符串 元素

TiDB 可观测性方案落地探索 | “我们这么菜评委不会生气吧”团队访谈

PingCAP

用测试来学习 Go

baiyutang

golang

表单设计:一页只做一件事(三)_语言 & 开发_Think体验设计_InfoQ精选文章