Initial commit

workshop/es/02-design.md

@@ -0,0 +1,91 @@
+<!-- l10n-sync: source-file="workshop/02-design.md" -->
+# Parte 2: Frontend Design-First
+
+[← Parte 1](01-setup.md)
+
+---
+
+Ahora que hemos trabajado la ingeniería de contexto del repo, vamos a ponernos creativos.
+
+---
+
+### Tarea 1: Hazlo Tuyo
+
+Plan mode para comenzar cualquier trabajo grande — itera en el plan (¡2+ veces!) con ajustes y aclaraciones.
+
+**Pasos:**
+
+1. Cambia a Plan mode
+2. *Hagamos un rediseño completo. Hazlo…*
+3. Revisa el plan y comienza a Implementar
+
+**Ideas de Temas:**
+
+- Minimalist Mono
+- Grotesque Type Grid
+- Retro Terminal Green
+- Vaporwave Sunset
+- Cyberpunk Neon
+- Brutalist Blocks
+- Soft Pastel Clouds
+- Skeuomorphic Stickers
+- Dark Mode Noir
+- Playful Candy Pop
+- Pixel Arcade Style
+- Scandinavian Calm
+- Corporate Clean Blue
+- Gradient Glass UI
+- Notebook Doodle Sketch
+- Space Galaxy Glow
+- Paper Card Cutouts
+- Geometric Memphis
+- Cozy Coffee Shop
+- Metallic Chrome UI
+- Bold Constructivist
+- Eco Leafy Green
+- Anime Bubble Aesthetic
+- Monochrome Newspaper
+- Chalkboard Classroom
+- Yacht Club Nautical
+- Desert Sand Minimal
+- Bold Serif Vintage
+- Toybox Primary Colors
+
+✅ **Resultado:** Las instrucciones de frontend y Tailwind se usan para crear un diseño hermoso.
+
+---
+
+### Tarea 2: Mantén las Instrucciones Actualizadas
+
+Mantén las instrucciones actualizadas con cambios importantes de arquitectura/diseño/dependencias.
+
+**Pasos:**
+
+1. Follow-up: `/create-instructions design guide`
+2. Confirma, haz commit y push
+
+Bonus: Verifica que GitHub Pages se esté actualizando.
+
+---
+
+### Tarea 3: Prueba el Rediseño
+
+Re-ejecuta la skill de dogfooding de la Parte 1 para validar tu nuevo diseño.
+
+**Pasos:**
+
+1. Prompt: *"Haz dogfooding de la app — enfócate en el nuevo diseño"*
+2. Compara el feedback con el reporte de dogfooding anterior
+3. Opcional: Resuelve cualquier problema que el agente señale
+
+✅ **Resultado:** El agente juega la app rediseñada y da feedback crítico actualizado.
+
+---
+
+## ✅ ¡Parte 2 Completa!
+
+Aprendiste cómo:
+- Usar Plan Mode para tareas complejas de diseño
+- Iterar en los planes antes de implementar
+- Mantener instrucciones actualizadas con cambios
+- Re-ejecutar dogfooding para validar cambios de diseño