Notas de la interfaz de usuario generativa | Consejos CSS
Estoy muy interesado en esta idea emergente de que el futuro del diseño web es Diseño de interfaz de usuario generativa.. Ya estamos viendo indicios de esto en productos como sitio web de figmaafirmando poder crear instantáneamente un sitio web basado en indicaciones.
Deja de lado las deficiencias obvias Ofrecer tecnología inmadura como un producto listo para producción. (Esto es difícil de hacer.) El ángulo que me interesa particularmente es la investigación dirigida a utilizar inteligencia artificial generativa (o GenAI) para generar interfaces personalizadas. Es una locura porque cambia por completo la forma en que pensamos sobre el diseño de la interfaz de usuario. En lugar de anticipar las necesidades de los usuarios y diseñar en torno a ellas, GenAI comprende las necesidades de los usuarios y genera interfaces adaptadas a ellas. En cierto sentido, un sitio web es como un copo de nieve: no hay dos experiencias iguales.
De nuevo, es salvaje. No estoy aquí para especular, expresar una opinión o predicar sobre el diseño de UI generativo (lo que ahora llamamos GenUI). Solo notas sueltas, las actualizaré a medida que continúe estudiándolas.
Definir GenUI
investigación de google (PDF):
La UI generativa es un nuevo paradigma en el que los modelos de IA generan no solo contenido sino toda la experiencia del usuario. Esto da como resultado una experiencia interactiva personalizada, que incluye formatos enriquecidos, imágenes, mapas, audio e incluso simulaciones y juegos, en respuesta a cualquier solicitud (en lugar del extendido “muro de texto”).
uno Interfaz de usuario generativa (genUI) es una interfaz de usuario generada dinámicamente por inteligencia artificial en tiempo real, que puede proporcionar una experiencia personalizada que se adapta a las necesidades y el entorno del usuario.
colectivo de experiencia de usuario:
La interfaz de usuario generativa (GenUI) es una interfaz que mejora la experiencia del usuario mediante el uso de modelos de IA generativa (como LLM) para adaptar o procesar contextos como entradas, comandos, comportamientos y preferencias.
En pocas palabras, una interfaz GenUI muestra diferentes componentes, información, diseños o estilos dependiendo de quién la esté usando y cuáles sean sus necesidades en ese momento.

IA generativa versus IA predictiva
Es fácil arrojar la “inteligencia artificial” en un gran cubo, pero a menudo se divide en dos tipos diferentes: profético y producido.
| Inteligencia artificial predictiva | inteligencia artificial generativa | |
|---|---|---|
| ingresar | Utilice conjuntos de datos más pequeños y centrados como datos de entrada. (revista smash) | Capacítese con grandes conjuntos de datos que contengan millones de ejemplos. (congreso de estados unidosPDF) |
| producción | Predecir eventos y resultados futuros. (Corporación Internacional de Máquinas de Negocios) | Contenido nuevo, incluido audio, código, imágenes, texto, simulaciones y vídeo. (McKinsey) |
| ejemplo | ChatGPT, Claude | Hermana, Sunuo, Cursor |
Entonces, cuando hablamos de GenAI, nos referimos a la capacidad de: crear Los nuevos materiales se entrenan sobre los materiales existentes. Cuando hablamos específicamente de GenUI, se trata de Generar una interfaz de usuario basada en la comprensión del usuario por parte de la inteligencia artificial.
Accesibilidad
Debo señalar que la GenUI de la que hablo aquí en sentido estricto no es la salida de UI que definimos para adaptarla a la experiencia personal del usuario, sino la interfaz generada por “desarrollo”. Estos creadores de sitios web llamados IA no están dirigidos a usuarios individuales, pero es fácil ver que van en esa dirección.
Francamente, lo que más me interesa es cuánto puede ayudar GenUI. seguramente Genere una experiencia que satisfaga sus necesidades todo Usuarios, independientemente de su discapacidad, ya sea auditiva, visual, física, etc. Hay muchos aportes diferentes a considerar aquí, y Hemos visto lo malos que pueden ser los primeros resultados..
El último enlace es uno de los más destacados en el sitio web de Figma. Se perforan fácilmente porque están El mayor impulso empresarial Ingrese al desarrollo web basado en GenUI. Hay que reconocer (¿tal vez?) que sufrieron un serio rechazo y decidieron hacer algo al respecto. Anuncio de actualizaciones y Guía de publicación Se utiliza para mejorar la accesibilidad de los sitios web generados por Figma. Pero incluso esos tiene sus limitaciones Esto hace que los esfuerzos y los consejos parezcan menos útiles y más orientados a salvar las apariencias.
De todos modos. Hay muchos otros jugadores que pueden unirse al juego, especialmente WordPressy otros como Wersel, espacio cuadrado, Vickers, godadi, lindoy listo.
Algunos son más optimistas que otros en cuanto a que GenUI no sólo proporcionará una experiencia accesible, sino que reemplazará por completo a los profesionales de la accesibilidad a medida que la tecnología evolucione. Jakob Nielsen hizo esta famosa declaración en 2024 Cual pintado feroz criticar de este comunidad. nelson Vuelve después de un año.pero no mucho.
Ni siquiera estoy calificado para ofrecer mejores prácticas, comentar sobre el futuro de las prácticas de accesibilidad o especular sobre futuros desarrollos y características. Pero como veo Guía de personas + IA de Googlea pesar de estar lleno de principios de diseño “centrados en el ser humano”, no vi ninguna mención a la accesibilidad.
La accesibilidad, al menos para mí, es una consideración rezagada detrás de las exageraciones. Si GenUI es realmente el “futuro” del diseño y desarrollo web, esto tiene que cambiar.
Ejemplos y recursos
Google tiene un repositorio de ejemplos. Muestra cómo utilizar la entrada del usuario para presentar varias interfaces. Ir un paso más allá es el de Google plan genial La empresa se enorgullece de crear “mundos interactivos” que se “generan en tiempo real”. No recibí una invitación para probarlo, pero tal vez tú puedas.
además, Google tiene un SDK GenUI Diseñado para integrarse en aplicaciones Flutter. Entonces, sí. Conéctese a su proveedor de LLM y permita que cree una interfaz adaptable.
papel es otro en el campo de la GenUI adaptativa. copilototambién.