Mostrando entradas con la etiqueta Drag and Drop. Mostrar todas las entradas
Mostrando entradas con la etiqueta Drag and Drop. Mostrar todas las entradas

domingo, 7 de diciembre de 2014

Mini juego creado con Viscuit

Mini juego creado por @NoeBranford
Con Viscuit la programación es diferente, ofrece la oportunidad de inciarse en ella otorgando a los más pequeños (o no tan pequeños) primeras experiencias en la misma, de una manera más sencilla, básica y visual, a través del cual aprender cómo y qué tipo de movimientos podemos dar a los objetos o personajes que se quieran crear. 
Es algo que he repetido otras veces en post anteriores, que solamente quería recordar, ya que aquí no pretendo explicar su funcionamiento, sino mostraros un pequeño juego muy simple que he creado con este programa, con las limitaciones que tiene.

Antes de comenzarlo quería crear una especie de juego similar al famoso Bomberman, pero mucho más sencillo.
Así que teniendo en cuenta la dinámica del mismo lo adapté a las posibilidades que Viscuit me ofrece. 
Primero creé el escenario con obstáculos fijos y otros movibles automáticamente para que la dificultad del mismo fuera mayor y les añadí a algunos picos. Luego creé al personaje, y le otorgué movimiento para poder manejarlo en las cuatro direcciones posibles, mediante las flechas que aparecen en la interfaz o las del teclado.
Como quería que hubiera un poquito de jugabilidad, la historia para este juego es que el dinosaurio tiene que recoger los huevos de colores de la pantalla, esquivando el mayor número de obstáculos posibles y si chocas los huevos con estos los transforma en bloques sin movimiento.
Como eso parecía tener poca interacción se me ocurrió que cada vez que se chocara con un bloque hubiera un sonido al igual que cuando cogiera un huevo también pero que fuera diferente, además de poner puntuación (de manera muy primitiva), que aparece como -1 cuando te da un bloque con picos y +2 cuando obtienes un huevo.

Eso es todo, es muy muy sencillo lo que nos permite crear a nivel de juego como podéis ver con el mio y otros que os facilito la página al final para que lo exploréis si queréis.


En el siguiente link podréis jugarlo:

http://develop.viscuit.com/3.1/Land.html?path=9464226&name=3511&smoothMotion=true&dynamicFile=false&singleview=on

Mi mini juego publicado en la página de Viscuit junto a otras creaciones

Aquí podréis encontrar un montón de juegos y animaciones creados por niños/as:

lunes, 22 de septiembre de 2014

Breve presentación de Viscuit

Hoy sigo con Viscuit, no os traigo ningún vídeo (ya llegará), pero si una presentación visual subida en mi slideshare, con más imágenes que otra cosa.
Aun no he podido grabar bien cómo usarlo mientras lo voy explicando y demás cuestiones que os comenté en el post anterior, así que es algo que lo dejaré para más adelante. ;)

Y bueno aquí os la dejo, es muy simple, más bien muestro capturas de pantalla de cómo es por dentro Viscuit, de alguna de las opciones del mismo, junto con ejemplos de algunas animaciones y juego que he creado y al final pongo enlaces de interés.





lunes, 1 de septiembre de 2014

Trailer: animaciones creadas con Viscuit

Hace ya un año que hice un artículo dedicado a un lenguaje visual de programación llamado Viscuit.
Pues bien he ido poco a poco ahondando en esta herramienta y creando animaciones y sencillos juegos con el mismo, sabiendo más aun como funciona y prácticamente conociendo lo que significa cada opción (recuerdo que su idioma es japonés).
Así que me he animado a grabar una especie de tráiler muy simple, sin música ni nada de dos pequeñas animaciones que he realizado con él, mostrando dos caras, una es la interna, es decir el lugar de trabajo del programa en sí, y la otra, sería la visualización final de la misma.





domingo, 27 de octubre de 2013

Programas para crear videojuegos

Desde hace tiempo tuve en mente crear repositorios (con symbaloo) en los cuáles recopilar distintas páginas donde encontrar juegos educativos interactivos, videojuegos para dispositivos móviles, libros sobre videojuegos y aprendizaje, programas para crear videojuegos y demás información para tenerlo más ordenado.



Hoy lo retomo con una lista de programas para desarrollar videojuegos que se pueden usar para crear videojuegos con fines educativos por parte de los alumnos/as o incluso el docente, o para enseñar a programar, los cuales en su mayoria (pero no es su totalidad) son drag & drop y no requieren tener conocimientos de programación.
Dentro del repositorio para no complicarlo, recopilo en su conjunto tanto lenguajes visuales de programación, como herramientas de autor, como aplicaciones y editores web de creación de videojuegos, y apps para android e iOS para crear videojuegos o juegos sencillos.
En todos encontraréis los enlaces principales a las páginas donde poder bajarlos y entre paréntesis diferencio entre las que son para usarlos desde PC (si están disponibles para el sistema operativo windows, Mac, Linux), iOs, de manera online, etc. y los que tienen fondo morado indica que permiten crearlos para varias plataformas (Windows, Mac, iOS, android, psp, windows phone, html5, linux, etc).
La mayoría son gratuitos, aunque algunos disponen de una versión free más las respectivas de pago con mayores opciones (ejemplo: stencylworks, adventure maker, construct 2, etc.) y otros al ser sitios web requieren registrarse.
Muchos son programas generales para crear videojuegos de varios tipos, y otros sirven para crear videojuegos específicos de algún género, como plataformas, aventuras gráficas, Interactive Fiction, etc.
Así sin más será actualizable a medida que se encuentren más, y quizás a parte se creará otro webmix donde encontrar recursos para trabajar con estas herramientas así que no te lo pierdas y échale un vistazo.
Si tenéis alguna duda o queréis añadir algo, hacérmelo saber.



