{"id":5082,"date":"2022-07-08T13:03:55","date_gmt":"2022-07-08T12:03:55","guid":{"rendered":"https:\/\/canaltic.com\/blog\/?p=5082"},"modified":"2022-07-08T13:22:31","modified_gmt":"2022-07-08T12:22:31","slug":"makecode-arcade-creacion-de-videojuegos-arcade-2d-al-alcance-de-ninos-as-y-jovenes","status":"publish","type":"post","link":"https:\/\/canaltic.com\/blog\/?p=5082","title":{"rendered":"MakeCode Arcade, creaci\u00f3n de videojuegos al alcance de ni\u00f1os\/as y j\u00f3venes"},"content":{"rendered":"<h3 class=\"p1\"><b>Qu\u00e9 es MakeCode Arcade<\/b><\/h3>\n<p class=\"p1\"><a href=\"https:\/\/arcade.makecode.com\/\" target=\"_blank\" rel=\"noopener\"><strong>MakeCode Arcade<\/strong><\/a> es una plataforma de programaci\u00f3n visual, soportada por Microsoft, que facilita el dise\u00f1o de videojuegos 2D de plataformas tipo arcade retro. Los juegos creados se pueden disfrutar en el emulador que proporciona la propia herramienta o bien descargarlos y jugarlos en dispositivos port\u00e1tiles.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-5100\" src=\"https:\/\/canaltic.com\/blog\/wp-content\/uploads\/2022\/07\/arcadespecial.jpeg\" alt=\"\" width=\"900\" height=\"340\" srcset=\"https:\/\/canaltic.com\/blog\/wp-content\/uploads\/2022\/07\/arcadespecial.jpeg 900w, https:\/\/canaltic.com\/blog\/wp-content\/uploads\/2022\/07\/arcadespecial-300x113.jpeg 300w, https:\/\/canaltic.com\/blog\/wp-content\/uploads\/2022\/07\/arcadespecial-768x290.jpeg 768w\" sizes=\"auto, (max-width: 900px) 100vw, 900px\" \/><\/p>\n<h3 class=\"p1\"><b>Caracter\u00edsticas<\/b><\/h3>\n<p class=\"p1\">Las prestaciones m\u00e1s destacadas de esta plataforma son:<\/p>\n<ul class=\"ul1\">\n<li class=\"li1\"><b>Online<\/b>. Es accesible desde cualquier ordenador o tablet a trav\u00e9s del navegador web por tratarse de una plataforma online.<\/li>\n<li class=\"li1\"><b>Registro. <\/b>Si se utiliza una cuenta de Microsoft se pueden almacenar en su nube los proyectos creados.<\/li>\n<li class=\"li1\"><b>Visual y Textual<\/b>. Se puede programar con bloques pero tambi\u00e9n en modo textual usando Javascript.<\/li>\n<li class=\"li1\"><b>Orientada al dise\u00f1o de videojuegos<\/b>. Ofrece bloques de programaci\u00f3n visual muy centrados en facilitar las tareas habituales en la creaci\u00f3n de videojuegos: colisiones, vidas, marcadores, explosiones, jugadores\/enemigos\/proyectiles \u2026<\/li>\n<li class=\"li1\"><b>Miniconsolas<\/b>. El videojuego se puede descargar y jugar en dispositivos port\u00e1tiles como Meowbit, BrainPad Arcade, TinkerGen GameGo, Adafruit PyBadge, Adafruit PyGamer, Kitronik Arcade, Ovobot Xtron Pro \u2026[<a href=\"https:\/\/arcade.makecode.com\/hardware\" target=\"_blank\" rel=\"noopener\"><strong>Hardware para MakeCode Arcade]<\/strong><\/a><\/li>\n<li class=\"li1\"><b>Publicaci\u00f3n<\/b>. Cada juego dise\u00f1ado se puede publicar en la nube disponiendo con ello de una URL que se puede enviar a otras personas para que accedan y jueguen con \u00e9l. Ejemplo: <strong><a href=\"https:\/\/makecode.com\/_7ce7q4LzcK3w\"><span class=\"s1\">https:\/\/makecode.com\/_7ce7q4LzcK3w<\/span><\/a><\/strong><\/li>\n<li class=\"li1\"><b>Reutilizaci\u00f3n<\/b>. Al publicar cada juego se ofrece a los dem\u00e1s la posibilidad de que vean el c\u00f3digo y lo puedan reutilizar y mejorar en sus propios dise\u00f1os.<\/li>\n<li class=\"li1\"><b>Descarga. <\/b>El juego creado se puede descargar en formato *.HEX para enviarlo a otros usuarios, subirlo al aula virtual, etc.<\/li>\n<li class=\"li1\"><b>Ayuda. <\/b>Su comunidad ofrece m\u00faltiples manuales y videotutoriales para comenzar a crear videojuegos con esta herramienta.<\/li>\n<li class=\"li1\"><b>Edades<\/b>. Se recomienda para alumnado entre 9 y 18 a\u00f1os.<\/li>\n<li class=\"li1\"><b>Idiomas<\/b>. Su interfaz en ingl\u00e9s es posible configurarla en espa\u00f1ol, franc\u00e9s, alem\u00e1n, chino, japon\u00e9s \u2026 De esta forma puede resultar interesante con el alumnado en contextos de inmersi\u00f3n ling\u00fc\u00edstica.<\/li>\n<li class=\"li1\"><b>Gratuita<\/b>. Se trata de un entorno de desarrollo \u201copen source\u201d de car\u00e1cter completamente gratuito.<\/li>\n<\/ul>\n<h3 class=\"p1\"><b>Ejemplo: Videojuego \u201cAsteroids\u201d<\/b><\/h3>\n<p class=\"p1\">En este caso hemos dise\u00f1ado el t\u00edpico juego \u201cAsteroids\u201d siguiendo el videotutorial \u201c<strong><a href=\"https:\/\/www.youtube.com\/watch?v=7pBGS_tKfmU\" target=\"_blank\" rel=\"noopener\">How create an Arcade Game<\/a><\/strong>\u201d.\u00a0La experiencia ha resultado muy satisfactoria. De una forma f\u00e1cil y comprensible hemos creado un juego arcade cl\u00e1sico totalmente jugable.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-5084\" src=\"https:\/\/canaltic.com\/blog\/wp-content\/uploads\/2022\/07\/arcade01.png\" alt=\"\" width=\"547\" height=\"338\" srcset=\"https:\/\/canaltic.com\/blog\/wp-content\/uploads\/2022\/07\/arcade01.png 547w, https:\/\/canaltic.com\/blog\/wp-content\/uploads\/2022\/07\/arcade01-300x185.png 300w\" sizes=\"auto, (max-width: 547px) 100vw, 547px\" \/><\/p>\n<p class=\"p1\">Esta secuencia de bloques se ejecuta al iniciarse el juego:<\/p>\n<ul class=\"ul2\">\n<li class=\"li1\">Comienza el efecto de un fondo de estrellas que se mueven.<\/li>\n<li class=\"li1\">Se define el sprite del ca\u00f1\u00f3n como el jugador. Su gr\u00e1fico se ha elegido de la galer\u00eda.<\/li>\n<li class=\"li1\">Se establece la posici\u00f3n de este sprite en la pantalla: en el centro y abajo<\/li>\n<li class=\"li1\">Se define el movimiento del sprite con la pulsaci\u00f3n de botones con velocidad 100 en el eje X y velocidad 0 en el eje Y. De esta forma solo se podr\u00e1 mover en el eje horizontal pero no el eje vertical.<\/li>\n<li class=\"li1\">Se configura para que el sprite siempre se muestre en pantalla. Se evita que se salga y desaparezca por los laterales.<\/li>\n<\/ul>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-5085\" src=\"https:\/\/canaltic.com\/blog\/wp-content\/uploads\/2022\/07\/arcade02.png\" alt=\"\" width=\"668\" height=\"248\" srcset=\"https:\/\/canaltic.com\/blog\/wp-content\/uploads\/2022\/07\/arcade02.png 668w, https:\/\/canaltic.com\/blog\/wp-content\/uploads\/2022\/07\/arcade02-300x111.png 300w\" sizes=\"auto, (max-width: 668px) 100vw, 668px\" \/><\/p>\n<p class=\"p1\">Esta secuencia de bloques se ejecuta cada segundo:<\/p>\n<ul class=\"ul2\">\n<li class=\"li1\">Se crea un sprite asteroide con un comportamiento de proyectil que cae desde arriba con una velocidad en el eje X de cero y en el eje Y de 50. Su gr\u00e1fico se ha elegido de la galer\u00eda.<\/li>\n<li class=\"li1\">Se establece que su coordenada X sea un valor aleatorio entre 0 y la anchura de la pantalla para caer en cada ocasi\u00f3n en una l\u00ednea vertical distinta.<\/li>\n<li class=\"li1\">Se define el sprite como de tipo enemigo.<\/li>\n<\/ul>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-5086\" src=\"https:\/\/canaltic.com\/blog\/wp-content\/uploads\/2022\/07\/arcade03.png\" alt=\"\" width=\"761\" height=\"204\" srcset=\"https:\/\/canaltic.com\/blog\/wp-content\/uploads\/2022\/07\/arcade03.png 761w, https:\/\/canaltic.com\/blog\/wp-content\/uploads\/2022\/07\/arcade03-300x80.png 300w\" sizes=\"auto, (max-width: 761px) 100vw, 761px\" \/><\/p>\n<p class=\"p1\">Cuando se pulsa el bot\u00f3n A \u2026<\/p>\n<ul class=\"ul2\">\n<li class=\"li1\">Se crea un sprite proyectil con el gr\u00e1fico dibujado, saliendo del sprite del ca\u00f1\u00f3n con una velocidad en el eje X de 0 y en el eje Y de -50. De esta forma sube vertical hacia arriba.<\/li>\n<li class=\"li1\">Se reproduce el sonido \u201cpew pew\u201d.<\/li>\n<\/ul>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-5087\" src=\"https:\/\/canaltic.com\/blog\/wp-content\/uploads\/2022\/07\/arcade04.png\" alt=\"\" width=\"660\" height=\"271\" srcset=\"https:\/\/canaltic.com\/blog\/wp-content\/uploads\/2022\/07\/arcade04.png 660w, https:\/\/canaltic.com\/blog\/wp-content\/uploads\/2022\/07\/arcade04-300x123.png 300w\" sizes=\"auto, (max-width: 660px) 100vw, 660px\" \/><\/p>\n<p class=\"p1\">Cuando el sprite de tipo player (ca\u00f1\u00f3n) colisiona con otro sprite de tipo enemigo (asteroides) \u2026<\/p>\n<ul class=\"ul2\">\n<li class=\"li1\">Se destruye el otro sprite con un efecto de fuego que dura 0,5 s.<\/li>\n<li class=\"li1\">La c\u00e1mara vibra 4 p\u00edxeles durante 0,5 s.<\/li>\n<li class=\"li1\">Se reproduce el audio \u201cbig crash\u201d<\/li>\n<li class=\"li1\">Se resta una vida. Al inicio de juego se dispone por defecto de 3 vidas. Al perderlas el juego se detiene mostrando \u201cGame over\u201d.<\/li>\n<\/ul>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-5088\" src=\"https:\/\/canaltic.com\/blog\/wp-content\/uploads\/2022\/07\/arcade05.png\" alt=\"\" width=\"691\" height=\"270\" srcset=\"https:\/\/canaltic.com\/blog\/wp-content\/uploads\/2022\/07\/arcade05.png 691w, https:\/\/canaltic.com\/blog\/wp-content\/uploads\/2022\/07\/arcade05-300x117.png 300w\" sizes=\"auto, (max-width: 691px) 100vw, 691px\" \/><\/p>\n<p class=\"p1\">Cuando el sprite de tipo enemigo (asteriodes) colisiona con otro sprite de tipo proyectil \u2026<\/p>\n<ul class=\"ul2\">\n<li class=\"li1\">Se destruye el proyectil<\/li>\n<li class=\"li1\">Se destruye el sprite enemigo con un efecto de desintegraci\u00f3n que dura 0,1 s.<\/li>\n<li class=\"li1\">Se reproduce el audio \u201csmall crash\u201d<\/li>\n<li class=\"li1\">Se incrementa el contador de puntos en uno.<\/li>\n<\/ul>\n<h3>Exportaci\u00f3n a miniconsolas<\/h3>\n<p>Una de las prestaciones m\u00e1s interesantes de MakeCode Arcade es la posibilidad de descargar el videojuego creado en dispositivos port\u00e1tiles o miniconsolas que permiten jugarlo con independencia del ordenador o la plataforma. En este caso lo hemos probado en el dispositivo <a href=\"https:\/\/www.ovobot.cc\/en\/product\/detail\/xtron-pro\/\" target=\"_blank\" rel=\"noopener\"><strong>Ovobot Xtron Pro<\/strong><\/a> y su comportamiento ha sido excelente. A continuaci\u00f3n se muestra un peque\u00f1o v\u00eddeo del resultado:<\/p>\n<div style=\"width: 640px;\" class=\"wp-video\"><video class=\"wp-video-shortcode\" id=\"video-5082-1\" width=\"640\" height=\"360\" preload=\"metadata\" controls=\"controls\"><source type=\"video\/mp4\" src=\"https:\/\/canaltic.com\/blog\/wp-content\/uploads\/2022\/07\/videoArcade.mp4?_=1\" \/><a href=\"https:\/\/canaltic.com\/blog\/wp-content\/uploads\/2022\/07\/videoArcade.mp4\">https:\/\/canaltic.com\/blog\/wp-content\/uploads\/2022\/07\/videoArcade.mp4<\/a><\/video><\/div>\n<h3><\/h3>\n<h3 class=\"p1\">Conclusi\u00f3n<\/h3>\n<p class=\"p1\">La plataforma <a href=\"https:\/\/arcade.makecode.com\/\"><strong>Makecode Arcade<\/strong><\/a> es una opci\u00f3n interesante para la iniciaci\u00f3n del alumnado, entre 9 y 18 a\u00f1os, en el dise\u00f1o y programaci\u00f3n de videojuegos cl\u00e1sicos arcade superando el rol de simples consumidores y convirti\u00e9ndose en aut\u00e9nticos creadores digitales. El proceso creativo desarrollado por el alumno involucra de forma globalizada aprendizajes de distintas \u00e1reas: lengua, ingl\u00e9s, matem\u00e1ticas, ciencias, art\u00edstica &#8230; , dotando de sentido y significado a la adquisici\u00f3n de estos contenidos en una actividad interesante y l\u00fadica de los ni\u00f1os\/as y j\u00f3venes.<\/p>\n<h3 class=\"p1\">Demo del juego \u00abAsteroids\u00bb<\/h3>\n<p><strong><a href=\"https:\/\/makecode.com\/_7ce7q4LzcK3w\" target=\"_blank\" rel=\"noopener\">Enlace al juego \u00abAsteroids\u00bb<\/a><\/strong><\/p>\n<div style=\"position: relative; height: 0; padding-bottom: 117.6%; overflow: hidden;\"><iframe style=\"position: absolute; top: 0; left: 0; width: 50%; height: 100%;\" src=\"https:\/\/arcade.makecode.com\/---run?id=_ATt6ae4VRXoF\" frameborder=\"0\" sandbox=\"allow-popups allow-forms allow-scripts allow-same-origin\" allowfullscreen=\"allowfullscreen\"><\/iframe><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Qu\u00e9 es MakeCode Arcade MakeCode Arcade es una plataforma de programaci\u00f3n visual, soportada por Microsoft, que facilita el dise\u00f1o de videojuegos 2D de plataformas tipo arcade retro. Los juegos creados se pueden disfrutar en el emulador que proporciona la propia herramienta o bien descargarlos y jugarlos en dispositivos port\u00e1tiles. Caracter\u00edsticas Las prestaciones m\u00e1s destacadas de [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":5111,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[74,84],"tags":[],"class_list":["post-5082","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-computing","category-gamificacion"],"_links":{"self":[{"href":"https:\/\/canaltic.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/5082","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/canaltic.com\/blog\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/canaltic.com\/blog\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/canaltic.com\/blog\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/canaltic.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=5082"}],"version-history":[{"count":25,"href":"https:\/\/canaltic.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/5082\/revisions"}],"predecessor-version":[{"id":5118,"href":"https:\/\/canaltic.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/5082\/revisions\/5118"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/canaltic.com\/blog\/index.php?rest_route=\/wp\/v2\/media\/5111"}],"wp:attachment":[{"href":"https:\/\/canaltic.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=5082"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/canaltic.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=5082"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/canaltic.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=5082"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}