02表单《移动应用UI设计模式（第2版）》交互设计读书笔记

☝登录表单

一些应用把：账号输入框、密码输入框、登录按钮、忘记密码、注册按钮 设计在一个页面

一些应用先让你选登录还是注册，选了之后进入下一个页面进行输入表单。

应有隐藏密码/显示密码的按钮。

一些应用：在引导页一直显示登录注册按钮。

可采用标签导航。tab1登录 tab2注册

第三方登录

金融领域流行的登录模式：只需要输入密码。用户身份在安装应用时即可得到验证。

不一定使用应用的第一步就是登录。让他先用，等到想要购买/收藏等时再叫他去登录。

☝注册表单

可采用灰色提示文本，但开始输入后用户可能忘了这要输入的是什么。可用小气泡悬浮。

实时反馈。在我输入完账号或者邮箱就告诉我是否已被注册。不能只说错误了，要告诉用户该怎么做

注册表单要简短，表单长度最好在一屏之内，操作按钮要放在可视范围内。清楚地说明输入要求，可利用实时反馈加快注册过程，并让用户了解当前状况。要考虑到所有用户的使用情况。

Dropbox漂亮的解决方案：一旦识别出我的邮箱已存在，它会推测我是想登录而不是注册。因为我很可能需要找回密码的指引，所以它会预先在找回密码的页面填好我的邮箱地址，这样我只需点击“发送”即可等待恢复账号了。

☝个性化注册表单（选择感兴趣的领域/查找通讯录朋友之类）

常用的是宫格布局（陈列馆式），点击选中的交互。

☝多步骤表单

在网页端，多步骤注册过程经常使用进程栏（process bar）1指示用户他们所处的位置，并提示下一步操作。在标题显示，与进度条（progress bar）区别。用在手机上缺点的太拥挤了。

解决方案：在页脚或页头显示第几步（1/3）之类。减少文字描述。

☝结账表单

技巧1：同时提供登录、注册和客人用户选项

你完全可以在用户完成支付后提示他们去创建账号。

技巧2：简化流程

弃用进程栏，把分屏步骤融合进一个结账页。用层级导航。

技巧3：提供省时的快捷方式

银行卡扫描得到卡号。

技巧5：忘掉网页端

☝计算表单

体重。税款。虽然这些表单可以采用自定义控件和布局，但是遵循基本的设计规范以保证表单的易读性依然十分重要。对齐方式、标签、字体、按钮位置、对比及颜色，这些全部都是影响移动表单易用性的因素。

数据实时可视化。图表等。

☝搜索表单（添加筛选条件）

实时显示有多少条结果。

“最近搜索”小功能

一边输入一边自动提示

☝长表单

一屏滚动比分页好。下一步按钮和返回按钮放在哪？ ios和安卓建议顶部操作栏，window phone建议底部。

我的想法

在阅读这部分内容时，不断回忆起参与并负责UXUI的一个记账app项目中的登录注册和录入账目表单。

登录注册想到记住账号和密码的现代人痛点，直接设计成用手机号接收验证码，这样一来不必区分登录or注册，也不需要找回密码的操作。也放置了第三方登录。在流程上和架构上都比较简洁。这是我身为设计者的想法。个人打开一个应用，对注册真的没耐心。不过站在公司业务的角度上，免去繁杂的注册步骤是否对公司留存用户资料有一定影响？项目是课内作业，或许还是缺少商业角度的考量。

但是录入账目的设计，当时纠结了很久。基于产品特点的缘故，账目的录入算是多步骤表单的设计。我在顶部放置了进程栏，分为两步。返回和保存按钮放置在顶部的左右上角。第一步用一个页面，采用了层级导航设计，需要强调推荐录入的信息采用了输入框。第二步主要是复选控件，底部有实时反馈提示。因为进程栏不能放太多文字，当时在信息设计上也改了好几次，担心表意不明。现在想想，当时的一个败笔应该是下一步按钮。在第一步的时候放置在顶部右上角，后又担心不明显，在表单下方也添加了一个，然后进程栏（当时我称为tab导航）也是可以点击切换到下一步。

但是否真的如作者所说，用户不需要进程栏，仅仅一个one of three steps的提示就足够了？也许文字过长或者表意不明的时候，宁可不要，但能说清楚且设计简洁的话，也未尝不可。

一屏滚动真的比分页好吗？以前我认为“是的”。但前几日填写了一位师姐的调查问卷，平时都是一屏滚动，又臭又长。但师姐的问卷分了页，竟然惊喜地给了我一种减轻任务负担的心理？大的任务，化整为零也是一种思路？此外，那份问卷的下一步在后面加上（1/3）应该会更好。

但当我浏览网页的微博时，我就感受到分页带来的困扰。我浏览信息流就图一个爽，它还老需要我费神去点击下一页？为何如此？