Una nueva era para crear en la web

Este año tuve la suerte de poder asistir a la Config 2023, la conferencia anual de Figma, la compañía que hace años está marcando la agenda en el diseño de productos digitales.

Me sorprendió totalmente el hecho de que NO fue una conferencia de diseño, sino que fue de Producto, Tecnología y Diseño. Figma no solo está marcando la agenda y definiendo el futuro del diseño de productos digitales, sino que también está siendo un actor importante en la definición de la nueva era de creación de productos y contenido para la web.
‍

El evento

Más de 8.500 personas en vivo (y cientos de miles más de forma virtual) asistieron al evento en San Francisco y más de 75 speakers que ocupan roles importantes en Figma, Netflix, Google, Meta, Duolingo, Adobe, entre otros, formaron parte de la primer Config realizada post-pandemia (en 2020 fue la última).

‍

‍

Figma + AI va a cambiar rotundamente cómo diseñamos

‍

Para empezar, está bueno entender cómo Figma cree que la AI va a impactar en el diseño de productos. Dylan, (CEO de Figma) está convencido de 2 cosas:

1. La AI va a permitir a diseñadores y no diseñadores hacer excelentes bocetos y primeras versiones de un diseño, pero para que eso se convierta en un excelente diseño de producto, tiene que haber excelentes diseñadores involucrados (más impacto en la etapa de brainstorm y etapa inicial de design).
2. Por un lado va a potenciar las habilidades de los diseñadores, levantando el techo y haciendo que dejen de hacer tareas repetitivas/operativas, y se enfoquen más en la estrategia del diseño y cómo resolver un problema. Por otro, agrandar el piso, haciendo que no diseñadores puedan participar más en el proceso y bajar sus ideas a una primera versión/boceto sin la necesidad de saber diseñar (eso no quiere decir que pueden diseñar productos, ya que como menciona anteriormente, para que un diseño con AI pueda convertirse en un gran producto, se necesita el expertise del diseñador)

‍

‍

Cabe destacar que esta es la visión de Dylan. En mi punto de vista personal, creo que no hizo mención a algunos temas:

• Un diseñador con buen criterio, pero que no ejecute tan bien, va a tener una herramienta muy poderosa para estar a la altura de los que ejecutan mejor.
• Que no diseñadores participen más activamente del proceso, puede confundirlos en el sentido de no entender bien la diferencia de lo que ellos pueden ejecutar y a partir de cuando es scope de un diseñador. Imagino fricciones en el proceso.

‍

Adquisición de Diagram (compañía de AI orientada al diseño)

Para poder avanzar rápido hacia la inclusión de la AI en sus productos, Figma hizo una adquisición estratégica de otra compañía: Diagram

Diagram fue de las primeras compañías que empezó a experimentar con AI en diseño. De forma muy autodidacta, su founder & CEO estuvo experimentando con plugins hasta que salió Chat GPT-3 y pasó esto.

Pero vamos un paso atrás. Diagram lanzó varios plug-ins/productos en estos años:

‍

‍

Al principio, la tecnología daba para automatizar tareas. Ej:

• Crear una paleta de colores
• Resizear un set de íconos
• etc

Pero con el avance de la AI, pudieron empezar a aplicar inteligencia y a sacar mejores productos:

• UI-AI > Genera textos, imagenes, layers e íconos
• Magician > Genera SVGs, te nombra todos los layers y componentes, crea imagenes complejas, crea textos. Todo con unos clicks, como si fuera una varita mágica
• Genius > Un asistente 360. Vos le pedís que haga algo, y el lo hace. Crear un sistema de diseño, crear imágenes, hacer una pantalla entera con todos sus componentes, etc. También lo podes invitar a tu archivo de Figma y te deja comments como si fuera un diseñador sr.

Genius es su versión más poderosa. ¿Cómo se interactua? Con un chat como si estuvieras hablando con CHAT GPT, podés pimponear cosas, te tira ideas y ejecuta lo que vos le pidas.

Importante, ¿cómo pensaron la UX para poder diseñar una pantalla desde 0 con todos sus componentes? Tenés un drag and drop donde vos elegis la estructura. Ej: arriba de todo, la navegacion, abajo un feed productos que y abajo un footer. Vos elegis la estructura, genius diseña:

‍

‍

Lo importante acá, es que todo esto ya funciona y ahora es propiedad 100% de Figma. En breve, van a lanzar la integración de todos estos features.

Recomiendo fuertemente ver el sito de Diagram.

‍

Cada vez más guiños para los devs

‍

Si hay algo que está claro, es que el diseño y la programación están convergiendo en un solo punto. Una de las cosas que hizo bien Figma (aparte de tener un enfoque colaborativo, que le permitió sacar una ventaja sobre Sketch y XD) fue el de acercar la forma de diseñar a la forma en que se maqueta el front-end. Auto-layout es un gran ejemplo de esto ya que te permite diseñar utilizando margins, paddings, y posicionamiento de elementos utilizando la misma lógica que utilizan los desarrolladores para maquetar el front-end.

Este año, anunciaron la funcionalidad de dev-mode que permite a los devs ver los archivos de diseño con una vista optimizada para ellos. A esto, se suman las variables y los design tokens, que replican una lógica parecida a la de las clases de CSS que se utilizan en programación. Si se diseña como se programa, ¿cuánto falta para que al diseñar una interfaz directamente la misma se convierta en código? 

Como contrapartida me gusta utilizar de ejemplo a Webflow, compañía pionera en no-code. En Webfow cada vez es más fácil hacer implementaciones sin pasar por Figma. Si en Webflow cada vez se puede diseñar más, y en Figma cada vez se puede programar más, ¿cuánto falta para que alguna de las dos te permita hacer todo en uno?

‍

La mirada de Brian Chesky, CEO de Airbnb y único C-level diseñador en empresas Fortune 500

‍

Brian Chesky, CEO de Airbnb, es el único CEO diseñador de las empresas que están en el Fortune 500 (listado de las 500 empresas más importantes de Estados Unidos).

Si bien te recomiendo ver la charla completa, dejó algunos conceptos muy interesantes que te resumo acá:

• Las empresas más importantes y prometedoras del mundo tienen al diseño como un pilar fundamental de su estrategia (Apple, Tesla, SpaceX, Google, Airbnb, Mercado Libre, etc).
• Pocos diseñadores son CEOs porque es una disciplina más creativa y menos objetiva, pero las que tienen diseñadores que son buenos líderes, son C-levels. Tienen una ventaja competitiva porque pueden usar esa creatividad para innovar y disrumpir, pensar las cosas una forma en que nadie las piensa.
• Diseño no es solo diseño gráfico o el diseño en sí del producto. Él como CEO ya no hace diseño gráfico, pero diseña la estrategia, diseña el modelo de negocio, diseña los equipos, etc.
• El foco es muy importante. Pudieron sacar la empresa adelante en la pandemia porque SOLO se enfocaron en lo importante.
• La calidad ante todo, pudieron sacar la empresa adelante porque solo lanzaban features de los que pudieran estar orgullosos si llevaban su nombre.

‍

Si te gustó este post, seguí a Paisanos para enterarte de más novedades de esta hermosa industria :)

‍

‍