Filtros que crecen con los datos: cuándo pasar de chips a un desplegable
La bandeja de una plataforma de mensajería tenía una barra de filtros sencilla: todas, mías, sin asignar, y un chip por cada etiqueta que la empresa hubiera creado. Con cuatro etiquetas se veía ordenada. Una cuenta real creó catorce, y la barra pasó a ocupar cuatro líneas en el celular, empujando hacia abajo justamente las conversaciones que se querían filtrar.
El problema no es estético
Es tentador resolverlo con CSS: chips más pequeños, desplazamiento horizontal, menos margen. Pero el problema es de escala. Cuando una barra se construye recorriendo los datos, un chip por etiqueta, una pestaña por categoría o un botón por sede, el tamaño del control lo decide el usuario, no el diseño. Y el costo crece justo en las cuentas más activas, que son las que más etiquetas crean y las que más usan la bandeja.
El criterio
Separar los filtros en dos grupos según quién define cuántos hay:
- Fijos y conocidos, como todas, mías o sin asignar: se quedan como chips visibles. Su cantidad la decide el diseño y no cambia.
- Los que crecen con los datos, como etiquetas, categorías o sedes: se agrupan en un único chip desplegable.
Cerrado, el desplegable mide siempre lo mismo, tenga la cuenta dos etiquetas o cincuenta. La barra conserva su altura en cualquier caso.
Lo que el desplegable permite
Además de contener el crecimiento, el panel desplegable admite cosas que en un chip no caben:
- Un contador de conversaciones por etiqueta.
- Agrupaciones, por ejemplo dejar las etiquetas archivadas al final.
- Un buscador a partir de unas ocho opciones.
- Selección múltiple en el futuro, sin rediseñar la barra.
El chip cerrado muestra qué está filtrando: "Etiqueta: Urgente" en vez de solo "Etiquetas", para que el filtro activo no quede escondido.
El híbrido que conviene evitar
Una alternativa común es mostrar las etiquetas más usadas como chips y agrupar el resto en un botón de "más". Parece un equilibrio, pero trae dos problemas. Primero, obliga a definir un ranking: más usadas, más recientes, fijadas por el usuario. Segundo, los controles cambian de lugar entre visitas según ese ranking, y una persona que usa la bandeja todo el día pierde la memoria muscular de dónde estaba cada filtro. Un clic extra constante es mejor que un control que se mueve.
Cómo detectarlo antes
Al revisar código de interfaz, cualquier recorrido de datos que pinta controles en una barra merece una pregunta: ¿cuántos elementos puede llegar a haber? Si el número lo pone el usuario, la respuesta por defecto es un desplegable. Y al probar, cargar datos de prueba con muchas más opciones de las que el diseño imaginó, y mirar la pantalla en el celular.
Anticipar alternativas
Una reflexión relacionada: si un filtro solo repite una distinción que ya es visible en la pantalla, no ayuda a encontrar nada. Antes de agregar un control, vale la pena preguntar qué distinción real necesita la persona que no puede ver hoy. A veces el filtro que faltaba no era otra etiqueta, sino "sin respuesta hace más de un día".