Cómo la IA está cambiando la creación de prototipos de productos digitales
Desde bocetos en papel hasta ‘demos’ de software funcionales, la IA está transformando la forma en que se prototipan los productos digitales: de manera más rápida, más inteligente y, a menudo, con menos barreras técnicas.
Todo el mundo tiene una idea general de lo que es un prototipo, pero el término significa cosas distintas para diferentes públicos. Un desarrollador de software puede considerar prototipo a un programa de prueba. Un ingeniero industrial puede referirse como prototipo a una impresión 3D. Y un diseñador puede utilizar el término para referirse a diversos artefactos, desde storyboards en papel hasta diseños gráficos de la interfaz de una aplicación.
Según el artículo seminal de Stephanie Houde y Charles Hill, un prototipo es una representación de una idea de diseño en cualquier medio. El prototipo es fundamental para explorar y expresar diseños. En otras palabras, es cualquier proceso que permite asegurar, desde una fase temprana y con poca inversión, que un equipo está construyendo el producto correcto.
Tradicionalmente, el prototipado se ha asociado con diseños preliminares de baja fidelidad, pero también con creatividad e innovación. Algunos prototipos históricos famosos incluyen el ratón de ordenador de Douglas Englebart (que tenía ruedas), un boceto en papel de Twitter, y diferentes prototipos de Palm (el ordenador de bolsillo popular a finales de los 90 y principios de los 2000), el primero de los cuales era simplemente un bloque de madera utilizado por el fundador para probar el peso y la ergonomía.
En lo que respecta al prototipado de productos digitales, los avances recientes en IA generativa, y especialmente en modelos de lenguaje de gran escala (LLMs, por sus siglas en inglés), están teniendo un impacto profundo. A diferencia de las primeras versiones, estos modelos generan actualmente imágenes de alta calidad, que pueden incorporarse a los diseños, y destacan en la producción de código, pudiendo servir como base para el prototipo de un sitio web o una demostración funcional sencilla de un producto digital. Además, una amplia gama de herramientas de creación de contenido derivadas de estos LLMs está poblando el ecosistema del prototipado.
La conclusión: en el mundo actual, moverse con confianza por el ecosistema de herramientas de IA es una competencia clave en el prototipado.
Este artículo explora cómo los avances en IA están influyendo en diversas técnicas tradicionales de prototipado, ilustrando cada punto con ejemplos creados por estudiantes durante el curso Data-Driven Prototyping with AI. Esta asignatura optativa, ofrecida a estudiantes de diversos másteres de Esade —incluidos los de Innovación, Marketing, International Management, Finanzas y Sostenibilidad— proporciona una oportunidad práctica para adoptar una mentalidad de prototipado, incluso para estudiantes sin experiencia técnica previa, especialmente en programación.
Bocetos en papel y storyboards
La forma más simple de prototipar un producto digital es el boceto en papel, que implica técnicas como dibujar los diseños a mano para obtener una primera inspiración o comentarios sobre el aspecto visual y el flujo de la aplicación. Un caso especial de boceto en papel es el storyboard, que representa el recorrido del producto para contextualizar su uso y mostrar su rol o impacto en la vida del usuario.
Las posibilidades que ofrece la IA en esta área incluyen introducir bocetos a mano de baja fidelidad para generar representaciones de alta fidelidad, pedirle a un sistema de IA que genere directamente un storyboard a partir de un guion o incluso que proponga los propios guiones. La siguiente imagen muestra un storyboard realizado por una estudiante sobre una función impulsada por IA para una app de una tienda de arte:
La capacidad de generar storyboards en el estilo deseado a partir de un guion y en poco tiempo complementa el storyboarding tradicional. Permite explorar ideas diferentes y más cantidad de ellas. Entre sus limitaciones, los storyboards generados son difíciles de editar y todavía presentan problemas con el texto generado. Además, el diseñador renuncia a algunas decisiones creativas y queda “anclado” a los criterios de diseño de la caja negra de la IA.
Prototipado con wireframes y mockups
Los wireframes son representaciones de baja fidelidad de una interfaz de usuario que utilizan formas y líneas simples para mostrar la disposición de los elementos, evitando deliberadamente detalles como texto o imágenes específicos. Su objetivo es definir bien la interfaz sin distracciones visuales. Pueden realizarse a mano o con software como PowerPoint, Canva, Miro o con herramientas específicas como Balsamiq. Esta técnica es útil para centrarse en la estructura general y la funcionalidad de la interfaz antes de considerar detalles como las tipografías, los colores y las imágenes.
Comparado con el wireframe, un mockup es una representación de mayor fidelidad de la interfaz, con colores, tipografías e iconos realistas, e incluso cierta interactividad. Aunque aún no es un software funcional, el aspecto se acerca al producto final. Los mockups se utilizan en una fase en la que resulta relevante discutir el aspecto y la experiencia visual específicos. El software profesional para este prototipado digital incluye Principle, Sketch y Marvel.
Las posibilidades que ofrece la IA en este ámbito incluyen la generación de wireframes a partir de instrucciones, así como de mockups o de materiales con cualquier nivel de fidelidad intermedia. Por ejemplo, la imagen de la izquierda, creado por un estudiante como parte de un prototipo para una app de monitorización del sueño, posee un nivel de fidelidad intermedio entre wireframe y mockup.
Otra posibilidad de prototipado con IA consiste en usar plataformas de generación de código como Lovable o Bolt para crear un diseño inicial que, en las primeras iteraciones, cumple una función similar a un mockup. En la imagen de la derecha se muestra otro ejemplo creado por otro estudiante utilizando Lovable.
Estas estrategias permiten crear materiales más rápido y con mayor fidelidad que con herramientas tradicionales. Además, si se utilizan asistentes de código, se obtiene una app funcional que se puede compartir o ampliar. Entre los inconvenientes, las imágenes generadas por IA pueden ser difíciles de editar por lo que respecta a añadir detalles específicos, y el código generado con asistentes como Lovable requiere conocimientos de programación para modificarlo. Los usuarios con poca experiencia en programación pueden tener problemas para avanzar cuando el diseño generado no se ajusta a las instrucciones. Sin embargo, otros usuarios reaprenden nuevas estrategias. Algunos estudiantes señalaban que: “el prototipado no es lineal: a veces, volver a empezar es más rápido que depurar errores”.
Prototipado en vídeo y Wizard of Oz
En el prototipado en vídeo, se parte de cualquier medio de prototipado —como bocetos en papel o maquetas digitales— y se “anima” mediante vídeo para crear una ilusión de interacción con el producto para quien lo ve.
Una técnica relacionada, el prototipado “Wizard of Oz”, simula el comportamiento de un sistema o una funcionalidad compleja, pero la funcionalidad real es reemplazada por una persona que, como en la película El mago de Oz, controla en secreto las respuestas del “falso” sistema. Esta técnica resulta útil para validar la aceptación del producto antes de implementar el sistema completo. Por ejemplo, un equipo que desarrolla una aplicación para ofrecer información nutricional sobre un alimento a partir de una foto puede usar un prototipo Wizard of Oz como caso especial de prototipado en vídeo para probar el concepto con usuarios desde el principio, incluso antes de implementar el sistema de reconocimiento de imágenes.
Un uso interesante de la IA en este ámbito es, precisamente, el de cerrar la brecha entre un vídeo simulado y la funcionalidad real. A medida que más funciones de IA están disponibles a través de APIs, bibliotecas de software y demostraciones, es cada vez más fácil sustituir las interacciones simuladas por funcionalidades reales. Incluso si la herramienta de IA no está totalmente integrada, puede ofrecer resultados genuinos.
Por ejemplo, utilizando una plataforma como Teachable Machine, se puede entrenar un modelo real de aprendizaje automático —por ejemplo, de reconocimiento de imágenes— e incorporar el resultado del reconocimiento real en un prototipo en vídeo. El ejemplo siguiente muestra otro ejemplo creado por estudiantes: un prototipo de una aplicación de información nutricional que emplea Teachable Machine para reconocer y clasificar imágenes e insertar el resultado en el prototipo.
En este caso, la principal ventaja del uso de IA es que enriquece los prototipos tradicionales con elementos de funcionalidad real. El principal inconveniente es que, si se comunica de forma deficiente o al público equivocado, puede dar la ilusión de que el producto está casi listo, lo que puede conducir a decisiones erróneas en el desarrollo o en la asignación de recursos.
Prototipado de software
Un prototipo de software es una pieza real de software —simplemente más básica que el producto final o con solo un subconjunto de sus funciones—. Es útil cuando hay que tomar decisiones de implementación o cuando es importante probar la funcionalidad.
Tradicionalmente, los prototipos de software se consideraban de fidelidad más alta y se reservaban para fases avanzadas del diseño. Sin embargo, la programación resulta cada vez más sencilla gracias a lenguajes de alto nivel, librerías empaquetadas, APIs que implementan funcionalidades de terceros y la generación de código mediante IA. Como resultado de todo ello, es probable que debamos replantearnos nuestra visión sobre el coste de los prototipos de software.
Concretamente, el uso de IA en el prototipado de software puede abordarse de tres maneras. La primera es incorporar funcionalidades de IA en un prototipo mediante librerías de código o APIs. La segunda consiste en utilizar la IA como asistente en la generación de código. Y la tercera es usar IA generativa como “modelos de instrucciones” para ejecutar acciones a demanda a partir de indicaciones en lenguaje natural (en lugar de implementar el código manualmente).
La imagen siguiente muestra un prototipo de otra estudiante que ilustra el primer enfoque: una funcionalidad de reconocimiento de códigos de barras de un tercero integrada en una app, simplemente importando una biblioteca pública de JavaScript.
El segundo enfoque (uso de IA para ayudar en la generación de código) se ejemplifica con este otro prototipo del curso: una herramienta para añadir marcadores en una ciudad y sugerir rutas inteligentes. La aplicación fue generada con Lovable, pero gracias a una cantidad significativa de conocimiento especializado.
El tercer enfoque (uso de IA como modelo de instrucciones) se implementó en el siguiente prototipo estudiantil. La app es un verificador de ‘firmabilidad’ que lee contratos de alquiler y avisa sobre cláusulas de riesgo. La funcionalidad específica se implementa mediante una llamada a la API de OpenAI. En este ejemplo específico de dominio, diseñar un prompt detallado fue crucial. Como señalaron los estudiantes: “El prompt [...] define el comportamiento del producto. Hacer pequeños ajustes cambiaba drásticamente los resultados, lo que nos enseñó a tratar el diseño de prompts como si fuera programación”.
El aumento de productividad gracias a la IA en programación está ampliamente documentado. Esto aplica tanto a desarrolladores que se ven “aumentados” por copilotos de código como a perfiles con menos experiencia en programación, que pueden recurrir a herramientas de generación de aplicaciones. En un artículo anterior ya hemos tratado las ventajas e inconvenientes de este enfoque.
Design fiction
El design fiction consiste en crear prototipos tangibles y evocadores de posibles futuros cercanos. Permite descubrir nuevos productos y representar las consecuencias de la tecnología. Es una técnica válida de prototipado, ya que comparte muchos elementos con el prototipado clásico—en particular, su enfoque en reducir riesgos y servir como base para potenciales discusiones estratégicas—.
A partir de un ejercicio del Manual of Design Fiction, los estudiantes imaginaron productos nuevos fuera de su contexto habitual, como un espejo inteligente o una chaqueta conectada a un coche Tesla, representada a continuación:
La capacidad de la IA para generar imágenes ha revolucionado la creación de este tipo de materiales. Sin embargo, estrictamente hablando, el design fiction no trata solo de mostrar un producto potencial, sino de ofrecer un ejemplo provocador en un contexto cotidiano. De nuevo, los LLM son muy eficaces generando imágenes de situaciones nuevas. A continuación, algunos ejemplos más cercanos al espíritu del design fiction, generados a partir de los originales de los estudiantes (un usuario que vende la chaqueta Tesla online o una nevera inteligente que se bloquea por error).
Un posible riesgo aquí es acabar reduciendo el design fiction a la mera generación de imágenes, cuando en realidad abarca varias etapas y dimensiones. Por ejemplo, muchos ejemplos famosos de design fiction se apoyan en vídeos provocadores u objetos físicos. Aunque la IA puede ayudar a generar ideas, el proceso sigue requiriendo una dimensión artística necesariamente humana.
Reflexiones finales
Un dato clave es que muchos de los prototipos realizados en este curso no habrían sido posibles hace dos años, porque las herramientas no existían o las capacidades de los LLM eran más limitadas. Tal vez ese sea el mejor ejemplo del impacto de la IA en las técnicas tradicionales de prototipado.
Hacer que el prototipo sea más sencillo de llevar a cabo tendrá consecuencias importantes en cómo las empresas innovan. En su obra Cultures of Prototyping, Michael Schrage sostiene que las organizaciones que quieren crear mejores productos deben aprender primero a crear mejores prototipos. La cultura de innovación de una empresa se refleja en la calidad de sus prototipos. Hoy, a medida que la IA se vuelve inseparable del proceso de prototipado, la forma en que las empresas adopten la IA será un fuerte indicador de su capacidad de innovación.
Nota: Gracias a todos los estudiantes que produjeron y dieron su consentimiento para mostrar los ejemplos.
Yasmin Dwiputri & Data Hazards Project / AI across industries. / Licenced by CC-BY 4.0