00:00:00Para mí, el diseño y la programación por sensaciones es lo más parecido a Flash que he visto en prácticamente dos décadas.
00:00:07Él es Tom Cracker, el director ejecutivo de Pencil.
00:00:10Pencil.dev
00:00:11Y eso se llama Pencil.
00:00:13Una nueva aplicación llamada Pencil.
00:00:14Pencil.dev
00:00:15Empiezo a sentir que estamos descubriendo nuevas experiencias de usuario para interactuar con la IA que nunca antes habíamos visto.
00:00:22Ya sabes, estos cursores, escaneos y demás son solo la punta del iceberg; veremos mucho más de eso.
00:00:29Como Banana o estos generadores de imágenes que crean fotos geniales, ¿pero qué pasa con las ilustraciones?
00:00:34Creo que las ilustraciones van a ser algo enorme en la segunda mitad de 2026.
00:00:39¿Hay modelos específicos que sean significativamente mejores que otros en diseño?
00:00:45Creo que mi favorito es...
00:00:48Te voy a hacer una pregunta para romper el hielo.
00:00:51En su día, estabas muy familiarizado con Adobe Flash.
00:00:54¿Todavía sabes ActionScript?
00:00:56Sí, totalmente, crecí con Flash.
00:00:59Fue como mi primer gran paso en la tecnología y empecé a usar Photoshop a los siete años.
00:01:09Con el tiempo, mis padres abrieron una agencia de diseño, así que después de la escuela siempre pasaba el rato allí con diseñadores que me enseñaban herramientas como Photoshop, Illustrator o CorelDRAW, que se usaba mucho entonces para diseño impreso.
00:01:26Internet llegó a finales de los 90 y me interesé mucho por lo interactivo; empecé con el HTML, el DHTML y todo eso hace mucho tiempo, hasta que apareció Flash en su versión 3.
00:01:45Y me quedé impresionado, fue como: "¡Vaya, qué es esto!".
00:01:48Se movía, tenía animaciones, audio y de todo.
00:01:55Me enamoré de Flash de inmediato, empecé a crear webs con él y acabé ganando un premio en una conferencia en Praga llamada Junior Internet.
00:02:07Si preguntas en Praga por Junior Internet a quienes lo recuerden, verás que lanzó la carrera de muchísima gente. Al final, Flash acabó siendo la única forma de transmitir vídeo online.
00:02:25Así que empecé a crear reproductores de vídeo para todo tipo de medios de comunicación y demás.
00:02:29Esa fue mi introducción a Adobe, porque usábamos mucho sus servidores de medios para Flash; Adobe lo vio y terminaron ofreciéndome un trabajo como evangelista de Flash.
00:02:44Así es como empezó todo: empecé a crear herramientas de diseño, a dar charlas en conferencias y a hablar con muchísimos diseñadores.
00:02:55Ese fue realmente el origen de mi historia.
00:02:59He visto algunos vídeos tuyos dando conferencias en eventos de videojuegos y cosas así.
00:03:06¿También hacías juegos con Adobe?
00:03:09Sí, sí, totalmente.
00:03:10Flash se usaba para muchas cosas interactivas, incluidos los juegos. Me convertí en una especie de evangelista de videojuegos en Adobe y ayudaba a empresas a llevar sus apps o juegos a Flash.
00:03:26Iba a conferencias de gaming a hablar con desarrolladores y les ayudaba a portar sus juegos a Flash; un ejemplo famoso es Machinarium.
00:03:40Fue de los primeros juegos que portaron de Flash a iOS a través de Adobe AIR; fue un hito ver un juego de Flash funcionando en un iPad.
00:03:55Fue un momento muy importante.
00:03:56Se convirtió en el juego o la aplicación del mes en la App Store y se hizo increíblemente popular.
00:04:04¿Fuiste parte de la comunidad de Newgrounds en su momento?
00:04:08No, ¿qué es eso?
00:04:11Newgrounds era el sitio donde estaban todos los juegos y películas de Flash.
00:04:18Era muy popular antes de que existiera YouTube.
00:04:21Yo pensaba que ese era Miniclip.
00:04:23Ah, Miniclip, me acuerdo de Miniclip.
00:04:24Para mí, el sitio era Miniclip.
00:04:28Pero pasaba todo el día en mis webs de premios favoritas, como la FWA y similares.
00:04:35Aunque ahora nos estamos yendo muy atrás en la historia de internet y la web interactiva.
00:04:43Supongo que esos fueron los cimientos que acabaron llevando a Pencil.
00:04:49Pero también creaste una herramienta o script llamado DrawScript en Illustrator. ¿Puedes hablarnos de eso?
00:04:55Claro, DrawScript era un plugin para Illustrator que permitía convertir dibujos básicamente en JavaScript.
00:04:56La idea era que pudieras coger eso y el código repintaría lo que tenías diseñado.
00:05:18Ese era el concepto.
00:05:19He investigado un poco tu trayectoria del diseño al código. Vamos a dar un salto en tu carrera, pero ¿qué te hizo querer codificar los diseños?
00:05:35¿De dónde vino ese deseo?
00:05:37Bueno, es que no había ninguna solución para llevar dibujos al código.
00:05:45Querías tener iconos y otras cosas, pero el SVG era muy limitado entonces y apenas tenía soporte; tú querías dibujar ciertas cosas directamente en el canvas de HTML.
00:06:04Esto permitía hacerlo porque, una vez que lo tenías en código, podías hacerlo interactivo, convertirlo en juegos y demás.
00:06:15Podías trabajar con ello, hacer que se moviera o usarlo para animaciones.
00:06:23Esa fue la puerta de entrada.
00:06:29Mientras estabas en Adobe, también trabajaste en Adobe XD.
00:06:34¿Cuál era la visión original?
00:06:36¿Iba a ser un reemplazo para Dreamweaver o cómo surgió XD?
00:06:42Fue en una época en la que existía Sketch, pero Photoshop se seguía usando mucho para diseñar webs y demás.
00:06:54Pero nos dimos cuenta de que sería genial tener una propuesta totalmente nueva diseñada específicamente para eso: diseñar sitios web y aplicaciones, sobre todo porque era la era del auge de las apps móviles.
00:07:12Queríamos replantearlo todo desde cero, partiendo de los principios básicos.
00:07:18Pensamos: "¿Qué pasaría si empezáramos de cero?". Así que definimos que debía ser ligero, accesible, rápido y que permitiera dibujar muchísimas mesas de trabajo.
00:07:35En Photoshop, al principio solo tenías una cosa y ya. Pero lo que realmente necesitabas era mostrar todo el flujo a través de diferentes pantallas.
00:07:49Adobe XD fue la herramienta diseñada específicamente para permitirte hacer eso.
00:07:54También incluía el prototipado.
00:07:57Podías conectar las pantallas, añadir áreas con desplazamiento y todo eso.
00:08:03Exacto.
00:08:05Voy a saltar un poco para ir directos a Pencil, porque es interesante ver tu viaje desde Adobe hasta crear esto, que es como XD pero usando mucha IA.
00:08:17¿En qué momento empezaste a darte cuenta del potencial de los LLM y los agentes?
00:08:24Hubo un par de startups entre medias, pero al final empecé a profundizar en Cursor, Claude y todo eso, como todo el mundo. Estaba construyendo otra cosa, pero usando Cursor me di cuenta: "Dios, ¿cómo le digo al LLM que este botón tiene que verse exactamente como lo tengo en mi cabeza?".
00:08:52O que hay una barra de navegación que debe ser fija arriba, con ciertos botones y demás.
00:09:00Sentía que escribía ensayos interminables a los LLM para intentar explicarles visualmente lo que quería.
00:09:09Miré a mi alrededor y no había ninguna solución.
00:09:11Busqué en el marketplace de VS Code y en otros sitios, y no había nada que te permitiera simplemente dibujar algo y decirle al LLM: "haz esto".
00:09:23Esto fue antes de que todo el mundo hiciera MCP y esas cosas. La idea inicial era: tengo este formato JSON y los LLM son muy buenos leyendo datos estructurados y convirtiéndolos en cualquier tipo de código.
00:09:38Así que hice un prototipo y lo publiqué.
00:09:41Fue en mayo de 2025 y se volvió viral.
00:09:45Tuvo un millón de vistas en redes: unas 850.000 en X y creo que 400.000 en LinkedIn.
00:09:53Y pensé: "Vaya, parece que no es solo un problema mío, hay más gente que necesita esta ayuda".
00:10:03Nadie estaba ofreciendo esa ayuda para pasar rápidamente de una idea visual al código.
00:10:10Una vez construido, me dio muchas otras ideas. Por ejemplo, me di cuenta de que también podía generar esos diseños.
00:10:23No se trata solo de que yo dibuje algo, sino de decirle al LLM: "Oye, dibújame esto, genérame esto y aquello".
00:10:30Ahí fue cuando comprendí que estábamos al borde del "vibe designing" o diseño por sensaciones.
00:10:39¿Fue ese vídeo del modo diseño para Cursor el que se hizo viral?
00:10:42Sí, se llamaba "Design Mode for Cursor".
00:10:45Sí, y básicamente todavía lo tenemos.
00:10:49Es un canvas dentro de los IDE basados en VS Code, como Cursor, Windsurf o Digravity.
00:10:59Básicamente es un editor visual personalizado dentro de tu IDE.
00:11:07Puedes hacer lo que quieras; luego seleccionas algo en el canvas y puedes copiarlo y pegarlo en el chat mediante un enlace, o simplemente señalarlo para que sepa qué has seleccionado.
00:11:21Entonces empezará a extraer información de ahí para convertirla en lo que tú quieras, sinceramente.
00:11:28No importa si es React o cualquier otra librería; es una representación agnóstica de la tecnología o el framework donde puedes idear rápido y luego transformarlo en lo que necesites.
00:11:45¿Eso significa que usa CSS puro o integra librerías como Tailwind o Shadcn?
00:11:52Puedes elegir lo que quieras. Internamente es solo un JSON estructurado que define la apariencia de lo que diseñas, y tenemos reglas integradas para convertirlo a Tailwind, por ejemplo.
00:12:10Pero puedes escribir tus propias reglas que se ajusten específicamente a tu base de código. Ese archivo ".pen", como lo llamamos, vive en tu repositorio Git.
00:12:23Así que cualquier ingeniero o agente de IA tiene acceso directo a él y puede convertirlo en lo que desee.
00:12:32Puedes crear tus propias reglas y hacerlo realmente tuyo.
00:12:39Creo que ese es el punto clave.
00:12:41La primera vez que usé Pencil me pareció mágico. Intento entender cómo funciona técnicamente entre bastidores.
00:12:49He visto el archivo JSON en el archivo ".pen", pero no sé cómo logra traducirlo a una interfaz con la que puedo interactuar, arrastrar cajas y cambiar colores.
00:13:01Y que además el agente pueda entenderlo y hacer exactamente lo mismo.
00:13:05¿Cómo lograste esa unión entre el diseño humano y que un agente diseñe sobre el mismo archivo?
00:13:12Fueron varias cosas. Queríamos crear un entorno increíblemente familiar que pudieras usar desde el primer minuto.
00:13:23Que dijeras: "Vale, me ubico en este canvas, puedo hacer zoom...".
00:13:29"Tengo las propiedades a un lado, el panel de capas al otro..."; queríamos que fuera super familiar.
00:13:36Pero al mismo tiempo, abrió puertas a cosas que nadie había resuelto antes, como: "¿Cómo interactúo con el diseño?".
00:13:47Eso nos dio oportunidades para innovar. Lo último que mostramos en ese vídeo fue un enjambre de múltiples agentes trabajando en el diseño de forma orquestada, como en un concierto.
00:14:02Y sinceramente, todavía hay muchísimo más por hacer.
00:14:10Cada día descubro cosas nuevas que antes no eran posibles, primero porque los LLM abren nuevas oportunidades con cada nuevo modelo que sale.
00:14:24Y también porque se nos ocurren nuevas ideas al hablar con los usuarios y ver cómo interactúan con las cosas.
00:14:32Ahora quieren controlarlo en remoto y todo tipo de cosas; lo que se puede hacer es una locura.
00:14:39Es increíble.
00:14:40Tengo curiosidad por saber con qué modelo empezaste o cuándo te diste cuenta de que los modelos podían ser buenos diseñando, porque los primeros no lo eran tanto.
00:14:50Creo que luego se centraron en añadir más datos de diseño al entrenamiento.
00:14:54Sí, todavía hay una brecha.
00:14:57Pero creo que mejora con cada lanzamiento.
00:15:01Creo que empezamos con Sonnet 3.5 o 3.7.
00:15:10Al principio tenías que darle muchas instrucciones sobre cómo debía verse todo.
00:15:18A medida que avanzamos, hemos llegado a una fase en la que basta con decir "diseña un sitio web".
00:15:27Y probablemente hará un trabajo bastante decente.
00:15:31Lo segundo que supuso un gran cambio, a medida que los modelos y agentes evolucionaban, fue lo que llamamos "elicitación", donde el modelo te hace preguntas extra como: "¿Qué es lo que quieres exactamente?".
00:15:46Es muy parecido a ser el cliente de una agencia. Lo primero que haría un diseñador o gestor de proyectos es entrevistarte para extraer toda la información posible y construir lo adecuado para ti.
00:16:10No podemos esperar que lo adivinen, aunque ahora sean poderosos, pero este diálogo que está surgiendo con los agentes es un avance enorme.
00:16:22Porque al principio decías "diséñame algo", te daba un diseño y pensabas: "esto no es para nada lo que quería".
00:16:29Pero ahora, mediante el diálogo, extraerá qué quieres realmente y cómo lo quieres.
00:16:34Así se acerca mucho más a darte el resultado correcto.
00:16:40Esa es una diferencia fundamental.
00:16:43Me imagino que habréis probado muchísimos modelos con Pencil.
00:16:48¿Hay modelos específicos que sean significativamente mejores que otros diseñando?
00:16:54Creo que mi favorito es Opus 4.6. Observando a la comunidad, se ha convertido en el estándar actual, el estado del arte para el diseño.
00:17:10Funciona muy, muy bien. También se maneja genial con datos estructurados.
00:17:15Con el diseño de capas es el que comete menos errores y demás.
00:17:22Con otros modelos, básicamente tenemos que corregir ciertos comportamientos.
00:17:28Y no pasa nada. Se trata de descubrir esos matices y asegurarnos de corregirlos o decirle al agente: "Oye, esto está mal, dale otra vuelta".
00:17:42Y suele funcionar. El único reto con Opus es que es algo lento, aunque sea increíble en otros aspectos.
00:17:54La primera vez que vi magia de verdad fue cuando salió Composer de Cursor; pensé: "Vaya, esto es rápido".
00:18:04"Está diseñando a la vez que yo pienso las cosas".
00:18:08Lo que espero ver según avancemos es que, aunque todavía falta mejorar la calidad...
00:18:19...tengo muchas esperanzas en que los laboratorios se centren ahora en la velocidad.
00:18:24Ya está empezando a pasar con Cerebras, Sparkle y demás.
00:18:30Espero que la próxima fase de innovación se centre en la velocidad, porque eso te permite mantener el flujo de trabajo como diseñador.
00:18:42A menudo es más importante poder hacer muchas repeticiones que acertar a la primera.
00:18:51Quieres participar en el proceso, y los modelos rápidos te permiten hacerlo.
00:18:58Para nosotros, este es un principio fundamental al construir cosas: asegurarnos de que no pierdas el ritmo.
00:19:06Esa es la gran diferencia entre usar una herramienta de programación por sensaciones donde escribes un prompt, te vas a por un café y vuelves 10 minutos después esperando que esté listo y que además sea algo que ni querías.
00:19:19El diseño por sensaciones es distinto.
00:19:21Quieres ver cómo ocurren las cosas en tiempo real.
00:19:24Por eso hemos puesto esos cursores que se mueven; puedes ver qué está pasando y cómo piensa el modelo.
00:19:33Ser muy comunicativo con el usuario es vital cuando las cosas tardan un poco más de lo que deberían.
00:19:42Pero también espero que los modelos lleguen a ser tan rápidos que todo aparezca al instante.
00:19:49Y algo que vale la pena mencionar es que el paralelismo es otro avance enorme.
00:19:57Quizás el modelo sea lento, pero si puede hacer varias cosas a la vez, de repente eso ya no es un obstáculo o un impedimento.
00:20:08No importa que tarde un poco si puedes trabajar en múltiples áreas del canvas mientras tanto.
00:20:17No tienes que esperar a que los agentes terminen.
00:20:23Puedes empezar a retocar el diseño mientras el agente está trabajando, lo cual es genial en Pencil.
00:20:32Puedes reorganizar cosas mientras él sigue a lo suyo. De nuevo, por esto el "vibe designing" tiene tanto sentido frente a solo programar.
00:20:45No puedes tocar el código mientras un agente está trabajando en él porque podrías estropearlo, hacer que no compile, etc.
00:20:54Pero aquí, como todo está separado en el canvas, sí que puedes hacerlo.
00:21:01Lo que más me gusta de la trayectoria de Pencil es que tienes mucho conocimiento del mundo del diseño, porque creo que en muchas herramientas modernas de programación por sensaciones...
00:21:10...la gente se ha preguntado "¿podemos hacer esto?" en lugar de "¿deberíamos?". He visto flujos de trabajo de diseño por sensaciones que eran terribles, pero me gusta tu enfoque de ayudar al humano en lugar de reemplazarlo.
00:21:25Esas son las herramientas de IA que me atraen, y Pencil tiene un enfoque muy chulo.
00:21:30Sí, totalmente. Al hablar con usuarios, comentan que ahora sienten que tienen un grupo de diseñadores junior acompañándoles, y pueden orquestarlo todo mucho mejor y más rápido.
00:21:51Antes se perdía mucho tiempo ajustando rellenos, márgenes, tamaños de fuente y todo eso.
00:22:01Pasabas horas en eso, aunque en tu cabeza la visión ya estuviera clara.
00:22:07Solo necesitabas tiempo para correr ese maratón, por así decirlo. Pero ahora puedes esprintar. Como ya lo estás viendo, solo quieres materializarlo.
00:22:20Volviendo a lo de los agentes paralelos, ¿te refieres a varios agentes trabajando en el mismo diseño o en diseños diferentes? ¿Qué quieres decir con paralelo?
00:22:38Todo lo anterior, en realidad. Es curioso; al principio buscábamos el paralelismo para explorar variantes de un mismo diseño en distintas partes del canvas.
00:22:53Pero luego me pregunté: "¿por qué no pueden varios agentes trabajar en la misma página?". Y es posible. Si se orquesta bien, pueden dividirse el trabajo sin conflictos, algo que en código es difícil pero en el canvas no.
00:23:15Solo necesitan entender qué quieres lograr y dividirse el trabajo por secciones: un agente se encarga de la cabecera, otro de la parte central y un tercero del pie de página.
00:23:32Puedes tener varios agentes por página, que es lo que mostré en el último vídeo de X: tres páginas con dos agentes en cada una.
00:23:50Hay un artículo de Cognition que dice que no se deben usar varios agentes por problemas de contexto. Dicen que no comparten la visión de lo que hacen; por ejemplo, en un juego de Mario, uno haría el nivel y otro los personajes, pero podrían tener gravedades distintas. ¿Cómo habéis solucionado eso en Pencil?
00:24:15Con magia. Bueno, con muchas iteraciones; hay que profundizar en ello y, sinceramente, solo hemos rascado la superficie. Creo que solo hemos mostrado hacia dónde pueden ir las cosas.
00:24:32Aún queda mucho por hacer con el contexto compartido y las optimizaciones de velocidad, uso de tokens y demás.
00:24:49Estamos en el principio de algo muy emocionante. Puedes tener distintos roles, como decías. Para mí es emocionante tener agentes con el mismo rol frente a roles distintos.
00:25:14Tener equipos de agentes con roles distintos está bien, pero al final uno espera al otro. El paralelismo que me emociona es que no se esperen entre sí, que trabajen realmente a la vez, como una GPU.
00:25:30Con tantas herramientas, modelos y entornos de agentes, cuando trabajas en Pencil, ¿qué herramientas usas tú y cómo es ese proceso de ida y vuelta con el agente?
00:25:45¿Te refieres a qué herramientas específicas dentro de Pencil o...?
00:25:49Ambas. En Pencil, ¿usas Codex? ¿Claude Code? ¿Gemini? ¿Qué utilizas?
00:25:57De todo. Me sorprendió mucho al lanzar Pencil la cantidad de combinaciones distintas que la gente quería usar.
00:26:08Nuestro Discord se llenó de gente preguntando si podían usarlo con tal o cual modelo del que nunca había oído hablar.
00:26:17O con este entorno de agentes, o aquel CLI. Me sorprendió lo vasto que es ya este mundo.
00:26:30Y solo estamos al principio; veremos muchísimas combinaciones.
00:26:38Ahora mismo en Pencil puedes ejecutar un marco en Codex, otro en Opus, un tercero con Gemini, etc.
00:26:48Es increíble. Puedes usar todos esos modelos a la vez para comparar y contrastar resultados.
00:26:56Pueden colaborar entre ellos, es muy interesante.
00:27:02Me pregunto cómo evaluáis internamente las capacidades de diseño de los modelos. ¿Tenéis algún sistema para comprobar si un nuevo modelo supone una gran mejora?
00:27:14Sí, claro. Hay formas automatizadas, pero también mucho trabajo manual porque estamos en una etapa muy temprana.
00:27:32Cuando sale un modelo, lo primero que hago con ilusión es ver qué ofrece. A veces son matices difíciles de explicar, pero los ves y notas que hay un poco más de detalle, como al pasar de Opus 4.5 a 4.6.
00:27:51No sabría describirlo bien; la gente me pregunta la diferencia y ojalá pudiera decirla, pero al probarlo lo ves. Hay más detalle aquí y allá, y de repente todo tiene más sentido.
00:28:03Creo que seguiremos así hasta Opus 5.0 y más allá. También están saliendo nuevos modelos de imagen.
00:28:15De nuevo, un poco más de detalle que no sabes explicar, pero que reconoces en cuanto lo ves.
00:28:22Si ahora quisiera el diseño de una web, podría ir a Nano Banana Pro 2 o algo así y que me lo diseñara. ¿Hay forma de llevar eso a Pencil o es mejor empezar de cero en Pencil?
00:28:48Totalmente. De hecho, lo que puedes hacer es arrastrar una imagen abierta directamente al chat de Pencil, incluso varias imágenes a la vez.
00:28:59Puedes arrastrar imágenes y archivos Markdown o de texto con tus propias reglas o guías. Mucha gente está construyendo cosas así.
00:29:12Usan un conjunto de reglas, librerías e imágenes para obtener el resultado deseado. También puedes usar la foto de una fruta o una flor como imagen inspiracional.
00:29:28Así creamos varias de nuestras guías de estilo: usamos una imagen con una "vibe" concreta, como una flor, y dejamos que el modelo extraiga la paleta de colores.
00:29:43Creo que veremos cada vez más esa exploración y combinación. Igual que un humano: sales a caminar por la montaña, el bosque o la playa, o simplemente por la calle, ves algo y te inspiras.
00:30:04Dices: "¡ajá!, esto es lo que quiero". Antes, cuando diseñabas a mano, te quedabas con esa instantánea mental en la cabeza.
00:30:17Volvías a casa, te ponías frente al ordenador y el diseño se veía influenciado por lo que habías visto durante el día.
00:30:25Pero ahora puedes pasarle eso directamente a la IA y ver qué sale.
00:30:30¿También es capaz de diseñar algunas animaciones SVG locas o algo así si le das, no sé, un recurso SVG o una imagen?
00:30:42Con SVG no necesariamente todavía, pero he visto algunos modelos de SVG que salieron hace poco.
00:30:49Es realmente interesante lo que está pasando en ese frente. Y también creo que la animación es la próxima gran frontera.
00:31:01Está Remotion, ¿verdad? Y Lottie y todas esas cosas. Y Replit acaba de lanzar funciones de animación, ¿cierto?
00:31:12Así que creo que va a haber... esta es simplemente la próxima gran frontera por abrir.
00:31:18Apenas han arañado la superficie otra vez. Está bien, pero aún no llega al nivel de After Effects, al nivel de un diseñador profesional haciendo animaciones increíbles.
00:31:32Pero creo que hay mucho potencial en ese espacio también.
00:31:36Sabes, vi el nuevo modelo de SVG y se veía muy genial en la demostración porque los modelos actuales tienen dificultades con los SVG.
00:31:43Están mejorando cada vez más. Pero sí, ese modelo de SVG específico era increíble comparado con lo que es posible actualmente.
00:31:50Esto toca un tema muy interesante, y es que creo que estamos llegando al punto donde el diseño de la estructura se ve bastante bien.
00:31:57Pero sabemos que los sitios web no son solo una buena estructura, ¿verdad? Es esa emoción que percibes.
00:32:04Y eso puede reforzarse con una ilustración, rompiendo el texto con algo muy llamativo y luego quizás subtítulos.
00:32:16Así que es una composición de texto de una manera interesante o poco convencional.
00:32:22Tal vez hay un video que se mueve, pero es solo para dar una sensación; no es necesariamente... es como una imagen abstracta que se mueve un poco o cosas que se deslizan al hacer scroll.
00:32:41Así que sí, creo que esas son las cosas que probablemente empezarán a integrarse en el "vibe design", especialmente en el lado de la ilustración, porque entonces puedes... ¿qué hay del 3D?
00:32:54Muchos de estos sitios ahora tienen representaciones de cubos, por ejemplo, y muestran la estructura de cómo los bytes se unen en paquetes y demás.
00:33:11Probablemente hemos visto varios de estos sitios, y eso es lo siguiente que falta porque ahora los generadores de imágenes crean fotos geniales, pero ¿qué hay de las ilustraciones?
00:33:23Y creo que las ilustraciones van a ser algo enorme en la segunda mitad de 2026.
00:33:30Eso me emociona porque me han costado las ilustraciones en el pasado.
00:33:33Nunca he sido muy bueno diseñando ilustraciones con las herramientas de Adobe y demás.
00:33:37Sí, es un buen punto. Creo que muchos de nosotros podemos apreciar cuando un diseño es bueno.
00:33:47Incluso podemos visualizarlo en nuestra mente.
00:33:49Es solo que existe esa brecha entre nosotros y la computadora para materializarlo.
00:33:55Y lo que me entusiasma mucho es ver cómo más herramientas ayudan a cerrar esa brecha entre tú y tu visión.
00:34:04¿Sigues pensando que el toque humano es necesario, dado que si confiamos totalmente en la IA para el diseño, todo se verá bastante genérico?
00:34:13¿Crees que el toque humano consiste, como dijiste, en buscar inspiración fuera, en el mundo real, y llegar con tu idea para guiar a la IA en esa dirección?
00:34:22¿Es por eso que todavía se necesita a un diseñador humano en el futuro?
00:34:27Sí, quiero decir, muchos de los grandes productos que usamos a diario tienen ese elemento de "gusto" que es innegable.
00:34:39Y es muy importante porque creo que lo que obtendremos de la IA, tanto en código como en diseño, será un resultado estándar, que irá mejorando.
00:34:51Se verá cada vez mejor, por supuesto, pero aún podría faltarle ese toque final de alguien.
00:35:00Y creo que eso seguirá siendo realmente importante.
00:35:02Y ese toque final podría ni siquiera ser el último paso.
00:35:04Podría ser un proceso intermedio con muchas iteraciones donde tú te mantienes involucrado.
00:35:11Es solo que el paralelismo y estas herramientas de "vibe design" y "vibe coding" te permitirán llegar más rápido.
00:35:18La cantidad de repeticiones que hagas te permitirá producir cosas no solo más rápido, sino en última instancia, mejores.
00:35:28Y si miras el internet hoy en día, no todo se ve increíble.
00:35:34Mi esperanza es que elevemos la experiencia de usuario general en todas partes, simplemente por un orden de magnitud.
00:35:46Esa es realmente mi esperanza para el futuro.
00:35:52Por lo que puedo ver, esa es probablemente la próxima frontera.
00:35:56¿Qué viene después de eso?
00:35:58Quién sabe.
00:35:59Todavía estamos descubriendo muchas de estas cosas a diario.
00:36:05¿Tendrías algún consejo para un diseñador principiante que empieza ahora sobre cómo mantenerse al día en este mundo?
00:36:12Sí, creo que Marc Andreessen describió esto muy bien.
00:36:18Voy a retroceder un par de pasos y luego responderé a tu pregunta.
00:36:23Él lo describió como un duelo a tres bandas donde el PM señala al diseñador y al ingeniero, y el ingeniero al diseñador y al PM.
00:36:35Y todos piensan que pueden ser la otra persona.
00:36:39Y estaba pensando que, históricamente, ibas a una escuela y estudiabas diseño durante cuatro o cinco años.
00:36:46O ibas a una escuela de ingeniería y estudiabas ingeniería por cuatro o cinco años.
00:36:53Como PM, quizás fuiste a una escuela de negocios o algo así, y simplemente te obsesionaba construir cosas y entender el comportamiento del usuario.
00:37:06Pero honestamente me pregunto...
00:37:11¿Qué va a pensar la Gen Z y la Gen Alpha cuando tengan que elegir su escuela o profesión?
00:37:21Para mí esa es la mayor pregunta, porque creo que ahora todo el mundo se está convirtiendo en un creador, esencialmente en un constructor.
00:37:29Y ya no nos vemos necesariamente, al menos esa es mi hipótesis, como "solo soy un ingeniero".
00:37:39O "solo soy un diseñador". Hablo de la nueva generación, no de la actual.
00:37:46Lo que creo que veremos más y más son personas que resuelven problemas.
00:37:50Tengo un problema que quiero abordar y simplemente usaré las herramientas que necesite.
00:37:55Siempre he operado con esa mentalidad, y para mí todo empezó con Flash.
00:38:01Flash fue realmente la primera herramienta que te permitía ser diseñador e ingeniero en un mismo entorno.
00:38:11Y era realmente mágico.
00:38:13Obviamente, no escaló.
00:38:15Se rompió en muchos niveles más adelante cuando salieron nuevos frameworks y demás.
00:38:20Pero siempre soñé con que algo así regresara, donde la gente con una visión use cualquier herramienta necesaria para realizarla.
00:38:33Y para mí, el "vibe coding" y el "vibe design" es lo más parecido a Flash que he visto en dos décadas.
00:38:44Quería preguntarte sobre tus guías de estilo.
00:38:47¿Cómo las gestionas y cómo las construyes?
00:38:51Porque en diseño sabemos que cada año Pantone decide cuál es el color del año o surgen tendencias que todos usan.
00:39:05¿Te imaginas que Pencil también se actualice a medida que estas tendencias evolucionan?
00:39:12Sí, de hecho acabamos de actualizar nuestras guías de estilo con el último lanzamiento.
00:39:16Y siempre las estamos renovando.
00:39:18Pero nunca pensé en nuestras guías de estilo como algo definitivo.
00:39:22Siempre las vi como una pequeña ayuda para darte una idea de lo que puedes lograr aquí.
00:39:30También para solucionar el problema del inicio en frío de un lienzo en blanco.
00:39:37Ese sentimiento de "no sé cómo usar la herramienta".
00:39:42Ese era el punto principal.
00:39:46Pero nuestro objetivo es documentarlo y abrirlo para que la gente pueda crear las suyas, contribuir y compartirlas con la comunidad.
00:39:56Nunca me vi en una posición en la que quisiéramos ser los que marcan el ritmo o algo así.
00:40:03Para nada.
00:40:03Simplemente una inspiración para que otros construyan encima y se inspiren.
00:40:09Volviendo a Flash, cuando empecé a trabajar con él, estudié muchísimos archivos para ver cómo la gente construía diferentes cosas.
00:40:19Esa fue mi fuente de inspiración para aprender a crear cosas, pero también para entender todas esas complejidades internas.
00:40:33Así que espero que nuestras guías de estilo sean solo eso, una inspiración para que otros construyan, remezclen y las hagan suyas.
00:40:45Parece que otras empresas se están dando cuenta de lo que Pencil ha logrado.
00:40:51Sé que Sketch ya tiene el servidor MCP o herramientas similares, y Figma también.
00:40:56Figma también tiene sus propias herramientas MCP.
00:40:59¿Cómo te vas a diferenciar o mantenerte a la vanguardia para que esas otras empresas no se lleven tu cuota de mercado?
00:41:07Bueno, creo que simplemente tenemos que... es una pregunta interesante, pero ¿cómo diferencias entre Cursor y Copilot?
00:41:17Quizás te devuelvo la pregunta.
00:41:20Hay un matiz, ¿verdad?
00:41:24Hay una diferencia.
00:41:26Tal vez podríamos explicarlo con palabras si profundizamos, pero obviamente hay una diferencia importante.
00:41:33Así que espero que podamos mantener eso y seguir a la vanguardia de la innovación.
00:41:45Y como he dicho varias veces, hay muchísimo por hacer.
00:41:50Quiero asegurarme de que estemos liderando esa innovación desde el lado de Pencil.
00:41:57Para crear Pencil, pasaste por un programa, ¿fue el Speedrun de A16Z?
00:42:05Sí, se lo recomendaría a todo el mundo.
00:42:11Están Vysee y Speedrun, por supuesto.
00:42:15Yo diría que esos son los más famosos.
00:42:20Pero hay muchísimos programas de aceleración en todo el mundo.
00:42:24Speedrun fue una gran experiencia para mí por varias razones.
00:42:31Durante el COVID, todo el mundo se encerró y no salía mucho, ¿verdad?
00:42:40Y creo que Speedrun fue una gran oportunidad para reconectar con otros fundadores de forma regular.
00:42:48Esa cantidad de energía es algo que no se valora lo suficiente.
00:42:53Creo que todos deberían pasar por eso y pasar tiempo con un grupo cercano de personas...
00:42:58...que tienen la misma visión de seguir superando los límites de lo posible.
00:43:03Así que esa fue la razón número uno.
00:43:06La número dos es que realmente te forma como fundador de una manera muy positiva.
00:43:13El gran apoyo del equipo de Andreessen Horowitz es innegable.
00:43:20Y puedes discutir muchísimas cosas con ellos.
00:43:25Tienen muchísima experiencia porque han visto de todo.
00:43:27Así que tienen un gran instinto sobre lo que podría funcionar y lo que no.
00:43:32Son grandes asesores.
00:43:35Pero también está ese momento en el que tienes que presentarte en un "demo day" ante mil inversores.
00:43:42Este año estuvimos en el Speedrun número cinco.
00:43:49Fue en el Yerba Buena Center for the Arts en San Francisco.
00:43:53Es el lugar donde Steve Jobs anunció el iPad y otros productos de Apple.
00:44:00Y ahora tú estás ahí, parado en ese escenario.
00:44:02Hay una energía mágica en ese lugar.
00:44:05Es una locura.
00:44:07Y de verdad creo que todo el mundo debería pasar por eso.
00:44:11Es una experiencia genial que te obliga a pulir mucho tu discurso.
00:44:18Solo tienes dos minutos para presentar.
00:44:22Hablar de Pencil durante una hora es fácil.
00:44:28Pero hablar de ello en dos minutos es increíblemente difícil, sobre todo en un escenario...
00:44:35...donde las luces te ciegan en cuanto sales.
00:44:38Porque vienes de la parte trasera, que es un lugar súper oscuro.
00:44:44No hay luces, nada.
00:44:47Y de repente sales al escenario y una luz súper brillante te ilumina.
00:44:52Y tienes que empezar a hablar de lo que estás construyendo de forma muy entusiasta.
00:44:58Y tiene que fluir así, sin parar.
00:45:01Tuve que ensayar muchísimo para eso, obviamente.
00:45:05Pero en general, es una experiencia increíble para cualquiera para...
00:45:10...salir ahí fuera y sacar lo mejor de ti.
00:45:14Sí.
00:45:16Siempre pienso que la gente en California o San Francisco tiene una ventaja injusta...
00:45:20...porque estás en el centro de la tecnología y sientes el poder de la IA y todos los hubs tecnológicos.
00:45:28Y demás.
00:45:29¿Tú sientes lo mismo?
00:45:31Sí, al cien por cien.
00:45:34Viví en SF por muchos años.
00:45:36No vivo allí ahora mismo.
00:45:38Lo hago por dosis, porque sinceramente, hay una energía estupenda.
00:45:44Pero también hay mucho ruido relacionado con eso.
00:45:47Así que el equilibrio que encontré es ir allí de forma regular...
00:45:53...pero no necesariamente estar allí a diario.
00:45:59Me inspira de una forma nueva cada vez que voy.
00:46:05Eso es lo que me funciona.
00:46:08Pero pasé una década allí, ¿sabes?
00:46:10Conozco cada rincón de la ciudad.
00:46:14Pero sí, definitivamente es una especie de ventaja injusta.
00:46:19Puedes hablar con cualquiera que vuele a SF y te dirá que siempre...
00:46:24...vuelven del viaje increíblemente revitalizados.
00:46:26Así que sí, una cosa que recomendaría es agarrar tu maleta...
00:46:33...volar a SF, conocer gente, hablar con ellos y simplemente compartir ideas.
00:46:38En Pencil.dev, ¿hay un equipo o eres solo tú por ahora?
00:46:42Somos 10 personas ahora mismo.
00:46:45Sí, y es un equipo fantástico.
00:46:50Nos conocemos desde hace tiempo.
00:46:52Es un producto realmente complejo si lo piensas bien.
00:46:57Así que definitivamente requiere más gente aparte de mí.
00:46:59Sí.
00:46:59¿Son personas que conociste en Adobe, en tu startup anterior o...
00:47:06...en el Speedrun?
00:47:09Algunos son de la startup anterior en la que trabajamos.
00:47:16Y otros son nuevos.
00:47:18Es una mezcla de gente.
00:47:19Sí.
00:47:20Ah, genial. Y hablando de la startup anterior, ¿puedes contarnos de ella?
00:47:24Sí.
00:47:25Una de ellas se llamaba Around, por ejemplo, y era una aplicación de videoconferencias.
00:47:30No sé si la conocen.
00:47:33¿La han visto?
00:47:34La que usamos hasta que...
00:47:37Sí, la usamos.
00:47:38Sí, yo la usé.
00:47:40Nos gustaba mucho.
00:47:41Nos puso muy tristes cuando desapareció.
00:47:42Sí.
00:47:44¿Cuál fue su impresión de la herramienta? Si no les importa compartirla.
00:47:50Tengo curiosidad, la verdad.
00:47:51Se sentía un poco más divertida y con mejor experiencia que Google Workspace o Slack...
00:47:57...y cosas por el estilo.
00:47:57No sé.
00:47:59Parecía que hacía exactamente lo que debía con algunas funciones geniales.
00:48:03Nuestra intención siempre fue hacerla un poco más divertida, sobre todo...
00:48:07...durante los tiempos del COVID.
00:48:09Sentía que todo el mundo intentaba hacer video en HD y 4K, cada vez más y más grande.
00:48:15Y más grande.
00:48:15Y nosotros dijimos: "Pensemos diferente".
00:48:17¿Qué tal si hiciéramos círculos pequeños en el escritorio para que los demás...
00:48:23...te vieran menos, de alguna forma?
00:48:25Pusimos esos filtros y demás, y de repente todos se sintieron más cómodos...
00:48:31...en las discusiones de equipo.
00:48:33Y creo que ese fue un factor muy, muy importante.
00:48:38En todos los productos en los que he trabajado, siempre intento encontrar...
00:48:46...ese pequeño detalle que sea completamente diferente a los demás.
00:48:51Siempre busco eso en lugar de decir: "Alguien construyó esto, voy a intentar...
00:48:58...rehacerlo, copiarlo o lo que sea".
00:49:01Creo que es muy importante encontrar algo nuevo que te apasione...
00:49:08...porque al final esto es un maratón y tienes que estar personalmente entusiasmado...
00:49:15¿sabes?
00:49:17Y con Pencil, cuando vi esos cursores volando sobre el lienzo
00:49:23por primera vez, pensé: «Es esto».
00:49:25Es increíble.
00:49:25No podía dejar de mirarlo.
00:49:27Me quedé hipnotizado.
00:49:29Y entonces dije: «Dios mío, me muero de ganas de compartir esto con los demás».
00:49:35Son esos detalles. Al principio teníamos una animación
00:49:40que escaneaba los elementos, pero no era obligatorio hacerlo.
00:49:43Podríamos habernos limitado a leer el JSON y ya está.
00:49:47Pero el hecho de que escaneara el fotograma me hizo pensar: «Vaya, esto...»
00:49:56puedes sentirlo.
00:49:56Sientes la IA.
00:49:57Y espero... mucha gente ha estado hablando de esto,
00:50:04de que el chat es la interfaz principal para la IA.
00:50:08Sinceramente, empiezo a creer que estamos descubriendo nuevas experiencias de usuario
00:50:14para interactuar con la IA que nunca antes se habían visto.
00:50:19Esos cursores y el escaneo son solo la punta del iceberg.
00:50:24Veremos mucho más de eso.
00:50:25Simplemente guiándote visualmente durante toda tu creación.
00:50:29Realmente hace que parezca que la IA no es solo un chat de texto de un LLM,
00:50:36sino que hay algo más, algo creativo detrás.
00:50:40No lo sé.
00:50:40No encuentro la palabra exacta ahora mismo, pero se empieza a sentir así.
00:50:45¿Sabes?
00:50:46Creo que es especialmente cierto que el chat es una mala interfaz para temas
00:50:50creativos, como el diseño y todo eso.
00:50:52Es muy difícil plasmar en un prompt exactamente lo que quieres ver en la página.
00:50:56Sí, y creo que si queremos que más gente en el mundo use la IA,
00:51:03tendremos que idear mejores interfaces para ello.
00:51:04Claro, la voz podría ser una de ellas, pero no sé...
00:51:10¿cuántas veces usáis la voz para interactuar con la IA?
00:51:13Rara vez. Así que creo que tendremos que
00:51:19encontrar nuevas interfaces también para eso.
00:51:20He estado pensando en eso de vez en cuando y creo que
00:51:24si hubiera una forma en que la IA pudiera escuchar lo que pienso... porque a veces no quiero hablar,
00:51:28no quiero escribir, solo quiero que entienda lo que pienso y lo haga.
00:51:31No sé si será con Neuralink o lo que sea, pero si hay forma de hacerlo,
00:51:35sería una interfaz genial.
00:51:36Sí, de hecho deberías considerar invitar a un buen amigo mío a este pódcast.
00:51:44Jakub Zezulka, es un diseñador muy reconocido,
00:51:50un talento emergente que hace poco publicó un vídeo de su último prototipo.
00:51:55Está usando seguimiento ocular en el iPhone y, básicamente, solo con mirar
00:52:02diferentes elementos en la pantalla, dice qué debería pasar con ellos.
00:52:05No tiene que describir: «Esta imagen de la izquierda».
00:52:08Solo mira la imagen y dice: «Cámbiala por tal cosa».
00:52:10Y la IA sabe exactamente qué está mirando.
00:52:13Este tipo de interfaces van a abrir muchísimas posibilidades porque,
00:52:19si la IA sabe qué tienes en mente —y la vista y la dirección
00:52:24de tu mirada son pistas clave—.
00:52:26Y espero que encontremos muchas más pistas de este tipo.
00:52:30Entonces todo se sentirá mucho más natural.
00:52:33Como si estuvieras aquí a mi lado en la habitación y yo no tuviera que decirte
00:52:38«mira esto» y señalar específicamente esa cosa.
00:52:42Ya lo sabrías simplemente por el contexto de la situación.
00:52:48Eso es genial.
00:52:49Iba a decir que yo soy de los que usa mucho la voz porque a veces
00:52:55estoy harto de escribir.
00:52:56Solo quiero hablarle a la IA.
00:52:58Así que si puedo hablarle y sabe hacia dónde miro, es un producto increíble.
00:53:03Me gusta eso.
00:53:04Sí.
00:53:05O imagina incluso que pudiera rastrear la mano y pudieras señalar cosas en la pantalla
00:53:10o hacer gestos. A veces, cuando vas en el coche, dices
00:53:15«ve por aquí» y no dices «derecha» ni «izquierda».
00:53:19Solo dices: «Gira aquí».
00:53:20Y me gustaría poder decirle a la IA en el coche o al conductor autónomo:
00:53:28«Gira aquí». Los acompañantes lo entenderían,
00:53:33pero la IA no tiene ni idea.
00:53:35Tendrías que decir: «Gira a la derecha en esta intersección».
00:53:37Y piensas: «Madre mía, ¿quién va a decir todo eso?».
00:53:40Es demasiado engorroso.
00:53:43En fin, ¿tienes alguna opinión arriesgada sobre diseño, IA o la industria tecnológica en general?
00:53:50Es una pregunta con mucha miga.
00:53:53Aunque en realidad es muy sencilla.
00:53:55Necesitamos el titular, hay que conseguir el clip.
00:53:59Sí, ¿cuál sería una opinión arriesgada?
00:54:02Bueno, creo sinceramente que lo que acabamos de comentar
00:54:06es una visión bastante atrevida: espero que descubramos estas nuevas interfaces
00:54:12para interactuar con la IA que resulten más humanas y naturales.
00:54:16Y que la IA sepa, por el contexto del mundo, por tu propio contexto y tu punto de vista,
00:54:26por tu foco visual, qué es lo que realmente tienes en mente.
00:54:30Para no tener que llevarla tanto de la mano.
00:54:34Como ocurre hoy en día. Volviendo a mi idea inicial de que
00:54:40preferiría dibujar algo antes que describirlo con palabras, es exactamente lo mismo.
00:54:44Para mí, a menudo es más fácil dibujar algo o señalarlo que
00:54:52explicarlo con palabras.
00:54:53Así que creo que este es el siguiente paso inmediato que
00:55:00empezará a cambiar en la IA.
00:55:01Además, si piensas en ChatGPT hace unos años,
00:55:06tenías que hacer preguntas y prompts larguísimos. Ahora,
00:55:10preguntas algo corto y hace todo el análisis,
00:55:14te da 20 opciones y demás.
00:55:16No para.
00:55:17Como que ya sabe por dónde vas.
00:55:21Y quizá esté influenciado por otros chats que la gente ha tenido allí
00:55:30y ha guardado algunos de esos pensamientos y respuestas.
00:55:33Así que sí, creo que esa es la otra cuestión: muchas veces
00:55:41un nuevo prompt en un LLM es como empezar un mundo nuevo.
00:55:45Empieza de cero.
00:55:46Espero que veamos mucho más de esa memoria compartida.
00:55:51Creo que la gran diferencia está entre decir «LLM, resume esto» y
00:56:01que el LLM sea un colega más en tu Slack, con todo el contexto de
00:56:06todas las conversaciones que han ocurrido allí y que no tenga que
00:56:11rebuscarlo todo cada vez para procesarlo, porque eso se siente ineficiente.
00:56:13Así que sí, veremos mucho más de eso.
00:56:16Iba a decir, volviendo a Around, que echamos mucho de menos los efectos de sonido
00:56:21y el minijuego al que jugábamos al final de la llamada.
00:56:22Nuestra mayor pérdida fueron los efectos de sonido.
00:56:25Nos encantaban.
00:56:26Sí, totalmente.
00:56:28Además, ¿no sería genial poder jugar a ese juego ahora mismo?
00:56:31Sí.
00:56:32Sí.
00:56:33Sí, eso era lo que más me gustaba.
00:56:35Sí.
00:56:36Genial.
00:56:40Buenos tiempos.
00:56:41Creo que ahora usamos Slack.
00:56:42Usamos los huddles de Slack y no es lo mismo.
00:56:44Ya.
00:56:45Me parece increíble.
00:56:46Slack no tiene función de grabación.
00:56:48Simplemente dejadme grabar la llamada.
00:56:51Parece algo tan sencillo.
00:56:52Pero bueno.
00:56:54Sí.
00:56:55Sí.
00:56:56Bien.
00:56:57¿Puedes contar qué pasó con Around?
00:57:00Sí, Around fue adquirida por Miro y se integró
00:57:08completamente en la experiencia de pizarra de Miro, así que ahí sigue.
00:57:10Vale, entiendo.
00:57:12Sigue existiendo, pero tienes que usar Miro.
00:57:15Gracias por tu tiempo, Tom.
00:57:16¿Hay algo que quieras promocionar?
00:57:17¿Algo en lo que estés trabajando aparte de Pencil de lo que quieras hablar?
00:57:21Bueno, primero, echad un vistazo a Pencil; estoy a vuestra disposición.
00:57:27Para vosotros y para todos los que prueben nuestro Discord general.
00:57:31La gente comparte ideas muy interesantes usando Pencil,
00:57:40y también capturas de pantalla y archivos de lo que han creado.
00:57:42Es una comunidad muy vibrante de miles de personas a estas alturas.
00:57:46Y sentíos libres de escribirme por DM en X o Discord si tenéis algún problema,
00:57:56alguna duda o sugerencias de funciones. Solo quiero
00:58:00que sepáis que estoy aquí para ayudaros.
00:58:02Una sugerencia que tengo son kits de UI personalizados.
00:58:07Porque a veces quiero crear mi propio kit sin usar Shadcn.
00:58:10Totalmente, tiene todo el sentido del mundo.
00:58:13Gracias por escuchar el Better Slack Podcast.
00:58:16Buscadnos en vuestra plataforma de pódcast favorita.
00:58:18Apple, Spotify... dadnos un «me gusta» o suscribíos si nos veis en YouTube.
00:58:23Por mi parte, esto es todo.
00:58:25Adiós por mi parte, adiós por mi parte y adiós por mi parte.
00:58:28Gracias a todos por escucharnos.
00:58:31Lo he disfrutado muchísimo.