* Algunos programas citados si que requieren saber algo de código, tal es el caso de Ren'py, un programa de software libre para crear novelas visuales. Con el mismo las personas que conozcan el lenguaje de programación python, podrán crear videojuegos más complejos (más adelante se explicará un poco este motor)

lunes, 22 de julio de 2013

Conociendo Viscuit

Cuando me encontré con la infografía que os presenté en un post anterior sobre lenguajes de programación visuales, me interesó mucho probar los que desconocía.
Especialmente me llamó mucho la atención Viscuit
Por su breve explicación vi que parecía sencillo de usar para los más pequeños y además me pareció ver que se usaba en algunas aulas japonesas.

Cuando pude entré en su página web, para ver como funcionaba, pero me encontré con que estaba totalmente en japonés, así que como desconozco por completo el idioma busqué información por la red, y me encontré con un artículo en inglés llamado:"Computer Programming Education Using the Visual Programming Language Viscuit" de Yasunori Harada. 
En este artículo su autor explica de manera resumida el funcionamiento de Viscuit, su experiencia en talleres que se han realizado en escuelas japonesas con esta herramienta, junto a la necesidad de la programación en la educación.
Después de leerlo, usé un poco de ayuda del google traductor que decidí usar en la página de Viscuit (la cual no es para nada precisa, pero al menos me sirve para orientarme y encontrar la pestaña donde se halla la herramienta para usarla), junto a los vídeos (eso si en japonés también, pero al ser una aplicación más visual lo que va realizando la persona en los mismos, te guía un poco sobre las posibilidades que tiene), ya que así era la mejor manera en la que pude encontrar ejemplos de como crear animaciones ó juegos sencillos para poder usarlo.
Interfaz de Viscuit

Y como lo que me interesa es el programa en sí a continuación os expondré brevemente según lo poco que he podido manejarlo cómo es Viscuit.
Viscuit es un lenguaje visual de programación online en japonés creado por Yasunori Haradael cual comenzó a desarrollar en el año 2003. 



Es una aplicación web revolucionaria, la cuál usa el sistema drag and drop, dispone de una interfaz sencilla, clara e intuitiva para crear videojuegos sencillos y animaciones (de manera limitada como indica el propio autor en su artículo). La interfaz precisamente está diseñada para niños y niñas pequeños/as que inician sus primeras experiencias en programación mediante el cual pueden aprender habilidades de programación.
Su funcionamiento se basa en manipular los dibujos que realicemos mediante su colocación en unos circulos que son como dos gafas.
Cuando colocamos un dibujo en la lente de la izquierda, tenemos que colocar otro igual en la derecha y si queremos que otorgarle movimiento, ponemos el de la derecha en una posición diferente, por ejemplo yo con la mariquita en las primeras gafas, he colocado la de la derecha un poco más arriba para que así vaya hacia arriba automáticamente.

Ejemplo mío creado con Viscuit
Además de esto podemos añadir a nuevas lentes con dibujos, además de alguna flecha las cuáles sirven para manejar el personaje e incluso números que entiendo sirven para que se muevan los personajes solo cuando se presionen los botones de los números, entre otras cosas que aun me queda por descubrir.

Os dejo en el siguiente link un ejemplo muy simple (por el tiempo que disponía) de lo que he realizado trasteando con Viscuit:

http://develop.viscuit.com/3.1/Land.html?path=1599982&name=30&smoothMotion=true&dynamicFile=false&singleview=on



Realmente veréis como una especie de vídeo en el link porque solo he logrado poder obtener la url y embeberlo, pero no se como se guarda para poder jugarlo, quizás requiere crearse alguna cuenta o algo similar, es algo a investigar.
La idea de lo que quería hacer es sencilla, las mariquitas tienen que lograr llegar arriba a las nubes evitando ser atrapadas por las redes, si contactan con estas se quedan atrapadas y tristes y si llegan a las nubes se ponen contentas y aparece una especie de premio.
(El pollo que aparece en el link que os he dado es una figura más que quise añadir al cual tenía pensado darle una función, pero finalmente no me dio tiempo y se quedó grabado así en movimiento circular. Igualmente las mariquitas como podéis apreciar tienen un movimiento curvo, que en el juego estaba pensado moverlas por el escenario con las flechas del game pad. Os recomiendo que os fijéis en las imágenes de arriba en las cuales puede verse de qué manera se crea el juego).

La verdad es una pena que no esté en inglés al menos, porque puedes ver las creaciones de otros usuarios, incluso modificarlas y supongo que compartir las tuyas propias, lo que no se es como se puede realizar.
Habrá que esperar a que terminen de desarrollarlo para Android e ios, como indican en una de las páginas que os pongo a continuación y quizás con el tiempo de esa manera lo traduzcan a otros idiomas y traspase fronteras.

Para terminar aquí encontramos muchos juegos realizados por niños http://develop.viscuit.com/3.1/index.html


Referencias

- Página web de Viscuit:


- Y, Harada, (2010). Computer Programming Education Using the Visual Programming Language Viscuit. Vol 8: No. 11. NTT Communication Science Research Laboratories. Disponible en:
https://www.ntt-review.jp/archive/ntttechnical.php?contents=ntr201011sf6.html


- Resumida información sobre Viscuit en la página de NTT Communication Science Laboratories
http://www.kecl.ntt.co.jp/rps/english/Research_e/cn22/research_media11_e.html


* Lo escrito en color rojo ha sido añadido o modificado