(00:00) Intro
(00:58) Presentando a Jaime
(07:20) Breve intro a TresJS
(11:20) WebGL
(13:20) ThreeJS y alternativas
(15:38) React Three Fiber
(17:50) Cientos
(21:04) Componentes de terceros en TresJS
(21:57) TresJS vs React Three Fiber vs Threevelte vs Angular
(23:35) Usos de 3d en el browser
(25:22) WebGPU
(29:00) 3d en el browser hoy
(31:04) WGSL
(33:44) ¿Cómo aprender de 3d? / Conceptos básicos
(39:28) Shaders
(41:44) Del uso de AI
(43:10) De las matemáticas en 3d
(47:38) Más conceptos de 3d
(48:55) ¿Necesito saber de Blender (o sus alternativas)?
(49:38) La verdadera recomendación
(51:50) Del Open Source
(55:15) Picks
(57:48) Shameless Self Plugs
Links:
Portfolio: jaimetorrealba.com
Laboratorio: lab.jaimetorrealba.com
Tres.js: tresjs.org
Threejs: threejs.org
Curso (en inglés): threejs-journey.com
Picks
Los libros recomendados
natureofcode.com & https://www.nngroup.com/books/design-everyday-things-revised/
¡Celebramos 75 episodios publicados ya!
Gracias a tí es que seguimos publicando 🫰
Te recordamos de nuestro patreon: patreon.com/mytypeofradio por si nos quieres echar una manita
Redes Sociales:
Patreon: https://www.patreon.com/cw/mytypeofradio
Bluesky: @mytypeof.dev
Twitter: @mytypeofradio
Facebook: My typeof Radio
Instagram: @mytypeofradio
YouTube: @mytypeofradio
Mastodon: @mytypeofradio@mastodon.online
Nuestra página web:
https://mytypeof.dev
Mándanos un correo:
hello@mytypeof.dev
[00:00:08] Estás escuchando My typeof Radio, un podcast de desarrollo web en español. Somos Axel Martínez, Arturo Mosqueda. Comenzamos.
[00:00:39] Buenos días, buenas tardes, buenas noches, bienvenida, bienvenido a esta nueva instancia de My Type of Radio. Mi nombre es Axel Martínez. Estoy muy contento de volver a grabar aquí una nueva instancia, un nuevo episodio para ti y contarte de esta, bueno, platicar más bien de una vez con Jaime, Jaime Torrealba, que es un experto en su área y que me encanta, me encanta poder platicar con las personas que sí le saben a sus diferentes áreas,
[00:01:08] porque, bueno, uno aprende muchísimo con ellos, ¿no? Y sin más, pues te damos la bienvenida, Jaime, bienvenido al podcast. Muchas gracias, muchas gracias. Un placer estar acá, muchas gracias. También conocido como Jaime, creo, por ahí. Me dicen Jaime, sí, todo el tiempo. Sí, sí. Andas tú en Europa, ¿verdad? Yo ando, yo vivo en UK, en Inglaterra, y acá no pronuncian la J como de J, así que todos me dicen Jaime. Y creen que está mal escrito porque Jaime se escribe diferente, no sé. Claro, claro, claro.
[00:01:38] Muy bien, muy bien. Pues eso, síguenos contando un poquito más de ti, ¿qué te parece? Y para que los demás te conozcan y ya van sabiendo de qué vamos a platicar. Ya, bueno, yo vengo a hablar, la verdad, del 3D, un poco como está el 3D en la web, que es un tema de, como dicen acá, es de un rabbit hole, que significa que es como, tiene tantas cosas, tanta profundidad, que tú puedes ir adentro, adentro, adentro, y seguir explorando cosas.
[00:02:04] Pero, bueno, vamos a tratar de mantenerlo como friendly para todos, ¿no? Como amigable. Venga, me late. Sí, sí, sí. Y, bueno, un poco más de mí, yo, como ya dije, vivo en Inglaterra, estoy acá desde hace algunos años, tengo la, voy a hacer como un resumen muy cortito. Venga. Yo, cuando estaba en el liceo, no sé si le dicen liceo igual en todos los países, pero es como high school. Ah, ok.
[00:02:29] Mi hermano estudió, yo estaba en un liceo que básicamente tenía como dos especialidades, uno era electricidad y otro era informática. Ok. Y mi hermano es mayor, él fue por electricidad y yo me fui por informática así como, porque no quería ser lo mismo que él. Y por pura suerte de la vida descubrí que eso me encantaba. Me encantaba como programar, como crear. Ya yo había creado juegos que sí en Warcraft 3, en Age of Empires, pero era como juego de niños.
[00:02:56] Y luego, claro, descubrí que la verdad es que me encantaba, así que lo estudié en la universidad, tengo mi diploma. En una universidad que no la voy a nombrar, pero no es tan buena, pero aún así terminé con mi diploma y bueno, eso ayuda en el currículum y todo. Claro, claro.
[00:03:12] Y luego pasaron cosas en mi vida, me fui a Italia a vivir, luego de Italia salté a Chile, en Chile llegué un poco, vamos a decirlo, entre comillas, como sin nada, no tenía computadora. Así que agarré cualquier trabajo por ahí de mesonero, varias cositas hice por ahí, hasta que poco a poco fui retomando mi camino por el desarrollo. Siempre desarrollo web, siempre en la web.
[00:03:42] Ajá, ah, bien, perfecto. Y resulta que de nuevo, por pura suerte de la vida, agarré y estaba ya trabajando como freelance, pero llegó la pandemia. Y resulta que cuando llegó la pandemia, pues, me disparé para arriba porque muchas empresas estaban buscando muy buenos sueldos. Y creo que una vez que tú entras como en una de estas grandes empresas, yo entré, la puedo nombrar, se llama Ripley, que en ese momento creo que todavía es uno de los e-commerce más grandes del, no sé si de Chile o de Latinoamérica, pero es muy grande.
[00:04:12] Ok, bien, bien. Y cuando tú entras como en ese entorno, ya tienes la suerte de que si te quieres cambiar o qué sí para Mercado Libre o qué sí, hay mucha competencia, ¿no? Pero si ya te quieres saltar a otra gran empresa, ya tienes como ese currículum, ¿no? Ya es como, ah, ya, este chamo trabajó en Ripley, así que debe ser muy bueno. Algo así como tipo esa es la mentalidad, ¿no? Sí, sí. Y bueno, ya ahí empecé como a poco a poco a saltar unos trabajos, hice unas cosas en Flutter, no sé cómo se dirá en español, Flutter.
[00:04:42] Ah, sí, Flutter. En Google. Hice un poco de backend, hice un poco de varias cositas, pero al final me dediqué por, siempre me gustó el diseño, así que me fui como más de Frontend. Ok. Y bueno, eso, después descubrí, empecé como un poco a poco usando Blender por puro hobby, totalmente hobby, como entendiendo los conceptos. Y luego descubrí un curso en inglés que se llama 3DS Journey, que es de Bruno Simon, un francés.
[00:05:13] Y la verdad que esa fue mi puerta al mundo 3D, esto fue como en 2021. Porque, bueno, básicamente este tipo creo que debe ser el mejor curso que he visto jamás. Es un curso demasiado bueno. Por algo como 100 dólares tienes algo totalmente estúpido, como 50 horas de contenido, ¿sabes? Es muchísimo y es muy bien explicado. Los conceptos básicos de todo para los novatos, ¿no?
[00:05:40] Y te abre un poco la mente para programar en 3D, sobre todo para programar en JavaScript, que es como lo que yo soy experto. Sobre que no es como ciencia de cohetes, ¿no? Como rocket science. Es como, no es imposible. Se puede hacer. Ok, ok. Y entonces cuando tú tienes como ese, como tienes como esa puerta de entrada, ya yo, por ejemplo, como lo decía, tu un rabbit hole. Yo ayer me fui por libros y me fui por, ¿sabes?
[00:06:08] Por consumiendo todo el contenido que podía. Orale. Y bueno, aquí estamos haciendo cositas 3D en mi compañía. Experiencia increíble. Y no, es un muy lindo hobby, la verdad que lo amo. Muy bien. Sí, algo que pues se refleja en tu trabajo, ¿no? Tienes tu como portafolio, tu página donde puedes, las personas pueden ir y vamos a dejar el link en las notas del show.
[00:06:36] Pero pueden ir a ver todos esos ejemplos que has estado haciendo, con los que has estado trabajando. Y sí noté por ahí que tenías alguno que otro ejemplo de libro, precisamente que decía como, ah, tomé esta parte del libro y la implementé yo. Con una herramienta también de la que vamos a platicar ahorita, pero buenísimo. Sí, esa parte también a mí me llamó mucho la atención de que pues también a la vez compartieras, ¿no? Todo lo que estabas pues creando y aprendiendo y eso pues aquí nos gusta mucho esa parte de compartir. Pues muchas gracias por eso. Muy bien. Sí, sí. Y después, bueno, para seguir hablando de eso.
[00:07:07] Que por cierto, el portafolio siempre está en construcción, nunca ha terminado. No sé si te lo pasa, pero siempre está así. Y bueno, siguiendo un poco con el tema, yo estaba trabajando mucho con 3DS, que es esta herramienta de la que vamos a hablar un poco quizá a profundidad más rato. Sí. Es un framework de trabajo para crear, es como un engine, no? Como un motor para crear, que te hace más fácil la experiencia para crear experiencias 3D en la web.
[00:07:34] Y yo estaba dándole, yo uso Vue, así que estaba dándole con Vue y Vanilla 3DS. Ok. Y en la comunidad de React hay algo que se llama React 3Fiber, que básicamente tiene muchas ventajas para construir experiencias 3D usando 3DS y React, ¿no? Pero no existía nada en la comunidad de Vue. De hecho, existía algo, pero era un proyecto prácticamente muerto. Entonces, como que no existía nada. Y por pura conciencia, encuentro, bueno, no, por pura conciencia no, quizás.
[00:08:04] Ya seguía a las personas indicadas en Twitter y todo este tema. Y encuentro un chamo que se llama Álvaro. Sí. Que él estaba empezando un proyecto justamente para cubrir este espacio. Ok. Y yo voy y le escribo como... Desde hace tiempo ya yo quería como contribuir bastante en el open source. Ya eso me llamaba mucho la atención, pero como que siempre hay una barrera tipo... No sé si perder tiempo acá haciendo un proyecto para que, ¿sabes? Un PR para que no lo prueben o no.
[00:08:33] Se me da como miedito como empezar con todo esto. Ajá, ajá. Ajá. Y de nuevo, mucha suerte porque le escribí a este chamo, a Álvaro. Ajá. Que estaba en un proyecto muy, muy, muy básico. Y me dice como, sí, sí, yo estoy buscando contribuidores, vente, únete. Nos unimos a un Discord y empezamos el proyecto. O sea, bueno. Yo me uní al proyecto y ahora soy core team member de la librería que se llama 3GS. Bien. Que básicamente facilita mucho cómo crear experiencias 3D usando el poder de Vue, la reactividad,
[00:09:03] ¿sabes? Como todo el tema de los props, todo esto. La componentización que es muy importante. Ok. Creando experiencias 3D con 3GS, básicamente. Así que así llegamos. Fue muy bueno porque aprendí muchísimo, ¿sabes? O sea, he codiado con personas de toda parte del mundo, con personas de Japón y todo. Que eso para mí era como, wow. O sea, yo revisándole el PR a un chico japonés que quién sabe quién es. Sí, sí, sí. Sí, lo bonito de la, claro, claro, de la open source.
[00:09:34] La verdad es que es muy bonito. Yo se lo recomendaría a todos. No solo mejoras tu código, la calidad de código, porque empiezas a escribir como código de calidad más mundial. Todo el mundo puede ver tu código, todo el mundo sabe si lo usa mucha gente. Y también la comunidad es muy bonita. Prácticamente diría que el 95% de las personas en el open source son muy amables. Quieres que contribuya. O sea, tienen muy buena energía. Casi todo el mundo siempre anda de buena energía.
[00:10:01] Por supuesto, siempre vas a encontrar algunos, no voy a decir la palabra, pero bueno. Personas difíciles. Las excepciones, ¿no? Y bueno, esperan que tu traje por gratis y les resuelva solo el problema a ellos porque ellos son los que vivían los que... El centro del mundo y todo, pero bueno. Claro, claro. Esto lleva abierto cuatro semanas, no lo puedo creer. Claro, claro. Hay unas cosas que son como... Oye, esto no funciona.
[00:10:30] Y tú así como, ya, pero ayúdame. ¿Por qué no funciona? ¿Por qué? ¿Qué pasó? Claro, la interproducción, algo. No funciona. Como, ok. Muy loco, muy loco. Muy bien, muy bien. Ok, ok. Entonces ya mencionaste un poquito de las tecnologías. Tenemos 3Js y en algún punto hubo, pues, se creó esta parte como abstraer algo en la capa de React. Y al mismo tiempo existe algo nuevo en Vue, que es a lo que eres el core member ahora.
[00:11:02] Y bueno, pues no sé qué tan abajo en las capas quieres que empecemos. O sí, y si lo hacemos desde Vue para abajo o así. La idea un poquito sería como platicarle a las personas que a lo mejor quieren entrarle, pero no saben cómo. Y a lo mejor empezar como de eso, ¿te parece? Ya, démosle. Mira, vamos a empezar con la capa más baja, que es la capa que se llama WebGL. Ok.
[00:11:28] Esta capa lo que básicamente permite es usar el poder del GPU, de la GPU, usando JavaScript. Es como, sí, usa diferentes lenguajes de programación en el navegador, que se llama GLSL. Ya lo vamos a hablar un poco más. Ajá. Y esta es la capa como básica, como lo más bajo que hay, lo más cerca que puedes usar en el navegador. Ok.
[00:11:51] Porque si no vamos como a lo nativo, como usando C++, hay otras cosas, pero no nos vamos a meter por allá. Vamos solo en el ambiente del navegador. Ok. Y WebGL es un poco viejo. Fue creado, si no me quedo como en el 2011, 2010. Y básicamente es una copia de OpenGL, que es este lenguaje, que no es un lenguaje, es una API que se usa para la GPU. Ok.
[00:12:19] El problema de WebGL es que es muy difícil de trabajar lo nativo. Es muy difícil porque tienes que tener una mentalidad que normalmente no tienen los desarrolladores de JavaScript. Porque tienes que empezar a pensar cómo funciona la GPU, hacer todos los bounds, que en este momento no me acuerdo cómo se llama en español, pero son como los vínculos. Ok. Los puedo ofrecer un poco de muchos temas que es extremadamente intimidante.
[00:12:46] Y todo esto, sin decirte mentira, en WebGL el ejemplo clásico de un triángulo usando la GPU deben ser como 100 líneas de código. De muchas cosas que no son normales para un desarrollador de la web. Ok. Y entonces tienes 3DS a abstraernos esa capa y básicamente te hace la vía increíblemente mucho más fácil. Normalmente yo siempre soy más de entender la base primero y después saltar, pero en este caso me la salté.
[00:13:15] La verdad es que no quise hacer WebGL directo y me fui directo por 3DS. Entonces 3DS es esta librería maravillosa que ya tiene un montón de abstracciones hechas por ti. Sabes, ya viene con abstracciones como las luces, las cámaras, los primitivos, que son las esferas, los triángulos. Y un montón, un montón. La verdad es que tiene, yo no sé cuántas clases, pero tiene demasiadas abstracciones hechas para ti. Ok.
[00:13:44] Y lo mantiene lo suficientemente low level como para que sea, perdón, lo suficientemente flexible para que sea como la analogía quizá algo similar. Sería como una pieza de Lego, tú vas poco a poco construyendo las cosas y puedes modificar lo que veas. Y hay otras librerías que compiten con 3DS, vamos a decir compiten, en realidad no compiten, no, todo es open source.
[00:14:08] No es que compiten, pero digamos que atacan el mismo problema de manera similar, como Play Canvas y Babylon, que son creo que las dos más famosas. Ellas también son un motor de renderizado 3D. Ok, ok. Pero, por ejemplo, en el caso de Babylon es más como un motor ya completamente armado, que te da un poco menos de flexibilidad,
[00:14:33] porque ya es como, ya tiene un editor completo en el browser y es como más experiencia para crear juegos, ya más, más GU y todo el tema, ¿no? Y lo mismo con Play Canvas, que es muy similar, pero está muy enfocado a los juegos. Entonces yo me fui por 3DS, que además de todo esto, tiene la comunidad más grande, tiene muchos más videos, tiene todo este tema, ¿no? Ok, ok.
[00:14:56] Y bueno, también elegí, creo que vale la pena mencionar, elegí 3DS porque encontré este curso de este chico Bruno Simón. Sí. Es 3DS Journey, justamente en el nombre lo dice. Y es un curso de nuevo maravilloso, entonces me fui por ahí, ¿no? Ok. Y para cualquier persona que esté escuchando por acá, si quiere empezar con este mundo del 3D y saben un poco de inglés, les recomendaría este curso que se llama 3DS Journey, que de verdad es muy bueno, son muchísimas horas de contenido por algo así como 100 dólares. Bien, entonces.
[00:15:26] Es, es, es, lo recomiendo demasiado, ¿no? Es muy bueno. Muy bien, muy bien. Y si usan tu cupo, no, no es cierto. Muy bien. Pero, pero claro, esos son como el nivel de las capas. Luego de que tenemos esta segunda capa que es como 3DS, la abstracción de WebGL, viene, se añadió una capa más, ¿no? Las personas empezaron a añadir otra capa que se, la empezó React Reactive Fiber,
[00:15:54] que es una capa que te permite usar 3DS con todo el poder de React, ¿no? Que es como, de nuevo, la componentización, que significa dividir tu lógica como en componentes, todo el tema de la reactividad, los props, muchas, muchas otras ventajas, ¿no? Como la forma de construir la UI, todo este tema. Entonces, de React Reactive Fiber, que fue como la inicial, empezaron a nacer otros clones en las otras librerías de Fronten.
[00:16:24] Ahora yo estoy con 3DS, que es la de, que es el equivalente de React Reactive Fiber en Vue. Para Vue. Y hay una también en Trivelte, hay Angular 3, si no me equivoco. All right. Y deben haber otras por ahí. Pero básicamente todas siguen como la misma idea, que es tomar tu framework favorito, crear tu experiencia con TriDS, hacer la vida más fácil, digamos,
[00:16:46] y dividir la lógica, hacer la reactividad, los componentes, muchas cosas, muchas abstracciones que no se pueden hacer directamente en TriDS, se pueden hacer en estas librerías, ¿no? En otros Fronten Framework para React Reactive. Vamos a hacerlo así, vamos a decirlo así. Sí. O sea, tomas cosas que a lo mejor serían repetitivas, cosas que puedes reutilizar,
[00:17:14] algo que te tomaría mucho como boilerplate para crear unas cosas que son más o menos útiles en muchos lugares y esas se las pones a una librería como 3DS, por ejemplo, y de ahí vas tomando los cachitos que te sirven, algo así. Exactamente. Y lo dijiste muy bien porque uno de los temas de TriDS es que tiene mucho boilerplate, ¿no? Para crear la escena siempre tienes que repetir lo mismo como repetir la misma cámara, repetir la misma creación de la escena, del motor, todo este tema, ¿no?
[00:17:41] Entonces con esta librería te lo hacen en muchas, muchas menos líneas de código. Ya. Y como tú dices, un ejemplo que podría mencionar a la audiencia sería, por ejemplo, nosotros tenemos varios, ¿no? Hay una librería que se llama Cientos, que es para ayudarte a crear escenas con 3DS. Yo trabajo mayormente en Cientos y en el motor de física. Y Cientos es una librería prácticamente de puras abstracciones.
[00:18:09] Y para darle un ejemplo así como muy, muy, muy, muy básico, hay un componente que se llama Stars, que se llama Estrellas, y básicamente son partículas, son como pequeños puntitos en tu escena 3DS, de partículas que son muy configurables y pueden girar y pueden, ¿sabes?, ponerle las texturas que tú quieras, los colores, todo el tema. Pero la idea es que tú tienes este componente que es como solamente lo copias y lo pegas y ya funciona.
[00:18:36] Y lo que hace es distribuir las partículas como en una esfera, una esfera gigante. Y esto crea el efecto de una noche estrellada. Ese es como lo más básico. El problema sería que no es tan realístico hacer este componente en 3DS, porque en realidad tendrías que... O sea, se puede hacer, de hecho, la gente lo hace todo el tiempo. Pero hacerlo como un componente aparte en 3DS no es tan realístico, no es tan útil.
[00:19:04] Entonces para eso damos nosotros como una capa de abstracción extra. Ah, ok, ok. Es como muy, muy, muy sencillo. No hay muchísimas otras abstracciones, pero eso es como muy sencillo. Sí, los usos, ¿no? Y como donde tendría sentido hacerlo con, digamos, cientos en vez de directamente con 3. Y entiendo pues que para también dejar como 3 sea hasta cierto punto contenido en un cierto, no sé, peso tal vez, porque tal vez no necesites todo lo demás y bueno, ya luego te lo vas trayendo y cosas así.
[00:19:33] Exactamente, exactamente, exactamente. Claro, tenemos la facilidad del tree shaking. Ok. Que no sé, sí, vamos a decirle tree shaking todos, creo que deberíamos conocer el tree shaking. Sí, sí. Y que en cientos te lo hacemos como básicamente, más fácil, ¿no? Tú solo usas los componentes, el código que tú necesitas y todas las dependencias, pero eso es como la idea. Ok, ok. ¿Y cómo van decidiendo justamente esto? O sea, ¿cómo decir?
[00:19:56] Ah, esto, o sea, esto sí se va, sí tiene sentido que se reutilice mucho y lo podemos mandar a cientos. O esto lo dejamos en 3, o esto ni siquiera vale la pena, por ejemplo, me imagino, ¿no? Debe haber ganado. ¿Qué tal? Interrumpiendo un poquito aquí, muchas gracias por llegar hasta aquí en este episodio, en esta instancia,
[00:20:20] Pero tenía muchas ganas de contarte que estamos celebrando nuestros 75 episodios. Ya tenemos 75 episodios en el podcast y estamos muy contentos de poder seguir platicando contigo y contándote cosas interesantísimas acerca del webdeb, trayendo a personas, pues, que sí le saben, ¿no? Y, bueno, nada más eso, agradecerte mucho, mucho por estar aquí con nosotros y por compartir los episodios, por compartir las instancias, a quien más confianza le tengas.
[00:20:49] No te olvides, por favor, que tenemos abierto ya un Patreon para que puedas por ahí, pues, regalarnos un cafecito, aunque yo no tomo, o una cerveza, que tampoco lo hago. Pero, bueno, esto nos ayuda muchísimo, por ejemplo, para el hosting y también para, pues, pagar otros servicios, ¿no? Que estamos utilizando para la creación de este contenido, que te traemos, pues, con mucho cariño y con también mucho trabajo.
[00:21:15] Patreon.com, diagonal, mytypeofradio, todo junto, igual que todos nuestros demás handles en las redes sociales. Sin más, pues, gracias otra vez y felicidades al podcast, felicidades a ti por escucharnos, gracias por estar ahí y, bueno, te dejo que sigas con el episodio.
[00:21:39] Bueno, yo soy ahorita el líder de cientos, básicamente, y entre comillas, yo soy el que, vamos a hacer entre comillas, yo soy el que decide quién va y quién no, pero es como la teoría, pero en la práctica no es tan así, en la práctica lo discutimos todos en el grupo con los mantenedores, vemos qué va, qué no. Copiamos muchas cosas de React y Fiverr, que son, ya son como componentes ya testeados, que ya sabemos que la gente usa, entonces, básicamente, los adaptamos a Vue. Ah, ok, ok.
[00:22:08] Por supuesto, poniendo todo el copyright y todo el tema, que todo es open source, pero igual hay que darle, hay que darle. La licencia y todo, sí. Exacto, exacto. Y eso, y algunos componentes que tenemos que, por ejemplo, aparte de 3DS, hay otra, no le puedo decir capa de extracción,
[00:22:30] pero otra, hay muchos componentes que la gente crea, como third parties, y crea, por ejemplo, alguien creó un, no sé, un first person shooter controls, no sé, ¿no?, como para que te pongas un nuevo origen, algo así, alguien lo creó. Entonces, lo que nosotros podemos hacer es decir, ah, bueno, ok, en lugar de que esta persona tenga que copiar ese third party que está para 3DS,
[00:22:55] y, ah, perdón, para 3DS, y instalarlo, y hacer todas las modificaciones en vainilla 3DS, lo que nosotros podemos hacer es ser como el middleman, y decir, ah, bueno, ese hombre está muy bueno, entonces lo agarramos para Vue, para 3, y luego las personas básicamente lo importan como un drag and drop, ¿no?, lo pueden importar y pegar. Eso también se hace bastante. Ah, ya. Oye, qué bueno. Es muy interesante esa parte.
[00:23:21] Y justamente me estaba llamando la atención lo de si nació como para React y eso, y, bueno, sabemos que el ecosistema de React es gigantesco, hay muchísimas personas, y, bueno, también imagino que toda esa parte del React Refiber es muy madura, luego también mencionabas a la vez como los otros, digamos, equivalentes, ¿no?, de Svelte y de Angular, ¿cuál dirías tú que es como este nivel de madurez de 3DS en cuanto, no sé, con respecto a React y a los demás?
[00:23:49] No, o sea, sin lugar a dudas, la de React es la más grande, es gigantesca la de React, es una comunidad completamente abominable, tiene demasiados paquetes, hay mucha gente contribuyendo, hay mucha, mucha gente contribuyendo. Y, de nuevo, ya sabemos, uno de los patrones que nosotros hacemos es basarnos en lo que React ya ha testeado y aprobarlo para no reinventar la rueda, ¿no? Entonces, como que, no sé, queremos hacer un nuevo control que haga X,
[00:24:18] una de las primeras cosas que hacemos es, ok, lo tiene React, veamos cómo lo implementan ellos para saber si nos sirve, si no. Creo, mira, yo, quizás esto suene muy vanidoso, creo que Vue es la segunda comunidad más grande que hay, y después vendría, pondría yo a Tribelt, que es la de Spelten, y después otra Angular, ¿no? All right. Angular. No desconozco si hay otras como Front and Framework que hagan lo mismo para otras librerías,
[00:24:47] la verdad es que lo desconozco, pero diría que ese es como el orden, pero no confíenme, en mi 100% puede que esté equivocado. Hay mucho más. Investigar un poco, sí, claro, obviamente, obviamente, qué bien, qué bien. Órale, órale. Y, bueno, esto, creo que también habría una pregunta que a lo mejor podría ser el elefante en la habitación,
[00:25:12] y, no sé, escuchamos, mientras avanzamos en el tema, yo pienso que a la gente se le ocurre pensar, bueno, y esto no será como solamente para hacer algo muy específico, algo, no sé, en una página web que sea muy bonita, un landing page, pero yo creo que está teniendo como un impulso muy grande, sobre todo porque, bueno, ahora tenemos que decirlo, ¿no?
[00:25:37] Con la entrada de la AI y todo, que te lo facilita y no sé qué, bueno, pues ahora están apareciendo muchas cosas más, ¿no? Además de solamente los landing pages bonitos y cosas. Entonces, ¿cuál dirías tú que es como el momento que está teniendo esta parte del 3D en el browser ahora? Bueno, vamos por partes porque hay bastante que hablar. Bien, bien.
[00:26:01] Para comenzar diría que las primeras experiencias que nosotros creamos con WebGL eran un poco más básicas, ¿no? Eran como landing page, muy creativos, que si partículas moviéndose, que si modelos en 3D. Por ejemplo, si tenía, vamos a poner un ejemplo muy tonto, tu empresa vende una bicicleta y de poner tu bicicleta en 3D, que la gente la pueda ver, mirar, ¿sabes? Como un configurator. Ah, qué, qué, qué, qué.
[00:26:29] Atrae mucho, ¿verdad? Atrae muchas personas, es como visible. Hay experiencias que tú las ves y dices, no sé qué hace esta empresa, pero me encanta la página. ¿Sabes? Punto de referencia ya. Y de nuevo, hay experiencias que tú las ves y son increíbles. Sí, sí, sí. Y todo esto fue con WebGL. Ahora, hace unos años, para venir un poco más atrás, se introdujo lo que se llama WebGPU,
[00:26:54] que es como una nueva API que conecta con la GPU, que es un poco más fácil que WebGL para ser nativo, pero igual no tienes que preocuparte, porque ya 3DS la maneja. Right. Así que no hay mucho que preocuparse. Si ya sabes 3DS, ya prácticamente ya sabes WebGPU también. Ok. Y bueno, esta nueva API está basada en Vulkan, no en OpenGL, que Vulkan es, de nuevo, una nueva, vamos a decirlo nueva entre comillas,
[00:27:24] porque creo que ya tiene como 7 años por ahí. Pero Vulkan es otra API más low level, más al core del kernel. Y para resumirlo mucho, te da mucho más performance, es mejor para el rendimiento. Entonces ya te permite crear en la web muchas más cosas que no eran tan posibles en WebGL. Ok. No sé si me estoy cumpliendo mucho, avísame si me estoy dando mucho por la jerga. Entonces, ¿a qué quiero llegar con todo esto?
[00:27:56] El problema, vamos a decirlo así, uno de los problemas que tenemos al crear esta experiencia en 3D en la web, es que el usuario siempre tiene que tener dos cosas pendientes. Una es cuánta data descarga. O sea, no podemos poner un modelo 3D increíble, pero que pesa 100 megas, porque la persona a veces va a quedar esperando sus buenos segundos, inclusive con una internet muy rápida. Y lo otro es el personal, el rendimiento que tenga tu dispositivo.
[00:28:26] Por ejemplo, si tienes un teléfono, a menos que sea yo creo que el último iPhone, o no sé, los teléfonos más increíbles, un teléfono normal no va a tener la misma capacidad que tu computadora. Entonces, esas son cosas que cuando programas como en, para una plataforma como por ejemplo PlayStation, no tienes que preocuparte porque ya tiene como los specs bien definidos. Esto es una máquina poderosa, tal, tal, tal, tal. O cuando programas un juego AAA, ya tú sabes que, bueno, estos son los requerimientos mínimos.
[00:28:56] Si tú quieres correr en tu computadora vieja, es a tu riesgo. Claro, claro. Nosotros cuando programas en la web 3D no podíamos hacer eso, estábamos mucho más contenido. Ahora con Web GPU se mejora muchísimo, tenemos un boost de performance, que nos permite ahora crear básicamente experiencias más complejas, juegos completos en la web, e-commerce, ¿cómo es? Producto configurator, configuradores de producto,
[00:29:25] que básicamente tú vas a armar tu cosa, hacer cosas en VR, realidad virtual. Todo esto ya lo libera mucho más Web GPU. Web GPU fue introducido, creo que hace como 5 años, no sé, creo que 4 años, ahí revisamos los datos. Pero de hecho todavía está en constante desarrollo. Y para referencia, por si alguien también está un poco interesado, Web GPU no usa Vulkan, sino que creo que está basado en Vulkan,
[00:29:55] así que no es Vulkan. Y básicamente es como una nueva API completamente, que tiene como su propio lenguaje, tiene su propia forma de trabajar. Y con Web GPU tú puedes desarrollar experiencias nativas también. O sea, tú con Web GPU puedes literalmente usar C++ y crear tu juego con Web GPU. Y no necesariamente tiene que ser en la web. Muy contrario a lo que su nombre confuso le dice. Indicaría, ¿no? Le dice Web GPU y piensa que es solo en la web. Pero no, en realidad no, no es tan así.
[00:30:24] Entonces, ese es uno de los temas, ¿no? Ya el boom de las páginas 3D, creo que está muy alto ahora. Creo que la librería de 3DS está on fire, algo así como... Hay que ver los gráficos en NPM, para no decir cualquier número al azar. Pero está muy, muy alto. O sea, hay mucha gente, mucha gente descargándola, mucha gente usándola. Y el siguiente tema, como lo mencionas, es el AI.
[00:30:53] Que está siendo bastante usado para crear juegos tontos. No, bueno, no. Qué feo. Juegos en la web, experiencia 3D y todo el tema. Y todo esto en la web. Porque, de nuevo, la comunidad de JavaScript es gigantesca. No nos metamos con React ni ningún Vue ni nada. O sea, las personas que saben JavaScript son muchísimas. Yo diría que muchas, muchas más que cualquier otro lenguaje. Entonces, si les dicen, mira, ¿sabes qué? Puedes crear tu juego acá con un lenguaje que tú conoces.
[00:31:23] Las personas lo van a hacer. Y si más encima le dices que todas estas AI probablemente están... Como tienen más contenido en JavaScript, codean mejor en JavaScript, básicamente es un tiro ganador, ¿no? Es como... De RISE. Es muy boom. Entonces, no sé si ahora... Ahora la verdad es que están subiendo... Yo sigo mucha gente en Twitter de todos estos temas y están subiendo muchos, muchos demos,
[00:31:52] muchas cosas increíbles que están haciendo en 3D. Antes era mucho más difícil. Antes tú veías una página y eras como, wow, 500... No, no. Encuentra desarrolladores, ¿sabes? Diseñadores. Ahora es como... Un prom ya es como relativamente decente. No estoy diciendo que el AI va a reemplazar a los desarrolladores. No, no, no, no. Solo digo que se hace un poco más fácil. Claro. Sí, y por lo menos te da la idea, ¿no? Que como herramienta eso vale la pena. Y bueno, ya luego el expertise
[00:32:21] de todas las funciones que cada uno tiene, pues el desarrollador, el diseñador, el... Exacto. Quién pone el audio, quién pone así, todo. Exactamente. Exactamente. Exactamente. Muy bien. Y ahora, para mencionar una última cosa, perdón, solo para mencionar. Yo había mencionado al principio que WebGL usa un lenguaje diferente a JavaScript, ¿no? Y este lenguaje es el que se ejecuta en la GPU. Sí. Que tiene otro modelo de pensamiento porque JavaScript es...
[00:32:51] Trabaja en la CPU. Es un poco más de... No voy a decir single thread, que es un solo procesador. Pero la arquitectura de la GPU es bastante diferente. No se supone que está hecha para... Si no me equivoco, se llama SIMT, que es Single Instruction Multiple Threads. Ok. Lo podemos corregir después, pero básicamente se cumple bien. Tú mandas como algo
[00:33:18] y vamos a suponer que es un... Que podemos hacer un gradiente de colores. Ok. Entonces la GPU lo que va a hacer es agarrar todos los píxeles y lo va a hacer... Vamos a decirlo entre comillas de manera como simultánea. Si fuera con la GPU, tú lo vas haciendo como por línea, ¿no? Ah, ok. Eso es lo que es el poder de la GPU. Y este lenguaje no es en JavaScript y es un poco más cercano a lo que sería C. Es como la misma sintaxis que tiene C.
[00:33:48] Y Whistle, que es el lenguaje de WebGPU, sigue la misma idea. Un lenguaje como de C. Básicamente eso, para programar en WebGPU. Y el AI te hace mucho más fácil codear en este lenguaje. Sin lugar a dudas, es más complicado. Hay mucha matemática, hay... Perdón que lo repite tanto, pero es otro modelo de pensamiento porque ya no vas a... Ya no vas a pensar en if-else,
[00:34:18] sino que todo se ejecuta de manera simultánea en muchos, muchos, muchos mini procesadores. Entonces, como el AI está ahora muy en juego, te hace como esta experiencia más... Te hace este código más fácil, Que muchos desarrolladores de JavaScript le tienen como miedo a programar directamente en JLC, en WebGPU, en Whistle. Ok, ok, ok. ¡Uf! Muy interesante. Sí, sí,
[00:34:48] bastante información. Pero es bueno, es bueno te digo que tengamos aquí al experto porque así por lo menos empezamos a escuchar como los conceptos, las ideas, y bueno, ya si alguien tiene más ganas de seguir aprendiendo algo en particular, pues por ahí vamos a... Ahí después te veo mis contactos por si alguien quiere contactarme. Ah, perfecto. Sí, sí, sí. Lo dejamos en las notas del show. Y... Ok. Entonces, bueno, regresando un poquito a lo mejor ahora sí a los conceptos, digamos,
[00:35:18] un poco más... Ya, no sé, a lo mejor hasta de 3-3 y cosas. Si estoy aprendiendo algo nuevo, por ejemplo, y quiero hacer algo con 3D, pero no tengo idea de dónde empezar, a lo mejor hablar, no sé si de herramientas, de cosas específicas, pero ¿qué te parece algo así? Sí, démosle. Ok, bueno, básicamente tú ahora le puedes pedir al AI que haga todo, pero yo siempre recomiendo como aprende
[00:35:48] los fundamentos, aprende bien lo que vas a hacer, quizás algún nombre o una técnica en graphic programming, que esto es lo que nosotros hacemos acá, que se llama graphic programming, no es web programming. Ya. Que no es lo mismo de la misma técnica de los juegos y todo, es un mundo completamente aparte. Yo ahora me la paso mucho viendo papers. Hay una conferencia que se llama Seagraph, por ejemplo, hay literalmente researchers,
[00:36:18] investigadores, ¿sabes? Creando papers, creando más técnicas para hacer más fácil todo este tema, cómo renderizar más la vida, el agua y cosas muy locos. Entonces, volviendo a lo básico, perdón, yo me voy por la tangente. Volviendo a lo básico, prácticamente todas las experiencias de todos estos engines que te acabo de decir, estos motores, se constan de una cámara, ¿cierto? al menos un objeto para que puedas ver algo si no todo fuera negro.
[00:36:48] Claro. Un motor de renderizado, que en este caso viene siendo Babylon o 3DS o Play Canvas o lo que sea. Ok. Y algo que se llama el render loop, ¿no? El render loop es más conocido por el nombre de frames per second, que es una función que se va a ejecutar cada frame per second. Si tú tienes una computadora normal, perdón, lo normal sería como 60 frames per second
[00:37:18] en tu computadora. Sí. Hay algunas que corren 120, si tienes un dispositivo ya más o menos bajo, eso va variando, pero normalmente 60. Ok. Lo que significa que toda tu lógica va a ir ahí. Entonces tú teclas tu cámara, pones al menos un objeto, vamos a simular un cuadrado de manera 3D en frente de la cámara. Ajá. Lo renderizas con el motor de renderizado, que en este caso vamos a hablar de 3DS,
[00:37:48] y luego ejecutas esa misma escena múltiples veces en cada frame per second. Ah, ok. Entonces esto hace si por ejemplo le indicamos a nuestro cubo que gire sobre su propio eje, lo que va a hacer el render loop va a tomar estos 3 objetos, la cámara, el objeto y el renderizado y renderizar una escena cada frame per second. Lo que hace una simulación de una animación que es como los sprites. No sé si saben
[00:38:18] lo que es los sprites, que es como esta técnica antigua que ponía un bonequito que se movía así y luego iba así como muy, muy... No, pero claro, si lo hace evidentemente fluido se ve hay movimientos, ¿no? Ajá. Exacto, se ve la ilusión de movimiento sin problemas, ¿no? Eso es como lo más básico. Y después ya vienen cosas como los diferentes tipos de cámara, los materiales, que es lo que crea la ilusión del realismo, ¿no?
[00:38:48] Vienen muchas cosas como el performance de como la instant smash que es como renderizar muchos objetos en un solo patch, vamos a decir así, en un solo draw call que, bueno, para no entrar mucho en temas tan técnicos te ayuda mucho con el perfume. No tienes que renderizar cada objeto todo separado sino que, pum, los renderizas todo en un solo golpe. Órale. Y ahí vienen muchas técnicas como crear humo, crear agua, ya depende mucho
[00:39:18] de lo que tú vayas creando. El tema de los materiales sí creo que vale la pena tocar un poco más que es para crear los objetos que nosotros en este mundo le decimos mesh, pero que en español es maya, se consta de dos cosas que una es la geometría y una son los materiales. La geometría es un conjunto de vértices que son básicamente puntos en tu espacio 3D conectados por líneas edges
[00:39:48] y cada línea va a formar un triángulo. ¿Por qué triángulo? Porque las GPU aman los triángulos. Están diseñadas para renderizar el triángulo. Nosotros amamos los triángulos. Ya. Entonces, esas son las geometrías y con eso construimos modelos 3D, con eso construimos esferas, con eso construimos prácticamente cualquier cosa. Ok. Y luego vienen los materiales que es como una analogía buena sería la piel. ¿Cómo reacciona este material a ciertas
[00:40:19] influencias externas? La más normal sería la luz. ¿Cómo reacciona mi material a la luz? Por ejemplo, ¿es mi material metálico? Reacciona de una manera. ¿Es mi material por ejemplo no sé un tronco de un árbol? Reacciona de otra manera. ¿Es mi material en un espejo? ¿Es mi material translúcido? ¿Puedo ver a través de él? ¿De forma la luz? Todo eso lo manejan los materiales. Entonces, eso creo que vale la pena mucho que se dedique.
[00:40:48] La parte también para llegar a no llegando muy a lo técnico, pero los shaders que son lo que se programa en estos lenguajes GLC GLC el Wizzle que no es JavaScript afectan a los materiales y la geometría. Nosotros tenemos básicamente dos shaders que son el vertex shader y el fragment shader. El vertex como su nombre lo indica básicamente
[00:41:18] controla los puntos de la geometría. Y el fragment shader que no tengo idea por qué tiene ese nombre le controla básicamente los pixels de la geometría. Entonces con eso básicamente podemos hacer literalmente lo que nosotros deseemos con los materiales la piel o con la geometría. Ok. Ok. Entonces habría que aprender un poquito de esta parte de los
[00:41:47] shaders cuando queremos interactuar entre la geometría y los materiales. Claro. Por ejemplo si estás empezando en este mundo lo mejor sería no entrar directo en los shaders porque es de lo más complicado que hay en este mundo. Y Yatri te abstrae mucho esto. Yatri tiene para decirlo en un lenguaje común Yatri tiene abstracciones para crear espejos o que reaccionen a la luz de cierta forma. Incluso tienen cosas como
[00:42:18] no me acuerdo exactamente el nombre pero es como para que sea como anime el estilo de los anime que son como Stalize no me acuerdo como se llama pero obviamente no es realístico fotorrealista pero tiene su estilo yatri tiene abstracciones para eso tiene abstracciones para sombras tiene abstracciones para muchas cosas que por eso que amamos Yatri porque nos abstrae todas estas cosas y no tuviéramos que hacer todo esto de manera nativa con YSL manual
[00:42:48] y todo ¿no? incluso incluso con la ayuda de la AI y todo pero tendrías de todos modos que saber qué es lo que le estás pidiendo y encima tomar el tiempo para hacerlo en vez de pues traer la abstracción y usarla para lo que lo necesitas exactamente y y claro y justamente lo que tú dices no lo importante por ejemplo en este caso es al menos esto es muy personal pero al menos a mí no me siento tan cómodo vibe codeando ok yo yo ahora
[00:43:17] prácticamente uso el AI no sé cómo estará el mundo ahora pero yo prácticamente uso el AI y yo creo que el 90% del tiempo son prompts y reviso los prompts no claro esa es la idea como reviso qué es lo que está escribiendo reviso cómo se puede mejorar muchos tweaks muchas ya pero así como de de hacer un prompt y siguiente prompt y así en el navegador funciona como que eso no va mucho conmigo y sobre todo la parte del 3D que tienes que estar pero demasiado pendiente con el rendimiento
[00:43:46] vale mucho la pena echarle doble ojo a saber lo que estás haciendo no es lo mismo decirle voy a decir cualquier tonter acá pero no es lo mismo decirle quiero no sé un quiero agua y el AI va a hacer cualquier cosa a que tú le digas no mira quiero usar este paper que usa sign function con no sé qué con no sé qué entonces ya hay uno más es mucho más preciso y ya más o menos
[00:44:16] sabe lo que esperar exactamente sí ese ese enfoque me gusta de decirle exactamente lo que estás buscando pero sabiendo tú que es de lo que se trata antes de que antes de que tengas una salida y como dices verificar la salida y revisar cómo se ve el código qué está haciendo especialmente por esto que hablas del performance es importante muy bien ok ok ok entonces bueno yo ya sé yo ya sé view
[00:44:45] y entiendo que existe esta abstracción y ahora puedo hacer cosas en 3D necesitaría saber por lo menos un poquito de lo que hablabas antes del GSL GS ¿cómo se llama? GSL GSL y de el otro lenguaje GSL sería GL G uh me computí ya GLSL GLSL ajá eh mira para si tú
[00:45:16] sabes view yo de nuevo te recomendaría mucho que a menos que quieras algo muy específico no entres con los shaders como que no trata de dejar esa parte hasta que ya te sientas mucho más en confianza creando estas experiencias en realidad ahora puedes avanzar bastante podría decir que quizás puedes crear juegos enteros sin usar GLSL alright eh o whistle que es el de webview el nuevo eh cuando ya te topes con el tema de que necesitas algo como específico
[00:45:46] y ahora no se me ve ningún ejemplo en la mente pero que necesitas algo muy específico ah bueno acá tengo uno muy simple yo quería crear un un efecto de agua si pero no quería eh invertir en todo lo que todo lo que sería realista en agua realista entonces yo dije ok bueno que es lo más básico que puedo crear puedo crear un espejo que refleja un poco y puedo crear yo en mi en mi ejemplo yo quería crear algo así
[00:46:16] como una cascada que sea como algo que esté cayendo y generar las ondas del agua ya entonces para esas ondas para mover ese esa onda desde un punto del medio y crear ese efecto de onda como si estuvieras tirando una una piedrita en un estanque si yo básicamente hice fake que nosotros hacemos mucho fake fingir el todo el el tema y ese efecto lo hace con con con glsl porque no va obviamente el trige no va a tener algo tan tan tan específico
[00:46:46] lo que hace como ok vamos a agarrar todos los vértices y lo vamos a mover de una manera usando una sine function una función de seno seno coseno y de una forma que empiece en el medio y todo el tema entonces ahí va creando como poco a poco ese efecto lo suficientemente realista para mi caso de uso que si ya quieres algo muy específico tienes que invertirle más tiempo algo que mencionar que a mi me encanta en lo personal
[00:47:15] yo estoy seguro que no es para todos ok es que en en computer graphics es me encanta esto lo lo escuché una vez de alguien pero no me acuerdo quién solo lo escuché vas a usar toda esa matemática que aprendiste en el colegio que nunca supiste para qué se usa ah ok eso a mi me encanta porque cuando empecé a entrar en este mundo sobre todo con los GLS perdón sobre todo con los shaders que hay mucha matemática y todo tú empiezas a entenderte
[00:47:46] por la trigonometría por ejemplo como hacer interpolation entre los triángulos como encontrar cualquier punto en un triángulo para qué sirven las integrales que a todo el mundo me asusta y si tú me pones en un papel yo no puedo hacer de un integral no puedo pero al menos ya tengo en mi mente como cuando debería usar un integral y decirle la leía y claro decirle ah bueno esas son las integrales la derivativa básicamente como el flujo de cambio entonces todo ese tema de cálculo
[00:48:16] algebral uy alineal sí lineal algebral lineal que uno aprendió en la universidad en el colegio que nunca usaste o nunca sabías para qué se usaba acá es como una de las partes que lo aplica y eso me encanta ah muy bien pero eso lo tengo que saber o sí o sí o sea puedo meterme tanto como yo quiera ¿no? entiendo como que esa es la idea pero no es el requerimiento como para empezar a hacer algo sí exactamente
[00:48:45] no es el requerimiento yo creo que para empezar sirve mucho este concepto de las cámaras del como entender cuando usar una cámara cuando otra eso sirve mucho y eso es pura práctica no hay nada que solo montarte en el código y hacerlo y por supuesto leer documentación vale quizás una de las cositas que más sí se recomienda sería entender cómo están construidos los modelos 3D y por ejemplo
[00:49:15] para Blender si te gusta Blender que es gratis y es open source y todo te enseñas te puedes aprender mucho con esto como de ok yo tengo un cubo pero realmente ¿qué es un cubo en un espacio de 3D? está formado por los vértices yo puedo mover los vértices para donde me dé la gana que son los normals que es un poco confuso y para no quiero confundir la audiencia pero hay como tres definiciones de normals que es horrible no sé por qué pero la que me refiero ahora es
[00:49:44] ¿a dónde está apuntando mi cara? como todo ese tipo de cositas que de nuevo lo vas aprendiendo mucho cuando lo vayas haciendo sí es importante como tener un conocimiento básico de qué pasa sobre todo para el debug para cuando digas oye ¿por qué mi cubo o mi esfera está o sea está tan extraña está apuntando como para el otro lado ¿no? pero ¿por qué? ah porque mis normals están invertidos ¿por qué mis normals están invertidos? porque hice una escala
[00:50:14] negativa es como ok ya tengo ya sé por qué espero no asustar a nadie con todo esto pero sí recomendarías entonces por ejemplo meterte por lo menos a picarle a Blender que es este software de diseño y de creación en 3D como para que tengas una idea me imagino ¿no? porque cuando estás haciendo cosas en el código pues no sé en esta parte de 3DS y con cientos y todo pues no lo vas a ver sino hasta que lo
[00:50:44] pues hasta que lo ves en el browser pero con esta idea de moverle primero a Blender que es como el software que está hecho para eso con la UI y todo a lo mejor tendrías como más más idea de qué se trata esto del 3D no sé algo por ahí yo creo que Blender te ayuda muchísimo y de nuevo la parte como de recomendar algo específico lo que podría recomendar sí o sí o sí o sí es vete unos tutoriales unas cosas que hay muchos por ahí sea en español o sea en inglés o lo que sea
[00:51:14] pero sí empiezan unos tutoriales para que al menos te vayan agarrando de la manito mientras va todo lo básico yo no empecé a usar Blender como tan a profundidad hasta mucho ya después que ya sabía cómo codear en 3D ah ok y no sabía qué hacer estaba el cubo ahí y era que wow porque aparte la interfaz de Blender es un poco intimidante como tantas cosas que uno realmente no sabe qué hacer pero pero pero si es
[00:51:44] extremadamente útil cuando ya tienes un poco de base Blender te ayuda muchísimo para para moverte mucho más rápido en tu escena ya no tienes que crear no sé vamos a poner un ejemplo tonto de nuevo estoy con muchos ejemplos pero vamos a ver que tienes un cubo y le quieres poner un triángulo encima ¿no? hacer eso en Blender es no sé si tú sabes cómo hacerlo es menos de es un minuto en cambio hacerlo en código es como ok vamos a mostrar vamos a poner el cubo
[00:52:14] vamos a poner el triángulo en una posición que sea exacta cambiar la geometría es como un cambio en Blender lo puedes hacer súper fácil o sea ya entendiendo cómo va el flujo ya todo el Blender digamos que te hace la vida más fácil ok bueno para recomendar si sí o sí o sí o sí un cursito no es como le digo le diría a todo el mundo no es rocket science no es no es tecnología de la NASA no es algo fuera de nuestro alcance en realidad es bastante bastante eh
[00:52:45] double que es como se puede hacer no es tan imposible muy bien así que sí denle un intento ahora con el ya te lo hace mucho más fácil si le pides que te explique seguro que sí muy bien pues ha sido muy interesante a mí me gusta mucho este sobre todo que estemos en temas en los que no me siento demasiado cómodo y bueno eso me agrada mucho porque porque uno aprende mucho y me da mucho gusto también que podemos por fin por fin
[00:53:15] por fin platicar después de tanto tiempo y no sé si tienes por ahí algo algo más que nos quieras contar acerca de pues de estos temas que queríamos platicarle a la audiencia a los listeners quizá no sé quizá hablar un poco más del open source pero no así como el 3D ya cubrimos lo básico no sé podría mencionar en el open source que un poco más mi experiencia personal
[00:53:45] que fue que yo comencé con 3D haciendo puros PR los invitaría de nuevo a todos los que estén escuchando anímense hagan su PR por ahí contribuyan en el open source no tienen que ser solamente con código yo yo empecé con 3DS como mantenedor y luego me fui como de pura curiosidad fui contribuyendo a otra librería y el recibimiento fue muy bacán el recibimiento es muy genial la gente siempre es como ok bueno alguien está contribuyendo a mi librería o simplemente
[00:54:14] tomarse el tiempo de abrir un issue en GitHub y para siempre felicitar a alguien o para dejar un comentario como de oye te falta una recomendación sería modificar esto en tu readme o hice unos PR a 3DS por ejemplo y eso para mi es como wow es una librería gigantesca y ellos aceptaron en PR se puede hacer solo diría como se puede hacer inténtenlo
[00:54:44] es muy reconfortante de hecho diría que un poco adictivo una vez que te empiezas con este mundo quizás es un poco adictivo y de lo mejor de todo es que la gran mayoría de las veces es como no estás atado como a un tiempo como a un sabes como una presión no tienes esto en realidad tú lo haces si quieres cuando quieras así como los mantenedores pasan un mes pueden pasar no sé un tiempo sin revisar tu PR o sin contestarte tú puedes hacer lo mismo no hay como un apuro no es no es que subí este PR por favor
[00:55:13] revísalo ya no todo es como muy relajado mucha mucha buena vibra muy bien no hay alguien que te pregunta cómo vamos cómo vamos ya está listo ok ok sí me gusta me gusta es un buen consejo y como dices todo es posible solo hay que intentarlo y empezar de poquito y empezar con lo que nos sintamos cómodos a lo mejor exacto me gusta me gusta sí encontrar un paquete que lo uses mucho y que quizás le haya encontrado
[00:55:43] una falla es una muy buena manera de empezar un paquete que te gusta o que quieras ver crecer claro claro sí siempre hay algo que estamos utilizando y encontramos este no sé algo que podríamos mejorar o algo que necesita este ser arreglado y bueno pues eso ayuda ayuda mucho ¿no? muy bien yo creo que todavía con estos temas de estos tiempos de AI vale la pena seguir esforzando un poco en el open source mucha gente dice que va un poco muriendo
[00:56:12] y quizás va un poco decayendo pero vale la pena tener un single source of truth ¿no? como que es como que el AI se base en este código que aún así todos lo podemos entender y que ojalá sea desarrollador amigable ¿no? que sea como un código que las humanos podemos entender entonces creo que sí todavía vale la pena invertir en el open source así que no se desanimen bien eso me gustó también muy bien
[00:56:42] muchas gracias ok ok ok pues si te parece vamos a las últimas dos secciones de nuestros episodios la primera es el vamos a hacer el pick que son bueno cosas que digamos que tienen tu sello personal o que podrías recomendar ampliamente a los demás no tiene que ser algo de tecnología pero puede ser una receta un libro un no sé un álbum de música algo que bueno
[00:57:14] ¿cómo ves? tengo ya había pensado en esta pregunta tengo dos libros que me gustaría recomendar uno se llama The Design of Everything que sería como el diseño de todas las cosas de Norman y no recuerdo su apellido pero es un señor muy muy capo tiene muchos años dedicándole a UX y es un libro que no es tecnología
[00:57:44] tocan en algunas partes pero no es de tecnología pero básicamente te explica en detalle como por qué el diseño es importante como por qué si tú cometes un error normalmente sería culpa del diseño no de la persona es maravilloso lo encontré pero me cambió la vida uno de esos libros que te arrozó y el otro no sé si sea tan un popular opinion que sería como una opinión muy popular a mí me gustó el libro de Clean Coder que es como
[00:58:14] el desarrollador limpio de el Uncle Bob el tío Bob y a diferencia del Clean Code que es como el más famoso de Clean Coder es acerca de ti como de los programadores y creo que llegó un momento muy muy buen muy bueno de mi vida muy preciso y tenía muchos consejos que yo me sentía muy muy muy digamos que me tocaron la fibra
[00:58:44] en ese momento como que de verdad lo encontré muy buen libro no sé si sea tan bueno como para todo el mundo pero si tiene chance leal de verdad tiene muchos consejos buenos así como para ti como persona como tú deberías verte como profesional como desarrollador eso es todo muy bien muy bien dos libros muy buenos buenas recomendaciones vamos a dejar pues también por ahí si encontramos los links y todo en las notas del show para que para que los puedas revisar
[00:59:13] querido listener muy bien muy bien y la otra sección es acerca de los shameless self plugs que es decir vaya pues un proyecto algo en lo que estés trabajando y que nos quieras compartir si tienes por ahí no sé algo igual algo que quieras que los demás sepan que es algo personal algo que que no sé te gustaría compartir ya voy a a compartir dos básicamente ya hablé un poco de los dos que es mi laboratorio creativo
[00:59:42] que es básicamente yo haciendo todos open source pueden conseguir el código pero yo haciendo muchos experimentos de computer graphic en Vue.js y 3ds entonces vas a encontrar más de yo creo que van como más de 90 demos así que wow revísenlo el código para ser honesto el código no es tan limpio yo solamente encuentro algo que quiero replicarlo así que no me concentro como en código limpio de producción
[01:00:11] pero ahí tienes la idea no es como básicas de crear juegos y todo el tema y el otro es 3ds ya hablé de ello la librería de nosotros si quieres crear experiencias 3D con Vue 3ds es tu mejor aliado así que por acá estamos perfecto si hay que echarle un buen ojo porque está muy divertido pero bueno entonces hasta aquí lo dejamos muchísimas gracias por acompañarnos Jaime o Jaime muchas gracias también a ti
[01:00:41] por estar con nosotros aquí hasta el final y bueno sin más te dejamos por ahí como dije las notas del show y ojalá que nos escuchemos en la próxima hasta luego bye bye


