Sprites y Enemigos | Ray casting HTML5 con JavaScript (Parte5)

แชร์
ฝัง
  • เผยแพร่เมื่อ 9 พ.ย. 2024

ความคิดเห็น • 62

  • @osamita_bin
    @osamita_bin 4 ปีที่แล้ว +2

    Eres el mejor. De verdad muchisimas gracias por tremendo tutorial. He durado tres dias viendolo y retrocediendo y volviendo a ver para que no se me escape nada y de verdad ha sido uno de los mejores tutoriales que he visto en youtube.

  • @manuelmontanes4333
    @manuelmontanes4333 4 ปีที่แล้ว +3

    Enhorabuena por este fantástico trabajo. Esta serie es una maravilla. Lo que cualquier aficionado a los videojuegos y a la programación ha soñado alguna vez, que nos explicaran la magia detrás de los juegos. Además, me gusta mucho el toque de reducir la edición de los vídeos, salen mas largos, pero deja ver el proceso de desarrollo, el luchar con los errores. Se aprende mucho más así que con una clase magistral. Muchas gracias.

    • @javianmuniz
      @javianmuniz 4 ปีที่แล้ว +2

      ¡Muchísimas gracias, Manuel! Te lo agradezco mucho :)
      Precisamente estoy haciendo los vídeos que a mi me habría gustado ver cuando empecé a interesarme por el desarrollo de videojuegos. Yo soy un aficionado más, que lleva años curioseando y aprendiendo a base de: tutoriales, foros, libros y cursos online. Ahora mismo, de hecho, estoy empezando a implementar un motor 3D real, creado de cero, sin librerías ni WebGL, por supuesto y también tengo como objetivo traer otra serie sobre el motor pseudo 3D que usaban los juegos de coches como Out Run. También, para cualquier cosa, o inquietud que tengáis, acepto sugerencias sobre temáticas para tutoriales. Mi idea es centrarme en aquellas cosas que no explican otros canales ¡Un abrazo y de nuevo gracias por tu comentario, amigo! Nos vemos en el próximo vídeo :)

  • @RogelioIturra
    @RogelioIturra 4 ปีที่แล้ว +5

    Me hiciste entender el Raycasting y todo el trabajo de Carmak. De verdad, el entendimiento desde lo matemático hasta lo virtual. Suscrito!

  • @ezeqkr
    @ezeqkr 4 ปีที่แล้ว +3

    Se lo pase a mi viejo que ya lo termino, le pareció tremendo el curso. Ya estoy viendo de pensar que cosas se pueden hacer.
    Muchas gracias por todoo!
    (Posta este tipo de tutoriales son geniales)

    • @javianmuniz
      @javianmuniz 4 ปีที่แล้ว +2

      ¡Muchísimas gracias Ezequiel! Me alegra mucho que os haya gustado. Si todo va bien, esta semana retomaré los tutoriales aquí en el canal ¡Un saludo y muchas gracias a vosotros! :)

    • @ezeqkr
      @ezeqkr 4 ปีที่แล้ว

      @@javianmuniz Uh genial estaremos atentos!!
      Gracias! Abrazoss

  • @alejandrovalenzuelasilerio5285
    @alejandrovalenzuelasilerio5285 4 ปีที่แล้ว +2

    Man tu tutorial es la onda al fin lo he terminado excelente material muchas gracias ya estuve revisando el código fuente y tu desarrollo y me parece material de mucha valía :)

    •  4 ปีที่แล้ว +1

      Qué bueno, Alejandro! Mil gracias por tu comentario, me alegra mucho que hayas disfrutado del tutorial, amigo 😃

  • @eddyplay3005
    @eddyplay3005 4 ปีที่แล้ว +3

    Me ayudaste mucho gracias!!!! ✨ No había encontrado un totriao tan bueno como los tuyos. De verdad gracias por esta serie de tutoriales. Ahora ya puedo crear mi videojuego

    •  4 ปีที่แล้ว +3

      Es todo un honor de verdad! Mil gracias por tu comentario Eddy 😊

  • @wilson6938
    @wilson6938 4 ปีที่แล้ว +2

    Hola Javier, llevo ya un tiempo viendo y poniendo en práctica lo que nos muestras en tus videos y realmente quería darte las gracias, no solo me haz enseñado muchas cosas acerca del mundo de la informática, sino que también me devolviste el interés y la pasión por programar, cada que subes un video hay algún tema interesante del cual no tenía ni idea e incluso te tomas el tiempo para explicar como funciona de una forma que dan ganas de programar casi de inmediato, se nota que le pones mucho empeño y dedicación a tus videos y eso es algo admirable, realmente te felicito y te agradezco por tu excelente trabajo.

  • @jhonjhon900
    @jhonjhon900 4 ปีที่แล้ว +5

    Me acabo de suscribir y es un honor para mí ser el suscriptor número 1000, estoy seguro que este canal será muy grande, sigue haciendo vídeos Javier, lo haces muy bien y valoramos tú esfuerzo

    • @javianmuniz
      @javianmuniz 4 ปีที่แล้ว +2

      ¡Qué alegría Jhon Jhon! Te lo agradezco infinitamente, amigo. Pues ahora en 10 minutos publico nuevo vídeo que espero te guste también. De verdad que para mi es un honor también, gracias por tus palabras ¡Un abrazo, crack! :)

  • @Angel-lw9be
    @Angel-lw9be 4 ปีที่แล้ว +4

    Exelente trabajo! saludos desde Venezuela!

  • @botcharlie6088
    @botcharlie6088 4 ปีที่แล้ว +3

    Muchas gracias por el video! Con todo esto del confinamiento esto empezando a interesarme mucho por la programación y tus videos me ayudan a mantener la motivación. Mucha suerte y un saludo

    • @javianmuniz
      @javianmuniz 4 ปีที่แล้ว +1

      ¡Muchas gracias, Charlie! Espero que estéis todos bien por ahí ¡Cuidaros mucho! Me alegra que te esté gustando la serie y el canal, pronto traeré cosas muy chulas ¡Un abrazo!

  • @ProgramasVBnet
    @ProgramasVBnet 4 ปีที่แล้ว +3

    Estupendo esta colección, guardado para cuando tenga ese tiempo y aprenda tu curso. Se hace difícil el teletrabajo con peques de 2 años, pero que le vamos hacer, menos mal que estamos mi mujer y yo, asi cuando nos llaman o hago incidencias nos repartimos si estan lloran o protestan, menos mal que son 2 y entre ellas aunque a veces se pegan se lo pasan mejor. Peor es nuestros padres, ya mayores.. yo tengo a mi padre de 76 años viviendo solo y aunque es una persona fuerte no se deja que le haga nada, el quiere ir a comprar y salir a la calle, aunque la última vez compró para varios días. Esperemos que entre todos superemos esto, menuda mentira nos metieron, para mi que tenía que haberse cerrado fronteras hace mucho tiempo y asi por lo menos la economía interna no se resentiría. Saludos y un abrazo Javier

    • @javianmuniz
      @javianmuniz 4 ปีที่แล้ว +2

      Me alegra mucho que te guste, amigo. Mucho ánimo, sé que son tiempos difíciles pero seguro que vamos a salir más fuertes de esta ¡Mucho ánimo y mucha salud para tu familia! ¡Un abrazo enorme! ;)

  • @CaioVinicius-nc3cy
    @CaioVinicius-nc3cy 4 ปีที่แล้ว +3

    Saludos desde Brasil, muy buen video :)

  • @jcjc3054
    @jcjc3054 4 ปีที่แล้ว +3

    Espero que dediques algún video mas a este tema, me ha gustado mucho, creo que puede ser muy jugoso el tema de colisiones con los sprites, (enemigos), como poder dotar de pseudo inteligencia a estos sprites, (si te ven, van a por ti, como los soldados del wolfstein), como poder controlar las trayectorias de tus disparos para saber si han impactado en algún enemigo, (o trayectorias de enemigos en ti), etc.... la verdad es que metiéndose en el código de algo así, aprecias MUCHISIMO mas lo que se hizo en su día con esta técnica, tenemos ordenadores centenares de veces mejores y para hacer una cuarta parte de lo que hace el original ya ves que te puedes quedar sin recursos tirando solo del CPU, (sin meter a las GPU's), y la verdad si Wolfstein es el inicio, ya el motor del DOOM teniendo concepto de "nivel", (suelo (alto/bajo), techo (alto/bajo), profundidad (subir bajar escaleras, simas), etc... te imaginas como se puede complicar la cosa. Y ESO CORRíA en un "puñetero" i386, (y si me apuras un poco en un 286 sin coprocesador mat), me lo he pasada MUY BIEN, como en el resto de la serie GRACIAS Javier por compartirlo.

    •  4 ปีที่แล้ว +3

      ¡Hola Jc! No sabes lo mucho que me alegra que hayas disfrutado tanto de esta serie. Sí, la verdad es que el tema de las colisiones es sencillo de implementar, ya que al final son colisiones en 2D y lo mismo ocurre para la IA, así que seguramente lo tratemos en otros vídeos y luego podamos implementarlo aquí también (tomo buena nota) ;)
      Justo esa era mi idea. Desde que leí el libro "Maestros del Doom" quise saber cómo habían implementado este juego y he sentido un renovado respeto por Carmack y compañía :)
      El motor de Doom ya es más complejo, emplea árboles BSP y algunas técnicas de 3D real, pero me gustaría implementarlo también porque hay poquísima documentación al respecto y sería todo un reto. Muchas gracias por tu comentario y por tomarte el tiempo en apreciar lo que estoy haciendo, no sabes lo muchísimo que se agradece ¡Un abrazo, amigo! :D

  • @var_2_al
    @var_2_al 4 ปีที่แล้ว +2

    eres un grande, soy nuevo suscriptor en tu canal y me gusta mucho como lo explicas todo y como lo haces, sigue así!!!!

    •  4 ปีที่แล้ว +1

      ¡Muchas gracias colega! Si todo va bien hoy o mañana habrá nuevo vídeo ¡Un abrazo! :D

  • @xarnattos3
    @xarnattos3 4 ปีที่แล้ว +2

    Excelente como siempre Javier!!!
    Aunque como iba codificando junto a ti en este me costó mas llevarte el ritmo pues todo ya estaba listo jajajaja

    •  4 ปีที่แล้ว +2

      ¡Hola Alejandro! Muchas gracias, me alegra un montón que te haya gustado. Esta tarde voy a grabar nuevo vídeo. A ver si me da tiempo a subirlo esta tarde/noche ¡Un abrazo! :)

  • @jmrmedev2692
    @jmrmedev2692 3 ปีที่แล้ว +1

    ¿Qué tal Javier? Logré llegar hasta este punto. Antes que nada, quiero agradecerte por esta serie de tutoriales, que en términos de aprendizaje, me resultaron extremadamente útiles. Me agradó bastante la paciencia y empeño que pusiste en la realización de estos videos, al igual que tu conocimiento y entendimiento de los problemas que esta pequeña demo del motor implicaba. Realmente me parece que es una de las fuentes actuales más completas sobre el tema y me inspiró a seguir trabajando en mis versiones del motor.
    Sin embargo, a manera de crítica constructiva y buscando aún una mayor calidad en tus videos, me gustaría hacerte un par de comentarios que se relacionan con mi experiencia al haber tomado este pequeño curso:
    1. Es cuestión personal, por supuesto, pero estoy seguro que sabes que por más claridad en programación, el nombre de variables y métodos es más claro y sostenible al realizarse en inglés.
    2. No estoy seguro de qué editor de código empleas tú, pero por lo que estuve notando, de forma constante hubo muchos errores de tipografía a lo largo del tutorial y a mi parecer, esto nos consumió tiempo tanto a ti, como a nosotros. Las características de VS Code me parecen más apropiadas, puesto que inmediatamente te marca error, aún antes de ejecutar en el navegador.
    3. Relacionado con lo anterior, siento que el constante uso de llaves y un "formateador de código" como Prettier haría todo más fácil tanto para ti como para nosotros.
    4. Respecto a ya tener el código o escribirlo al momento, en buena medida disfruté que estuviéramos codificando juntos, sin embargo, esto también conllevó tiempo consumido al haber errores, con lo que a su vez se puede entorpecer el aprendizaje. Creo que sí lo más apropiado es tener el código funcionando y explicarlo. Sin embargo, en este último video siento que sí volamos en términos de velocidad, a grado tal que según vi, nos saltamos la explicación del for en la función renderSprites( ).
    Esperando aún poder disfrutar más tu excelente material, espero tomes positivamente mis comentarios.
    Para el resto de los desarrolladores que llegaron a este punto, les facilito mi versión del código, la cual tiene el pequeño bug (que sigo sin entender por qué sucede) de que al acercarse a un sprite, este empieza a moverse hacia el frente.
    github.com/JMRMEDEV/JS_raycaster

  • @JaviCoder
    @JaviCoder 4 ปีที่แล้ว +2

    madre mía que currada, bravo

    • @javianmuniz
      @javianmuniz 4 ปีที่แล้ว +2

      ¡Gracias tocayo! Un abrazo grande, Javi ¡Cuídate mucho! :)

  • @yanjumi7155
    @yanjumi7155 3 ปีที่แล้ว +1

    Que genio !

  • @Magistrado1914
    @Magistrado1914 3 ปีที่แล้ว

    Excelente curso
    Visto en 24/10/2021

  • @lucasmachain
    @lucasmachain 4 ปีที่แล้ว +2

    Hermoso, lo de los sprites realmente es una buena sentada en la silla y mucha fuerza con la cabeza ... yo aún estoy probando distintas técnicas a ver cual me convence más

    •  4 ปีที่แล้ว +1

      Gracias Lucas! Me alegra que te haya gustado el vídeo :)

  • @gingercore69
    @gingercore69 3 ปีที่แล้ว +3

    Buena serie, para cuando particion binaria como en doom? Las escaleras hacen toda la diferencia

    •  3 ปีที่แล้ว +2

      Gracias! Lo tengo pendiente parece todo un desafío. Ya me he documentado algo 😉

    • @gingercore69
      @gingercore69 3 ปีที่แล้ว +3

      @ que bueno! No me lo pienso perder 💜
      Estoy tratando de armar un juego estilo ultima underworld, por lo que aprender a hacer eso me serviria bastante n.n

    • @danielesquivel3155
      @danielesquivel3155 3 ปีที่แล้ว

      nose yo pienso

  • @JavierRodriguez-nf8nq
    @JavierRodriguez-nf8nq ปีที่แล้ว +1

    buenardo

  • @danielesquivel3155
    @danielesquivel3155 4 ปีที่แล้ว +3

    How. Javi no vi el video. Pero me lo guardare para despues. Cuando termine los otros videos. Y me gusta mucho mas asi de tener el codigo ya hecho. :3 asi es mas rapido. Y limpio.

    • @javianmuniz
      @javianmuniz 4 ปีที่แล้ว +2

      ¡Genial, Dani! Espero que estéis todos bien por ahí ¡Un abrazo grande, cuídate mucho!

    • @danielesquivel3155
      @danielesquivel3155 4 ปีที่แล้ว +3

      @@javianmuniz ;:3 Sis

  • @ricardoflores1109
    @ricardoflores1109 4 ปีที่แล้ว +2

    genio

    • @javianmuniz
      @javianmuniz 4 ปีที่แล้ว +1

      ¡Gracias Ricardo! Espero que todo vaya bien por ahí ¡Un abrazo!

  • @luisfernandocanooliveros1585
    @luisfernandocanooliveros1585 4 ปีที่แล้ว +1

    excelente la serie de vídeos, vas a proramar al jugador que le dispara a los enemigos?

    •  4 ปีที่แล้ว

      De momento no. Además esa parte sería ya más sencilla. Bastaría con ver si el rayo central impacta con un sprite. Muchas gracias por tu comentario, me alegra mucho que te haya gustado esta serie :)

  • @eduardo-zd7ru
    @eduardo-zd7ru 4 ปีที่แล้ว +3

    un vídeo genial, una cosa en los juegos que hiciste como por ejemplo tap the mole, como hiciste que el canvas fuese responsive, he intentado muchas cosas pero ninguna funciona, si pudieras decírmelo por aquí o decirme donde lo podría mirar te estaría muy agradecido

    • @javianmuniz
      @javianmuniz 4 ปีที่แล้ว +3

      ¡Hola Eduardo! Puede que trate algunos de esos detalles en algún vídeo para que lo veáis ¡Un abrazo!

  • @velos26b
    @velos26b 4 ปีที่แล้ว +2

    Vaya no se por qué pero me entero mejor cuando lo vas escribiendo según lo vas explicando. Me ha quedado la duda del ancho de los tiles de los sprites, entiendo que hay que hacerlo porque se hacen más grande a lo ancho según nos acercamos a ellos, pero no me ha quedado muy claro esa fórmula (minuto 16:52) anchuraColumna=alturaTextura/altoTextura ??. En los muros no era necesario....mmm, no se por qué...

    • @velos26b
      @velos26b 4 ปีที่แล้ว +2

      Por cierto, mis felicitaciones por el tutorial, me va a tocar hacer algo muy similar en C y me va a servir de mucha ayuda.

    • @danielesquivel3155
      @danielesquivel3155 3 ปีที่แล้ว

      @@velos26b :3 chi

  • @stevenriofrio7963
    @stevenriofrio7963 2 ปีที่แล้ว +1

    Para cuándo un render 3D porfavor ?

  • @CarlosPereira-ze8zx
    @CarlosPereira-ze8zx 3 ปีที่แล้ว +2

    Waaaaaaaaa me gustaria poder comprar tu curso e html5

    •  3 ปีที่แล้ว +3

      ¡Hola Carlos! Mil gracias por tu comentarios, amigo. Acabo de crear un cupón regalo para que te puedas matricular GRATIS del curso ¡Aprovéchalo que dura sólo 3 días! (pero una vez te matriculas es tuyo ya para siempre, así que date prisa) y si quieres, pásaselo a quien quieras, que el curso estará gratis para todo aquel que lo quiera durante estos 3 días www.udemy.com/course/programa-tus-primeros-juegos-html5-con-javascript/?couponCode=8017AD5A237707B29C80 ¡Un abrazo y espero de corazón que lo disfrutes! 😉

    • @CarlosPereira-ze8zx
      @CarlosPereira-ze8zx 3 ปีที่แล้ว +2

      @ gracias!!!!!!!!!!!!!!!!!!!!!!!!!!

    • @CarlosPereira-ze8zx
      @CarlosPereira-ze8zx 3 ปีที่แล้ว +2

      @ no lo puedo creer gracias gracias

    • @CarlosPereira-ze8zx
      @CarlosPereira-ze8zx 3 ปีที่แล้ว +2

      Muchas gracias desde Venezuela

    •  3 ปีที่แล้ว +1

      @@CarlosPereira-ze8zx ¡De nada, amigo! Que lo disfrutes ^_^

  • @dorall6403
    @dorall6403 4 ปีที่แล้ว

    Hola, ¿podría detallar los cálculos de la posición de inicio del sprite (x1)?

  • @danielesquivel3155
    @danielesquivel3155 3 ปีที่แล้ว +2

    este formato me gusta mas, pero deberias separar los archivos unu

  • @staren2989
    @staren2989 2 ปีที่แล้ว

    awful code

    •  2 ปีที่แล้ว

      Thanks, dude