# Chunking en los Flujos de UI: Fragmentación Inteligente

> Aprenda a aplicar el chunking en sus interfaces y flujos de usuario para fragmentar la información en bloques manejables, reduciendo la carga cognitiva y mejorando la tasa de éxito.

*Tags: ux, tecnica, diseño-ui, product-design, psicologia*

---


> [!info] Definición Rápida
> El **Chunking** es la técnica de dividir información compleja o flujos de usuario extensos en "pedazos" (chunks) más pequeños y lógicamente agrupados. Esto facilita que el cerebro del usuario procese, entienda y recuerde la información sin sentirse abrumado.


## ¿Por qué el Chunking es vital para la Memoria?

Nuestra memoria de trabajo es extremadamente limitada. Según George Miller, solo podemos mantener entre 5 y 9 elementos a la vez en nuestra mente. Si una interfaz nos presenta 20 campos de formulario o un manual de 10 pasos sin pausas, nuestro cerebro se satura y la [carga cognitiva](/conceptos/gestion-de-carga-cognitiva/) se dispara.

El **Chunking** engaña a nuestra memoria al agrupar varios elementos en una sola unidad de significado. Por ejemplo, es mucho más fácil recordar el número de teléfono `555 123 456` que la cadena `555123456`. El cerebro solo tiene que recordar tres "trozos" en lugar de nueve números individuales.

## Estrategias para aplicar Chunking en UI

Para que tus usuarios tengan una experiencia fluida y procesable, debes aplicar estas estrategias:

### 1. Agrupamiento Visual (Espacio y Bordes)
Usa el espacio en blanco (espacio negativo), líneas divisorias o cajas de color para agrupar elementos relacionados. 
- **En un formulario de envío:** Agrupa los campos de "Dirección" en un bloque y los de "Método de Pago" en otro. El usuario percibirá dos tareas sencillas en lugar de un formulario interminable.

### 2. Formateo de Datos Sensibles
No dejes que el usuario introduzca datos largos sin ayuda visual.
- **Códigos de tarjetas:** Muestra el número en bloques de 4 dígitos.
- **Fechas:** Usa separadores automáticos (`DD / MM / YYYY`).
- **Números de pedido:** Divide las cadenas largas con guiones o espacios.

### 3. Progressive Disclosure (Revelación Progresiva)
No muestres todo a la vez. Divide los flujos complejos en pasos secuenciales.
- Un checkout en 4 pasos detallados se siente más rápido y menos pesado que una sola página inmensa que requiere mucho scroll.
- **Técnica:** Usa "Steppers" o barras de progreso para indicar al usuario en qué "trozo" del camino se encuentra.

### 4. Categorización en Menús y Listas
Si tu herramienta tiene muchas funcionalidades, agrúpalas mediante títulos claros. 
- **Menú de Configuración:** Divide las opciones en "Cuenta", "Privacidad", "Notificaciones" y "Ayuda". El usuario no tiene que leer todas las opciones, solo busca el "trozo" que le interesa.

## Beneficios para el Usuario y el Negocio

- **Menor Tasa de Abandono:** Una tarea fragmentada se siente menos intimidante y más fácil de completar.
- **Mayor Claridad:** El usuario entiende rápidamente la jerarquía y la relación de la información.
- **Reducción de Errores:** Al procesar menos información a la vez, el usuario es más preciso en sus acciones.
- **Mejor Retención de Información:** El usuario recuerda mejor cómo realizar una tarea si ha sido dividida en pasos lógicos.

## Consejos de Mentor

- **No pases de 3 o 4 grupos por pantalla:** Aunque la Ley de Miller dice 7±2, en diseño digital menos es siempre mejor. Intenta que el usuario no tenga que procesar más de 3 o 4 bloques visuales principales a la vez.
- **El nombre del "Chunk" es clave:** Los títulos de los grupos deben ser extremadamente claros y breves. No obligues al usuario a leer el contenido para entender de qué va ese grupo.
- **Prueba el "Squint Test":** Entrecierra los ojos mirando tu pantalla. ¿Se distinguen claramente los grupos de información o se ve todo como una mancha uniforme? Si no se distinguen, necesitas más espacio o mejores divisores.

## Recursos y Herramientas

- **NNGroup:** [Chunking - How to help users process information](https://www.nngroup.com/articles/chunking/)
- **Laws of UX:** [Miller's Law](https://lawsofux.com/millers-law/)
- **Interaction Design Foundation:** [Chunking - Help users focus](https://www.interaction-design.org/literature/topics/chunking)
- **Artículos:** [Designing for Cognitive Load](https://uxdesign.cc/designing-for-cognitive-load-84c427dd57)
---
[[gestion-de-carga-cognitiva]]
[[ley-de-hick]]
[[revelacion-progresiva]]


---

Source: https://www.fernandoux.com/es/wiki/tecnicas/chunking-flujos-ui/