| 教你搞透文本字数限制的交互设计 |
| 2023-12-20 08:48:20 浏览次数：291 次 |
| |
| |
在设计工作中，会经常遇到文本字数限制的功能设计，这个小功能看上去很简单。但是有很多值得注意的点。
本篇文章是文本框字数限制交互设计方案的讲解。文章大纲如下：
为什么要字数限制
字数定义
字数限制交互方案
最优交互方案
总结
为什么要字数限制
字数限制的场景经常出现在用户昵称、简介等。
如下图微博他人主页，如果昵称不做限制的话，会导致一行无法全部展示。那么处理方式只能打点展示或换行展示。
用一篇文章，让你搞透文本字数限制的交互设计
如果打点的话，那么用户无法看到完整的用户昵称。
换行的话，展示效果很差，视觉上很不美观。
字数定义
按照技术开发定义来看：一个汉字=2 个字符，一个字母/数字=1 个字符。
但这种定义用作于普通用户的话，会难以理解。
如下图，昵称限制 30 个字符，输入一个汉字，计数显示 2，明明输入了 1 个字，怎么显示 2？可能会觉得是软件有问题。其实他很难理解，这是开发实现逻辑的定义。
用一篇文章，让你搞透文本字数限制的交互设计
为了让用户不产生疑问，理解起来更简单，绝大部分 app，都将一个汉字、数字或者字母都当作 1 个计数处理。
如下图所示。昵称限制字数为 17 个字，当输入一个汉字、数字或者字母时，当作 1 个计数处理。
|
| |
| |
|
|
|
PS色阶知识点