¿Qué es un Wireframe?

Un wireframe es una representación visual simple de una interfaz digital (web, app, software) que muestra la estructura, jerarquía y ubicación de los elementos, sin entrar en detalles de diseño visual.

Si usamos una analogía del mundo real, es como cuando vayamos a construir una casa primero tenemos que tener un plano arquitectónico para ver la distribución de habitaciones, puertas, ventanas entre otros. Entonces, ese plano arquitectónico vendría a ser nuestro wireframe para un producto digital.

El Wireframe en el Proceso UX

Su Ubicación en la Metodología:

Los wireframes no son el primer paso, ni el último. Son parte de una metodología probada que usan equipos de diseño en Google, Airbnb, Spotify y miles de startups exitosas.

¿Por qué Wireframes en este momento?

Es el momento perfecto porque:
👍 Ya sabes QUÉ necesita el usuario (gracias al research)
👍 Ya sabes CÓMO organizar la información (gracias a la Arquitectura de información)
👎 Pero AÚN NO has invertido tiempo/dinero en hacer que se vea "bonito"

Analogía práctica: Es como organizar los muebles en una habitación vacía antes de comprar decoración costosa. Si la mesa no cabe donde pensabas, es mejor saberlo antes de comprar el mantel perfecto.

¿Por qué son importantes?

El Costo de Saltarse los Wireframes

Metodología: ¿Cómo Crear Wireframes?

Errores Comunes y Cómo Evitarlos