# Semana 3 – Del papel a la pantalla

Con el backlog en marcha y el MVP definido, esta semana me enfoqué en **darle forma visual a las funcionalidades clave**. Este paso fue fundamental para aterrizar lo que estaba solo en texto y convertirlo en una experiencia concreta para el usuario.

Como diseñadora UX/UI, mi objetivo era claro: **no solo diseñar pantallas bonitas, sino crear un flujo intuitivo, accesible y coherente con la lógica del juego**.

Para eso, empecé por lo más básico: **los wireframes**.

💡 **¿Qué son los wireframes?**  
Son esquemas simples (en baja fidelidad) que me ayudan a definir dónde va cada cosa antes de aplicar color, tipografía o ilustraciones. Funcionan como los planos de una casa: primero distribuyo los espacios, luego decoro.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1751401779307/27fe5568-b54b-481e-bee7-d5eda318f758.png align="center")

Puedes conocer mas de cómo hacer estos esquemas, visitando uno de mis otros artículos: [Wireframes](https://hashnode.com/post/cl6z1ve6b006lbinv2t20ay43)

### 🔧 ¿Qué diseñé esta semana?

Partí de las historias de usuario y transformé esas funcionalidades en pantallas clave:

* 🟠 Pantalla de inicio
    
* 🟠 Selector de categoría
    
* 🟠 Pantalla de preguntas
    
* 🟠 Feedback visual por respuesta
    
* 🟠 Pantalla de cierre de ronda
    

Además, **definí el flujo completo**: desde que el usuario abre el juego hasta que finaliza una partida. Para cada pantalla pensé:

* ¿Qué decisión debe tomar el usuario?
    
* ¿Qué información necesita en ese momento?
    
* ¿Cómo minimizo la fricción o el error?
    

También agregué notas en los wireframes para explicar ciertos comportamientos: qué pasa al seleccionar una respuesta, cuánto dura la transición al siguiente ítem, etc. Esto no solo me ayudó a diseñar mejor, sino que **sirve como guía para desarrollo más adelante**.

### 🎯 Resultado de esta semana

✅ Primer set de wireframes listos  
✅ Flujo definido con base en las historias de usuario  
✅ Notas de interacción preparadas para el equipo técnico  
✅ Validación del MVP en términos visuales y de navegación

Diseñar no es solo poner cosas lindas en pantalla. Es pensar cómo cada detalle guía al usuario, lo hace sentir seguro, le da feedback y lo invita a seguir.

Esta semana pude conectar mis habilidades como diseñadora y como Product Owner para construir algo coherente, realista y centrado en la experiencia.

En la próxima semana, te voy a contar cómo convertí estos wireframes en versiones más completas con diseño en media fidelidad.

¿Quieres ver cómo evoluciona *Respuesta Correcta*?  
👉 Suscríbete al blog o sígueme en [LinkedIn](http://www.linkedin.com/in/grehtlingmar-fernandez) para no perderte las siguientes entregas.