Video Summary and Transcription
La charla discute la importancia de la innovación y las iteraciones rápidas en la resolución de problemas. Enfatiza los beneficios de mezclar diseñadores y desarrolladores desde el principio y usar React para la reutilización de componentes. Se mencionan las capacidades del modo de desarrollo de Figma como una herramienta para un desarrollo más rápido, aunque todavía es un trabajo en progreso.
1. Introducción a la Innovación
Hola a todos. Muy emocionado de hablar con ustedes sobre este tema hoy. Un poco de antecedentes sobre mí. Comencé a trabajar para un laboratorio de innovación llamado Hatchery Labs. Me uní a Google como parte de la transformación de front end. Comencé mi propio estudio llamado Torii Studio. ¿Qué es la innovación? ¿Estás resolviendo el problema correcto?
Hola a todos. Estoy muy emocionado de hablar con ustedes sobre este tema hoy. La Innovation es algo que realmente me emociona. Y cuando veo productos que están innovando, o incluso personas que tienen grandes ideas, esto es algo que realmente me emociona. Y definitivamente esto es algo de lo que estoy muy emocionado de hablar con todos ustedes.
Así que comencemos. Y antes de comenzar, quiero darles un poco de antecedentes sobre mí. Mi nombre es Cristobal Chao. Soy originario de España, llegué a los Estados Unidos hace 11 años en 2012. Y cuando llegué a San Francisco, comencé a trabajar para un laboratorio de innovation llamado Hatchery Labs. Y nuestro objetivo era construir otras startups. Fue muy emocionante. Fui el primer ingeniero allí, y me lo pasé muy bien trabajando con muchas startups. Algunas de ellas no llegaron muy lejos, pero algunas de ellas pasaron al siguiente nivel. Y una de ellas se convirtió en un unicornio, lo cual es muy, muy emocionante. Un año y medio después, me uní a Google como parte de la transformación de front end. Y aprendí mucho, no solo desde una perspectiva de ingeniería, también desde un design UI y UX. Y trabajo en grandes equipos. Fui parte del material design versión 1 y versión 2, construyendo los principales sistemas de componentes, así como moviendo todas estas piezas a través de plataformas como Google Maps y Search. Fue muy emocionante y me lo pasé muy bien allí. Y luego, hace unos años, en realidad a finales de 2019, hace tres años y medio, comencé mi propio estudio llamado Torii Studio y trabajamos con startups y también pequeñas, empresas de tamaño mediano para tratar de ayudarlas a pasar al siguiente nivel construyendo grandes aplicaciones de front-end. Y lo que quiero decir con geniales es front-ends que pueden escalar muy bien desde una perspectiva de ingeniería, así como construir productos que se ven y se sienten geniales. Esto es muy emocionante para mí y hemos visto a algunas startups pasar al siguiente nivel utilizando algunos de nuestros sistemas, procesos, y lo que todavía estamos aprendiendo. Y tenemos muchas cosas que aprender todos los días que es algo nuevo. Así que estoy muy emocionado de hablar realmente sobre la innovation hoy, que es lo que intentamos hacer con las empresas con las que trabajamos en Torii Studio. Entonces, ¿qué es la innovation, verdad? Muchas personas probablemente están innovando ahora mismo, las que me están escuchando hoy, tal vez en el pasado o tal vez están pensando en hacerlo en el futuro. Pero todos nosotros tenemos un sentido diferente de lo que es la innovation. Para que yo pueda explicar cómo pienso en la innovation, les hago esta pregunta, ¿estás resolviendo el problema correcto? Y su primera reacción probablemente sea seguro, quiero decir, esa es la parte fácil entender el problema. Y lo conozco muy bien. Sin embargo, mi respuesta para usted probablemente sea
2. Desafiando Perspectivas y Rápidas Iteraciones
Comienzas a construir la mejor solución para ese problema, pero la mayoría de los productos fallan en la primera iteración. ¿Puede un avión volar impulsado solo por la energía del piloto? Henry Cramer ofreció una gran suma de dinero para que las empresas cruzaran un canal con una bicicleta voladora. Después de años de costosos experimentos, Paul McGrady desafió la perspectiva y construyó un avión que podía ser reconstruido en horas, no en meses.
no eres realmente consciente de toda la perspectiva. Estás trayendo tu propia realidad, tus propios sesgos, y crees que lo sabes todo. Así que empiezas a construir la mejor solución para ese problema. Y esa es la principal razón por la que la mayoría de los productos fallan en la primera iteración. Realmente no conozco un producto que haya tenido éxito en el primer intento. Y te desafío a que me digas si me equivoco. No he visto uno en mi vida. Y para ilustrarte un poco sobre este tema, solo voy a compartir una historia que ocurrió en los años 50, 1959. Así que hace 70 años, el mundo era diferente al de hoy. Y Henry Cramer, era un magnate y surgió con esta pregunta. ¿Puede un avión volar impulsado solo por la energía del piloto? Así que es como ET, como volar en una bicicleta. ¿No es eso loco? Ofreció más de cien mil libras. En aquel entonces, era mucho dinero. Solo piensa que esa cantidad era alrededor de dos millones y medio de dólares. Así que era mucho dinero. Y había grandes empresas porque había una gran suma allí y mucha reputación que podían construir intentando resolver el problema. Quería que las empresas cruzaran un canal de dos millas con esta bicicleta voladora. Así que tenían que construirla. Tenían que hacer todo y luego intentar volar el canal. Así que grandes empresas estaban allí como la NASA y también un montón de individuos. Entonces, años después, nadie había descubierto eso todavía. Estaban gastando mucho dinero, mucho tiempo en cada experimento. Y era muy costoso porque cada vez que tenían que poner algo, les llevaría meses y luego se rompería y tendrían que reconstruir e intentar de nuevo. Así que estaba llevando mucho tiempo, mucho dinero. 18 años después, Paul McGrady como individuo desafió la perspectiva de las cosas. Así que vino con esta perspectiva, con una diferente. ¿Cómo puedes construir un avión que puedes reconstruir en horas, no en meses? Así que con esta perspectiva en mente donde estaba pensando en formas de crear un sistema que le permitiera aprender más sobre el problema haciendo iteraciones muy rápidas. Así que cada rápida iteración le ayudaría, bueno, le ayudaría a entender más sobre el problema e intentar de nuevo a partir de un aprendizaje que obtuvo de la iteración anterior y construir sobre eso. Así que en unos pocos meses, en realidad pudo crear un sistema que le permitió reconstruir la bicicleta que estaba construyendo en cuestión de horas. Así que en un solo día, en realidad pudo experimentar dos o tres veces. Y todos los competidores estaban tomando
3. Importancia de las Rápidas Iteraciones
Logró cruzar el canal y ganar el premio al estar por delante de todos los demás. Las rápidas iteraciones son importantes para entender y encontrar soluciones. No esperes un éxito inmediato; se necesitan muchas iteraciones. El pensamiento de diseño es un proceso similar utilizado en la construcción de productos digitales. Aprende de cada iteración y sigue intentándolo. Albert Einstein enfatizó la importancia de la experimentación.
meses. Entonces, si piensas en eso, él estaba por delante de todos los demás simplemente al poder hacer eso. Y en cuestión de meses después de que creó el sistema, en realidad pudo cruzar el canal y ganar el premio. La historia se llama Estás Resolviendo el Problema Crecido. Esto es de la Universidad de Stanford de Innovation. Realmente te animaría a echar un vistazo. Está mucho mejor explicado de lo que yo te estoy explicando. Así que es muy, muy interesante, esta historia. Y te dice, ¿verdad?, cuán importantes son las rápidas iteraciones. Cada iteración es muy importante. No pienses en construir la mejor solución. Solo intenta encontrar una forma de llegar allí rápido, y en realidad entenderás mucho. Y no pienses que lo vas a conseguir de inmediato. Probablemente te llevará muchas iteraciones.
Entonces probablemente te estás preguntando, OK, esto es genial. Esto es 1959. Así que la historia ahora es diferente. Estamos construyendo productos digitales. Usamos React. Entonces, ¿a quién le importa construir bicicletas voladoras? La Universidad de Stanford también presenta este proceso de design thinking. Algunos de ustedes lo saben, pero es una idea muy similar. Empatizas con el problema. Definir qué problema es. Idear una solución. Luego haces un prototipo y lo pruebas. Y quieres hacerlo muchas veces diferentes. Y cada iteración es un problema de aprendizaje muy, muy interesante. Así que quieres aprender de cada iteración tanto como puedas e intentar de nuevo y de nuevo y de nuevo. Como dijo Albert Einstein, ninguna cantidad de experimentación puede demostrarme correcto. Un solo experimento puede demostrarme equivocado. Logró muchas cosas simplemente
4. Importancia de las Iteraciones y Retroalimentación
Cada experimento es una iteración. Comienza con papel y dibuja tu idea. Obtén retroalimentación a través de diferentes fases. Construir el producto es lo que más tiempo lleva. Las grandes empresas luchan por innovar. Los equipos pequeños innovan mejor con recursos limitados.
haciendo experimentos. Para nosotros, es la misma idea. Queremos hacer experimentos. Cada experimento es una iteración. Así que es un concepto muy importante para que entiendas. Porque eso es la principal razón por la cual la mayoría de las startups tienen éxito, mientras que otras no.
Cuando estás tratando de innovar en el ciclo de vida de un producto, vas a empezar con un papel y dibujarás tu idea en él y la pondrás frente a la gente. Y vas a empezar a preguntar sobre cómo se siente. Sin embargo, si empiezas con papel, probablemente no vas a obtener mucha retroalimentación valiosa. Vas a obtener algún nivel de retroalimentación que será útil, pero no es la realidad. Puedes pasar por otras fases como intentar hacer wireframes, baja fidelidad, alta fidelidad, completamente funcional o construir el producto, ¿verdad? Pero hasta que no llegues al producto, no vas a obtener la retroalimentación de nivel más alto. Cuando construyes el producto, lo pones frente a la gente, es cuando entiendes lo que está pasando, pero es muy doloroso, especialmente la primera situación porque es cuando te dan un golpe en la cara. Eso es cuando fallas. Especialmente la primera vez. Estás construyendo algo que es nuevo, ¿verdad? Que tú crees que va a resolver todo y no lo hace, ¿verdad? Y eso está bien. Pero hasta que no estés allí, no vas a obtener la retroalimentación de nivel más alto. Y la segunda pregunta que quieres hacerte en el ciclo de vida de cualquier producto es, ¿qué tan rápido puedes llegar allí? Dibujar algo en papel, muy, muy rápido. Puedes hacerlo ahora mismo. Te lleva unos pocos segundos, minutos de tu tiempo, pero construir el producto es lo que más tiempo lleva. Así que si ponemos esto en perspectiva, ¿qué tan rápido y qué tan precisas son nuestras suposiciones dependiendo del ciclo de vida de cualquier producto? Sabes que el producto es lo que más tiempo lleva, pero también queremos llegar allí. Y si piensas en el tamaño de la empresa, el producto es lo que más tiempo lleva, especialmente si estás en una gran empresa. Y ese es un concepto muy importante para entender. Por eso la mayoría de las empresas, cuando son grandes, tienen dificultades para innovar algo nuevo. Si miras a Google en los últimos 10 años, apenas hemos visto productos innovadores. Sin embargo, han invertido miles de millones en IA. Y una pequeña empresa como OpenAI entra en juego y crea solo GPT. Piensa en eso. Esa es la principal razón por la cual los equipos pequeños pueden innovar mucho mejor que las grandes empresas. Sin embargo, tienen recursos mucho más limitados, un presupuesto mucho más limitado. Pero es un concepto muy interesante para que entiendas porque al final del día, así es como funciona el mundo.
5. Fusionando Diseñadores y Desarrolladores
Estamos en la última fase de innovación. Pero, ¿qué tal si en lugar de simplemente construir lo que los diseñadores nos entregan, fusionamos los mundos de los diseñadores y desarrolladores desde el principio? La parte más crítica es la mentalidad, venir con una mentalidad clara y abierta, como un niño, listo para aprender y experimentar. Al fusionarnos en la misma realidad con sistemas de componentes, como Figma y React, podemos crear sistemas reutilizables y centrarnos en construir la experiencia del usuario. Comenzando con un enfoque mínimo utilizando HTML5, podemos iterar y pulir a medida que avanzamos sin la necesidad de una biblioteca.
Entonces, ahora, nosotros, como desarrolladores, usualmente, la mayoría del tiempo, simplemente estamos construyendo el producto. Estamos en la última fase de innovation. Pero la innovation ocurre antes que nosotros, ¿verdad? Los diseñadores usualmente pasan por papel, wireframes, baja fidelidad. Dependiendo del tamaño de tu equipo, puedes pasar por todas estas diferentes fases. Pero luego, al final, simplemente estamos construyendo lo que los diseñadores nos entregan. Quiero cuestionar esta perspectiva. Y tengo una pregunta para ti. ¿Qué tal si en lugar de hacer eso, mezclamos estos dos mundos, los fusionamos de tal manera que los diseñadores y desarrolladores sean parte de esta fase de innovation desde el principio? La primera pregunta es ¿cómo? Y lo primero que necesitas entender es que la parte más importante es la mentalidad. No es el nivel de conocimiento que tienes, la experiencia que tienes. Es la mentalidad. Si vienes con una mentalidad muy clara, como un niño. Cuando digo un niño, es que quieres ir allí sin tener ningún tipo de ego. Nada que te diga, oh, yo sé esto mucho mejor que tú. Deja tu ego en la puerta. Solo intenta tener la mentalidad correcta porque eso es muy importante. Y quieres estar aprendiendo desde el principio. Incluso si has estado 20, 30 años en el espacio, quieres venir con una mentalidad muy clara y sin conocimientos, sin ego. Quiero decir, el conocimiento es muy importante. No me malinterpretes. Pero quieres llegar como una persona muy fresca allí tratando de entender qué está pasando, intentando aprender. Creo que cada experimento es un aprendizaje para ti. Así como los niños aprenden tan rápido porque no les importa, prueban muchas cosas. Eso es lo que también queremos aplicar con la misma mentalidad. Entonces, ¿cómo empezamos? Nosotros, como desarrolladores y diseñadores, en realidad nos estamos fusionando en la misma realidad cuando pensamos en sistemas de componentes. Los diseñadores usualmente usan Figma, los desarrolladores usamos React. Podemos transformar estos design systems en sistemas que funcionan muy bien y son reutilizables en ambos lados. De hecho, hay herramientas que permiten ir de Figma a React y viceversa, pero esta es una mentalidad muy interesante que quieres tener porque quieres reutilizar tanto como puedas para no gastar demasiado tiempo en construir los componentes. En realidad, estás construyendo la experiencia que quieres poner frente a los usuarios. Y con esta idea mía de iteraciones, quieres hacer una pequeña iteración, intentar llegar allí, y a medida que avanzas, estás puliendo cosas. Kind of start cuando tienes una idea con una forma muy mínima que es HTML5. Realmente no necesitas una biblioteca.
6. Beneficios de Usar React
Te animo a usar React por su reutilización de componentes. Construir en HTML puede ser rápido, pero a menudo resulta en una experiencia de usuario poco atractiva. Los usuarios ahora esperan mejores experiencias debido a su uso constante de herramientas digitales. La transición de HTML5 a bootstrap o material UI no es difícil.
Quiero decir, realmente te animo a usar React porque eso realmente implica la reutilización de componentes que pueden llevarte al siguiente nivel mucho más rápido. Por eso también te animo a usar otras bibliotecas, pero antes de saltar a eso, solo piensa en esto, construir algo en HTML, quiero decir, es muy rápido, pero también es algo muy feo. La gente realmente no pasa un buen rato, especialmente los usuarios en estos días. En estos días, los usuarios han elevado el listón al siguiente nivel. Esperan una experiencia de usuario mucho mejor que antes. Entonces, ahora, y la razón por la que lo hacen es porque usan herramientas digitales todo el tiempo. Están en sus teléfonos constantemente y eso realmente conduce a grandes experiencias de usuario. Entonces si les das algo que parece feo, lo van a rechazar desde el principio. Eso es algo a tener en cuenta, pero para que pases de los componentes HTML5 a bootstrap o material UI en realidad no es tan difícil. Solo necesitas crear, quiero decir, si nunca lo hiciste antes, tal vez te llevará un poco, pero no es tan difícil.
7. Capacidades del Modo Desarrollador de Figma
Las capacidades del modo desarrollador de Figma te permiten obtener componentes y herramientas para un desarrollo más rápido. Sin embargo, todavía no es la mejor solución. Figma está iterando e intentando crear algo innovador, pero aún no han llegado a una gran solución para todos.
También quiero compartir este concepto, algunos de ustedes ya lo saben, supongo que la mayoría de ustedes deberían saber que Figma tiene estas capacidades del modo desarrollador, que te permiten obtener componentes ya de Figma y tener ciertas herramientas que te llevan al siguiente nivel mucho más rápido. Sin embargo, tengo que decir que esto se lanzó hace unos meses. No soy el mayor fanático. Creo que la idea es genial, pero creo que todavía estamos lejos de ser los mejores o algo de lo que estoy muy orgulloso de usar. Así que tenlo en cuenta. Me encantaría saber qué piensas al respecto, pero esta es un área muy interesante. Y espero que Figma haga un mejor trabajo a medida que avanzamos. ¿Están iterando, verdad? Están intentando crear algo innovador y creo que están en camino, pero aún no han llegado a una gran solución para todos. Si estás interesado en construir design systems, tengo esta masterclass que he creado. Se llama Innovar con React. Solo toma un par de horas construir un sistema de componentes en un storybook que puedes empezar a usar. Si ni siquiera sabes mucho de React, esta es una excelente manera de aprender. Así que realmente te animo a echarle un vistazo si quieres construir un design system por tu cuenta. Si no lo has hecho. Si lo has hecho, probablemente no vayas a obtener mucho de ello, pero hay ciertas cosas que podrías encontrar interesantes. Solo toma un par de horas. Así que si tienes tiempo, hazlo. Y ahora estamos llegando a la parte más interesante de o las tecnologías más recientes que existen, que son las herramientas de IA, especialmente ChatGPT, GitHub Copilot. Quiero decir, un viaje medio para ilustraciones, visualizaciones y todo. Creo que esta es un área muy interesante. La mayoría de ustedes probablemente lo saben y lo han usado bastante desde el comienzo del año. Tengo que decir que esto ha cambiado drásticamente la forma en que desarrollamos cosas. Hoy en día, podemos ir mucho más rápido, creando cada producto diferente, incluso cosas que no podíamos hacer antes, incluso cosas que no estábamos muy contentos o entusiasmados porque no conocíamos la tecnología. Ahora con las herramientas de IA, podemos cerrar esa brecha y llegar allí más rápido que nunca. Estas herramientas de IA se sienten como tener un equipo que realmente te asiste en todo lo que necesitas, y tenemos que realmente necesitamos abrazar eso. Hay diferentes formas en las que puedes usar estas herramientas, y creo que cuanto más y más sepas sobre estas herramientas, realmente te hace más rápido y mejor, por eso realmente te animo, si estás interesado en esto, a que realmente uses tu teléfono y te sometas a la encuesta porque estoy armando una masterclass sobre esto. Realmente quiero compartir mi experiencia y los aprendizajes sobre el uso de herramientas de IA en React y estoy muy emocionado de hablar sobre este tema. Es por eso que tengo una pequeña encuesta donde quiero entender por qué y qué te hace cada vez más entusiasmado acerca de esta nueva realidad. En cualquier caso, quiero decir que este es un momento muy interesante. Creo que esta es la primera vez que Paul McReady puede innovar y superar a grandes empresas como Google, Microsoft, Apple. Tenemos tecnologías en estos días que cualquiera puede ser un innovador. No realmente necesitas tener un gran equipo o un gran presupuesto o realmente no necesitas nada de eso. Solo necesitas tener mucha curiosidad, la mentalidad correcta y empezar a usar estas herramientas de la manera más eficiente. De todos modos, ha sido un gran placer hablar contigo sobre esto. Me encantaría conectar con tú si estás interesado en este tema. Ahí tienes mi LinkedIn, así que siéntete libre de usar tu teléfono y espero que en algún momento pueda encontrarme con alguno de ustedes. De todos modos, muchas gracias y que tengas un buen día.
Comments