Un wireframe (o boceto estructural) es un esquema simplificado de una pantalla. Muestra la estructura y la disposición de los elementos, sin colores ni detalles visuales.

Por qué empezar con wireframes

• Rápidos de producir y de modificar.
• Económicos — se prueban ideas antes de invertir en el diseño final.
• Enfocados — se piensa en la función, no en la estética.

Suelen emplearse formas grises: rectángulos para las imágenes, líneas para los textos, bloques para los botones. El objetivo es validar la ubicación de los elementos y la lógica de la pantalla. Se pueden dibujar a mano en papel o con una herramienta como Figma. Al mantenerse deliberadamente toscos, los wireframes invitan a comentarios sinceros: nadie duda en criticar un boceto sin terminar.

Para recordar: el wireframe pone los cimientos antes que la decoración. Mejor mover un rectángulo que un diseño ya acabado.