浅析移动端表单设计思维-蜗牛派

浅析移动端表单设计思维

表单设计看上去很简单,组成它的每一个模块我们都很熟悉;表单设计其实也并不简单,除了基础的体验我们还需要结合其行业特性、自身业务才能设计一个好用的表单。

而这就是为什么我们要写一个表单设计系列的原因。

如果从功能角度来划分,表单一定是互联网产品中最为重要的能力之一,它也是用户与产品之间进行交互的一个重要渠道。如果没有表单产品的体验将变得非常的被动,用户只能消费平台所提供的内容。

作为用户我们在日常会遇到各式不同的表单,我们会发自内心的喜欢某个产品的设计,也会因为一些糟糕的设计而吐槽。每一个组件都没有问题,但合在一起就是不好用。如果仔细分析,你会发现其实它并不是一个简单的设计问题,除了表单基础体验它还和所处行业、业务特性有着较大的关联。

如果从 Design System 的角度来看,表单设计似乎又是一个很成熟的工作。输入框、单选、复选、日期、按钮…… 每一个组件都是用户所熟知的,它们是产品设计最底层、基础的元素,也完全有可以系统化的去沉淀。

为什么要写表单设计这个系列?

网络上有很多关于表单设计的资讯,但它们都有比较强的指向性。有一些更关注表单的交互,有一些则更关注表单的逻辑,但真正将它们融合在一起结合产品设计一起来讲述的并不太多(特别是针对移动端产品)。

回过头来看自己这十几年的工作经历,互联网产品的方向和载体不断的在发生变化,但表单依旧还在那里,基础的交互形式也依旧是那些。

从表现上来看表单似乎很简单,即使是新入行的设计师也能很快的掌握基础的元素来搭建一个表单界面。但结合上业务的复杂度再来看待一个表单,它就变得不那么简单了。

想要设计一个用户愿意填写且使用体验上还不赖的表单,除了设计本身,还需要我们结合产品、技术一起来思考。

此前 PinDesign 其实已经写过几篇与表单设计有关的文章,但出发点也是某个具象的角度,也不够系统化。在工作上近段时间里的一部分中心又开始回到到了表单设计上,但在要求上需要更加的全面和系统化,这也让自己需要去重新梳理对表单设计的思考。

借这个机会也正好强迫自己将对表单设计的思考系统的总结下来,也希望能在表单设计这个“课题”上带给大家实质性的帮助。

这个系列会包含哪些内容?

正如前面所言,表单复杂度在于除了设计自身,还与产品、技术有着较强的关联。所以这个系列会将这些因素整合在一起来进行讲解,大体上它会分成以下几大部分:

01、理解设计表单的意义

如果将表单比作一个工具,那么我们将它比作 sketch。 这个工具自身内置了很多基础元素的能力,每个人都可以用它做出不同的设计,但脱离业务场景单独去评价这个设计的好坏其实是没有意义的。

一个明确的设计目标(产品目标)才是从设计上可以去尝试的方向,也是衡量它的一个直接标准。

在这部分内容中我们将站在一个商业产品设计的角度去将表单进行剥离,去分析在每一个层级中设计需要关注的核心本质是什么。也只有先将这个部分搞清楚,才能确保我们设计的表单是在当前情景下真正有效、易于使用的。

02、表单基础设计规范

我们前面提到,表单是一个在产品设计中被大量使用的能力。正因为如此,它也非常有必要被“约束”起来。一套完整、有效的表单设计规范能够让我们在具体的界面设计中将关注点更多的放在业务诉求上,避免表单字段的规范带来对设计的干扰。

当然,表单设计的规范并不是只能一种。根据你的业务领域,它可以有更多不同的角度和形式去体现。

这部分的核心是基于一个整体性的框架,以一个具象的领域为代表做一次案例的示范。希望大家最后得到不是这套表单的规范,而是如何去创建一套属于自己业务的表单规范。

03、表单设计实例

虽然我们可以通过基础元素随意的“组装”不同的表单,但在互联网产品的发展中它们已经形成了很多特定的使用场景,这也是我们在很多站点上能看到的实际案例。

如果只是简答的从表现层面来看,我们可能并不能去评判它的优劣,也不知道我们该如何去借鉴他们的思路。所以在这部分我们将以这些常用的场景(如注册登录、发布评论、搜索筛选等…)为案例从设计思路上来进行逐个的分析。

这些可能也将是大家在日常工作中最为有用的部分,所以我们会用更多的篇幅来讲解这部分内容。

整个表单设计的系列,我将大约分十期来进行讲解。今天这一期先从最基础也最重要的部分 – 设计表单的意义开始。

本文作者: Pinapps ,其版权均为原作者所有,文章内容系作者个人观点,不代表 蜗牛派对观点赞同或支持,未经许可,请勿转载,题图来自Unsplash,基于CC0协议。
分享到:更多 ()
Copyright © 2015-2024 woniupai.net 蜗牛派 版权所有
皖ICP备18016507号-1 | 本站内容采用创作共用版权 CC BY-NC-ND/2.5/CN 许可协议