Inteligencia Artificial Aplicada · IA-145

Prototipado de webs y apps con Google Stitch

Del boceto a una interfaz navegable con la que validar una idea antes de escribir código.

Disponible Intermedio 6 módulos · 24 clases

Formato asíncrono Desarrollo, Empresa / PYME Google Stitch

IA DESARROLLO

Lo que aprenderás

Describir pantallas y flujos con el nivel de detalle que Stitch necesita para generarlos.
Generar variantes de una misma pantalla y compararlas con criterios de usabilidad.
Enlazar pantallas en un prototipo navegable que permita recorrer la tarea completa.
Ajustar tipografía, espaciado y jerarquía visual sobre el resultado generado.
Exportar el diseño a Figma o a código para continuar el trabajo con el equipo.
Preparar una sesión de validación con personas usuarias y recoger los cambios que la justifican.

Contenido del curso

6 módulos · 24 clases en vídeo · práctica guiada en cada módulo

Módulo 1 · Presentación y entorno 4 clases

Para qué sirve un prototipo y qué no demuestra
Acceso a Google Stitch y primera pantalla
Recorrido por la interfaz y los modos de generación
Definir el caso que se trabajará durante el curso

Módulo 2 · Describir el producto 4 clases

Del problema al flujo principal de uso
Redactar la descripción que la herramienta necesita
Pantallas imprescindibles y pantallas accesorias
Estados vacíos, de error y de carga

Módulo 3 · Generar y comparar 4 clases

Variantes de una misma pantalla
Criterios para elegir: jerarquía, carga cognitiva y accesibilidad
Refinar mediante instrucciones sucesivas
Cuando conviene rehacer en lugar de corregir

Módulo 4 · Ajuste fino del diseño 4 clases

Tipografía, escala y espaciado
Color, contraste y legibilidad
Consistencia de componentes entre pantallas
Versión móvil y adaptación del diseño

Módulo 5 · Prototipo navegable y exportación 4 clases

Enlazar pantallas en un flujo recorrible
Exportar a Figma para el equipo de diseño
Exportar código y qué se puede aprovechar
Límites del prototipo frente al producto real

Módulo 6 · Validación con personas usuarias 4 clases

Guion de una sesión de prueba
Observar sin dirigir a quien prueba
Recoger hallazgos y priorizar cambios
Caso práctico: prototipo validado y decisiones documentadas

Requisitos

Nociones de diseño de interfaces: qué es un flujo, una pantalla y un componente.
Cuenta de Google para acceder a Stitch; el trabajo se hace desde el navegador.
Conviene traer una idea propia de aplicación o web que se quiera validar.

Descripción

La discusión sobre una idea de producto se atasca cuando cada persona imagina una pantalla distinta. Contratar diseño para algo que quizá se descarte es caro, y describirlo por escrito no convence a nadie. Un prototipo navegable resuelve la discusión en una tarde, y ese es exactamente el hueco que ocupa Google Stitch.

El curso recorre el ciclo entero sobre un caso real: describir el producto, generar las pantallas principales, corregir lo que la herramienta interpreta mal, enlazarlas en un flujo que se pueda recorrer y llevarlo delante de alguien que no lo ha diseñado. Se trabaja también el paso siguiente, exportando a Figma o a código para que el equipo continúe.

Lo importante no es la estética del resultado sino la decisión que permite tomar: qué se construye, qué se descarta y qué había que preguntar antes. Al terminar se dispone de un prototipo propio, del guion de una sesión de validación y del material para defender la idea ante dirección o ante cliente.

¿Para quién es este curso?

Perfiles de desarrollo que reciben ideas vagas y necesitan concretarlas antes de estimar.
Emprendedores y responsables de producto de una PYME que quieren validar antes de invertir.
Equipos internos que proponen una herramienta y deben enseñarla a dirección para conseguir el visto bueno.