# Semana 5: Diseñar para que se construya

Aunque el diseño en alta fidelidad ya estaba listo desde la semana anterior, esta semana me enfoqué en un paso igual de importante: convertir ese diseño en algo claro, estructurado y útil para quienes lo van a construir.

Porque no se trata solo de mostrar una pantalla bonita, sino de entregar herramientas reales al equipo de desarrollo para que pueda implementarlas sin fricciones.

### 🧩 Sistema UI: diseñar con lógica, no solo con estilo

Revisé cada pantalla para asegurar consistencia en:

* Espaciados
    
* Jerarquías
    
* Comportamientos
    
* Estados visuales (hover, selección, respuesta correcta/incorrecta)
    

A partir de ahí, armé un sistema UI en Figma con componentes reutilizables que incluye:

* Botones (varios estados y usos)
    
* Tarjetas de respuesta
    
* Contenedores y modales
    
* Tipografía estandarizada por jerarquía
    
* Colores con variables y etiquetas semánticas
    

Este sistema no solo me sirve ahora, sino que **prepara el terreno para futuras versiones del juego**.

### 📦 Handoff: de diseñadora a facilitadora técnica

Preparé una guía de handoff clara y completa con:

* Archivo de Figma con inspección activa
    
* Componentes nombrados, ordenados y agrupados por función
    
* Notas por pantalla sobre comportamiento e interacción
    
* Checklist de accesibilidad (verificada con Stark)
    
* Guía rápida para implementación en mobile
    

Puedes acceder a la [guía de handoff](https://grehtcreativa.notion.site/Gu-a-de-Handoff-22a52d8721278040b6fcdf0eb697f7ec?source=copy_link) para que conozcas a mayor profundidad el contenido.

Como Product Owner, también estuve disponible para validar dudas, definir prioridades y evitar bloqueos técnicos.

### 🧠 ¿Por qué esta etapa importa tanto?

Porque muchas veces los diseños mueren en el traspaso a desarrollo. Y ahí es donde entra el diseño productivo, el que está pensado no solo para verse, sino para construirse.

### 🎯 Resultado de esta semana

✅ Sistema UI armado y documentado  
✅ Componentes listos para reutilización  
✅ Guía de handoff compartida y validada  
✅ Apoyo directo al equipo técnico durante la implementación inicial

Diseñar sin pensar en desarrollo es como escribir un libro sin final. Esta semana, conecté diseño y construcción para asegurar que *Respuesta Correcta* avance sin perder su esencia.

En la próxima entrega, te voy a contar cómo acompañé el inicio de la implementación y qué ajustes surgieron al poner en práctica lo diseñado.

¿Quieres ver cómo avanza este proyecto semana a semana?  
Cuéntamelo en los comentarios o por mensaje directo, ¡me encantaría conocerlo!

👉 Suscríbete al blog o sígueme en [LinkedIn](http://www.linkedin.com/in/grehtlingmar-fernandez) para no perderte las siguientes entregas.