概述

文本输入框在我们日常使用软件时候,可以说是随处可见。登录、注册、搜索等等,我们用起来也是轻车熟路。输入框是为人机交互而生的,通过输入框,我们可以告诉设备我们想要的是什么,从而软件系统给出我们反馈。

不得不说,在软件的历史上,文本输入框作为人机交互的基本面,有着不可替代的作用。随着AI的发展,自然语言也慢慢能被机器所学习并能很准切的识别出来,语音输入也将全面替代文本输入。不过,这还是未来的事情。在文本输入框被淘汰前,我们来重新认识下文本输入框。

元件定义

在输入框中单击鼠标会出现 插入点 光标,我们可以直接在输入框中输入文字或文本信息。

百度百科通过对输入框的用途及表现形式来定义,对于使用者来说非常直观。在网上冲浪的过程中,文本输入框可用说随处可见,以下提供几个大厂的文本输入框。

谷歌账号登录
百度账号登录

结构分析

将文本输入框分解后,主要有以下几种结构:如图

  1. 输入载体
  2. 标签
  3. 提示信息
  4. 帮助信息
  5. 反馈信息
  6. 操作

UTOOLS1582429243560.png

状态分析

文本输入框的状态有:默认状态、禁用状态、获取焦点状态、输入中状态、错误状态等

默认状态
禁用状态
获取焦点状态
输入中状态
错误状态

内容校验

交互说明

设计要点

总结