Este documento resume tres herramientas interactivas: Cuadernia, Jclic y Scratch. Cuadernia es una herramienta para crear cuadernos digitales educativos. Jclic es un entorno para crear y evaluar actividades educativas multimedia. Scratch es un lenguaje de programación para crear historias, juegos y animaciones. El documento explica cómo crear actividades en cada una de estas herramientas siguiendo pasos sencillos.

1. HERRAMIENTAS INTERACTIVAS
DANIELA NIETO
INSTITUCION EDUCATIVA EXALUMNAS DE LA PRESENTACIÓN
INFORMATICA
IBAGUÉ – TOLIMA
2017

2. TABLA DE CONTENIDO
1. INTRODUCCIÓN.
2. CUADERNIA
● Definición.
● Creación.
● Utilidad.
● Paso a paso para crear una actividad en cuadernia.
3. JCLIC
● Definición.
● ¿Para qué sirve?
● Componentes.
● Paso a paso para crear una actividad en jclic.
4. SCRATCH
● Definición.
● ¿Quien lo usa? y ¿Para que se usa?
● Antecedentes.
● Paso a paso para crear un juego en scratch:

3. INTRODUCCIÓN
Son buen educador sabe que los conocimientos adquiridos a través de la
experiencia y la búsqueda espontánea son tanto más duraderos como más
inspiradores para los estudiantes. Y con esto no me refiero únicamente a niños y
adolescentes.
También a los adultos les gusta sentirnos motivados a aprender.
Las herramientas interactivas, además de ser fáciles de utilizar para los instructores,
ofrecen al estudiantado un ambiente estimulante.
Hacer clic o no, navegar o no, reproducir o no un video… parecen decisiones
sencillas y muchas veces son poco valoradas. Sin embargo, el hecho de que un
estudiante sea quien tome el mando de su propio camino en un ambiente educativo
virtual es, por sí mismo, un estímulo importante a la hora de fijar los conocimientos.
A continuación verás algunas herramientas interactivas que te podrán ayudar en tu
vida cotidiana ya sea que estés en el colegio, trabajo o hobby.

4. CUADERNIA
● Definición:
Es una de las herramientas de acceso libre más novedosas y versátiles que existen
actualmente para la elaboración y presentación de material docente tanto por parte
del estudiante como del profesor.
● Creación:
Cuadernia es el resultado de varios proyectos de desarrollo innovadores que se han
generado en Castilla-La Mancha con el fin de cumplir con los estándares europeos
nacionales en creación de contenidos digitales (cf. Manual de Cuadernia).
● Utilidad:
Esta aplicación es utilizada para la creación de contenidos educativos que permite
crear cuadernos digitales de una extraordinaria calidad que bien pueden usarse en
red o impresos.
También permite trabajar al estudiante de manera rápida y cómoda con una gran
variedad de elementos que se pueden combinar en una misma página, tal y como
se observa en la imagen.
Sus aplicaciones en el campo de la enseñanza pueden ser múltiples, en este caso
Cuadernia se ha utilizado como complemento para una actividad de escritura.

5. ● Paso a paso para crear una actividad en cuadernia:
UNA VEZ QUE TENGAMOS INSTALADA ESTA APLICACIÓN, HACEMOS CLIC
EN “NUEVO CUADERNO”
1. Elegimos la carpeta “CUEDERNIA”
2. Escribimos el nombre que tenga nuestro trabajo, en este caso será
“CONSTELACIONES”.
3. Hacemos clic en “NUEVO”

6. AL OPRIMIR CLIC EN NUEVO NOS LLEVA “GESTION DE LAS PÁGINAS DE
CUADERNO”
1. Al iniciar el programa ya nos aparece creada la “página 1”.
2. Hacemos clic en “TEXTO” para agregar el título de la portada.
3. Aparecerá un cuadro con una frase “INTRODUCE TU TEXTO AQUÍ”
hacemos clic en la “i” para que se abra una nueva ventana en la que
podemos escribir nuestro título.

7. UNA VEZ QUE YA TENGAMOS LISTO NUESTRO TEMA CONTINUAMOS A
DISEÑAR
1. Elegimos el tipo, tamaño y color de nuestra fuente.
2. Escribimos el texto (el visualizador no permite ver todo el texto a la vez, no se
preocupen ya que luego vamos a ver como editarlo).
3. Hacemos clic en “GUARDAR” para ver como se ve nuestro trabajo.
POR EJEMPLO :

8. SI ES NECESARIO ACOMODAMOS NUESTRO TÍTULO Y SI QUEREMOS LE
PODEMOS AGREGAR UN SUBTÍTULO:
SI QUEREMOS PODEMOS AGREGAR IMÁGENES SIGUIENDO LOS
SIGUIENTES PASOS:

9. Hacemos clic en el botón “IMAGENES” para poner una imagen al fondo de nuestra
portada.
Aparecerá el icono de imágenes y igual que hicimos para introducir el texto, le
damos clic en “i” para que abra una ventana y así poder escoger nuestra imagen.
NOS APARECERÁ LO SIGUIENTE:
1. recorremos (haciendo clic) a la lista de carpetas y subcarpetas buscando una
imagen de fondo para nuestra portada.
2. Elegimos una de las imágenes que nos ofrece el programa.
3. Una vez que estamos seguros de que es imagen que deseamos hacemos
clic en “ACEPTAR”.

10. 1. Hacemos dos clic sobre el botón que está arriba a la derecha para dos veces
el nivel de la imagen y así permitir que nuestra imagen vaya dos capas hacia
atrás permitiendo visualizar el título y el subtítulo antes creados.
AHORA SIGUE COMPLETANDO TU PRESENTACIÓN
1. Hacemos clic en “GUARDAR” y procedemos a crear una nuestra segunda
página.
2. Haz clic en en siguiente icono para crear la página 2 en donde agregaremos
una breve reseña para mas contenido.

11. SE VERÍA DE ESTA MANERA:
Y PARA TERMINAR, DALE EN EL ICONO GUARDAR Y LISTO, YA REALIZASTE
UNA PRESENTACIÓN EN CUADERNIA
Si quieres agregar mas paginas para que tu presentación sea más larga recuerda
hacer clic en este icono.

12. JCLIC
● Definición:
Es un entorno para la creación, realización y evaluación de actividades educativas
multimedia, desarrollado en el lenguaje de programación Java Es una aplicación de
software libre basada en estándares abiertos que funciona en diversos entornos
operativos: GNU/Linux, Mac OS X, Windows y Solaris.
● ¿Para qué sirve?
Sirven para realizar diversos tipos de actividades educativas: rompecabezas,
asociaciones, ejercicios de texto, sopas de letras, algunas de ellas similares a las
trabajadas en el programa anterior y también sirve para visualizar y ejecutar las
actividades. Nos permite crear y organizar nuestra propia biblioteca de proyectos y
escoger entre diversos entornos gráficos y opciones de funcionamiento.
● Componentes:
*JClic applet: es un applet que permite incrustar las actividades JClic en una
página web.
*JClic player: un programa independiente que una vez instalado permite realizar las
actividades desde el disco duro del ordenador (o desde la red) sin que sea
necesario estar conectado a internet.
*JClic author: una herramienta de autor que permite crear, editar y publicar las
actividades de una manera más sencilla, visual e intuitiva.
*JClic reports: un módulo de recogida de datos y generación de informes sobre los
resultados de las actividades hechas por los alumnos.

13. ● Paso a paso para crear una actividad en jclic:
Vamos a tomar como ejemplo la realización de una sopa de letras.
1. Primero que todo vamos a descargar la aplicación
Escribimos en la barra de búsqueda de google “JCLIC” de este modo:
Le damos clic en la segunda página, la cual nos va a llevar a la página oficial de
jclic:

14. Nos aparecerá los 4 componentes de jclic, pero en este caso vamos a usar
“JCLIC AUTHOR”
2. Una vez descargado el programa, crea un icono de acceso directo en el
escritorio, abrelo dando dos clic rápidamente.

15. y luego dale en ejecutar
3. Nos enviará directamente al programa en donde le daremos nombre al nuevo
proyecto desde el archivo de la barra de herramientas

16. 4. Después de haber escribido en nombre de nuestro proyecto nos vamos air a
“ACTIVIDADES”
Nos aparecerá lo siguiente, en donde le vamos a hacer clic en la “carpeta” para
poder buscar la actividad que queremos realizar

17. Buscamos en la ventana ”TIPO DE ACTIVIDAD” sopa de letras y le ponemos de
nuestra actividad
5. Rápidamente nos aparecerá la configuración para la creación de sopas de
letras de este programa.
Si queremos una sopa de letras grande solo nos dirigimos a esta porte
y empieza a escribir las palabras que quieras que encuentre los
jugadores o espectadores en la parte que nos dice “PALABRAS ESCOJIDAS
”

18. 6. Y cuando ya hayas terminado de escribir todas las palabras de tu sopa de letras
dale en “REPRODUCIR”

19. Te aparecerá tu creación lista para jugar

20. SCRATCH
● Definición:
Es un nuevo lenguaje de programación que facilita crear historias interactivas,
juegos y animaciones y compartir sus creaciones con otros en la Web.
Scratch es una herramienta donde docentes, niños y jóvenes pueden expresar sus
ideas de forma creativa, utilizando un entorno de desarrollo que permite su
modificación, ampliación y evolución.
Debido a los tipos de usuario para este mediador, se buscó que fuera intuitivo,
utilizando casi un lenguaje natural, por medio de bloques de código
interconectables, que facilitan la programación; además que al tener una naturaleza
multimedial, permite la adición de imágenes y audios.
● ¿Quien lo usa? y ¿Para que se usa?
Es usado por estudiantes, escolares, profesores y padres para crear animaciones
de forma sencilla y servir de trampolín hacia el más avanzado mundo de la
programación.
También puede usarse para un gran número de propósitos educativos
construccionistas y de entretenimiento, como proyecto de ciencias o matemáticas,
incluyendo simulación y visualización de experimentos, conferencias grabadas con
presentaciones animadas, historias animadas de las ciencias sociales, arte
interactivo, música.

21. ● Antecedentes:
Scratch fue creado por el Lifelong Kindergarten del Media Lab en el MIT, a partir de
trabajos previos muy importantes: un lenguaje de programación orientado a objetos
llamado Smalltalk creado por Alan Kay en la década de los 70´s y que fue retomado
con Squeak, un lenguaje que incorpora una máquina virtual donde se facilita la
creación de ambientes multimediales y altamente interactivos.
También se reconoce el aporte realizado por Seymour Papert y su equipo, que
basados en el trabajo de Jean Piaget, realizaron el lenguaje Logo.
● Paso a paso para crear un juego en scratch:
Si no queremos trabajar con el gato de Scratch, vamos a eliminar el objeto que se
crea por defecto.
A continuación vamos a añadir un personaje, para lo que pulsaremos sobre el botón
Nuevo Objeto: Elegir un objeto desde la biblioteca. Navegaremos por la biblioteca
hasta la sección de Fantasía y elegiremos la bruja.

22. Primeros pasos
Ahora vamos a proceder a escribir los programas que controlarán los movimientos
del personaje. Lo primero que debe hacerse siempre con un personaje es indicarle
lo que debe hacer cuando comience a ejecutarse el videojuego. Así que vamos a
crear un programa que indique cuál es la posición de la pantalla en la que la bruja
debe aparecer cuando comience una partida.
Tal y como se muestra en la imagen, la posición horizontal de los personajes se
controla con la variable x del eje de coordenadas y su posición vertical se controla
con la variable y, teniendo como referencia que el centro de la pantalla es la
posición (0,0).
De esta forma, si queremos que la bruja aparezca siempre en el centro de la
pantalla (pos x = 0, pos y= 0) al comenzar la partida, podemos incluir los siguientes
bloques:

23. Fijaros en que hemos aprovechado para incluir un bloque que marca la forma en
que la bruja se moverá por la pantalla, indicando que solamente debe rotar de
izquierda a derecha, con el objetivo de que el personaje no se ponga patas arriba
cuando realice un giro.
Controlando el movimiento con los cursores:
Ahora vamos a introducir varios programas que van a permitirnos controlar el
movimiento de la bruja con el teclado. Lo que haremos será crear un programa para
que cada vez que el usuario que esté jugando pulse las flechas de los cursores
(izquierda, derecha, arriba o abajo) se modifique la posición de la bruja en
consecuencia.
Por tanto, cuando el usuario pulse, por ejemplo, la tecla flecha derecha tendremos
que aumentar el valor de la coordenada x para que se desplace hacia la derecha.
Sin embargo, cuando el usuario pulse sobre la tecla flecha izquierda habrá que
reducir el valor de la coordenada x para que se mueva hacia la izquierda. Y, de
forma equivalente, tendremos que hacer lo mismo para las posiciones verticales
modificando el valor de la coordenada Y. Por tanto, el código que controlaría el
movimiento de nuestra bruja sería el siguiente:
¿Has visto lo fácil que resulta controlar el movimiento de los personajes de nuestros
juegos? Sin embargo, para darle algo más de realismo vamos a hacer que la bruja

24. mire hacia la izquierda cuando se mueva en esa dirección y que mire hacia la
derecha cuando se mueva hacia este otro lado. Para ello , modificaremos
ligeramente el código de nuestros programas para incluir un bloque que controla la
dirección hacia la que apunta el personaje (90 para mirar a la derecha, -90 para la
izquierda):
Ya tenemos nuestra bruja moviéndose y cambiando de posición siguiendo las
órdenes del usuario.
Añadiendo nuevos personajes:
Ahora vamos a ponernos a trabajar con los dragones que la bruja debe esquivar
para poder seguir jugando. Así que lo primero será importar un nuevo objeto desde
la biblioteca.

25. Los bucles:
El código que controlará el movimiento del dragón es muy sencillo pero muy
interesante, ya que introduce el concepto de bucle. ¿Qué es un bucle? Pues un
bucle es un conjunto de instrucciones que se repite varias veces. Como nuestro
dragón va a estar constantemente moviéndose por la pantalla de lado a lado se trata
de una situación perfecta para usar un bucle. Echemos un vistazo al programa antes
de analizarlo:
Sencillo, ¿verdad? Lo que indica el programa es que, cuando el usuario pinche en la
bandera verde (es decir, cuando comience la partida), lo que debe hacer el dragón
es:
1. Fijar el estilo de rotación a izquierda-derecha. Como hemos visto, esto
significa que cuando gire, tan solo lo hará de forma horizontal y no vertical,
para que el dragón no se ponga patas arriba.
2. Entra en un bucle que se repite por siempre:
● Mueve dos pasos
● Comprueba si está tocando un borde. Si es así, rebota.
● Vuelve al comienzo del bucle, es decir, vuelve al punto 2.
Los condicionales
Con este código nuestro dragón estará constantemente moviéndose por la pantalla.
Ahora vamos a añadir un segundo programa al dragón, que se va a encargar de
controlar si el dragón está tocando a la bruja, ya que en ese caso se debe mostrar
un mensaje y terminar la partida. Para ello usaremos de nuevo un bucle repetir por
siempre:

26. En este código aparece un bloque condicional: si tocando a la bruja entonces… En
este tipo de bloques el código interno (en este caso formado por los bloques decir:
¡Te he cogido! y detener todos los programas) solo se ejecuta cuando se cumple la
condición, que en nuestro programa es que el dragón esté tocando a la bruja.
Disfraces:
Con el objetivo de darle más realismo al juego vamos a modificar ligeramente el
código del dragón para que vaya cambiando su apariencia y vaya echando fuego.
Para ello vamos a usar los disfraces, que se pueden entender como las distintas
representaciones de un mismo personaje (algo similar a cuando un actor de una
película cambia de vestuario).
Así si nos vamos a la sección de disfraces del dragón podemos comprobar que
tiene dos disfraces preparados.

27. Para indicar al dragón que vaya cambiando de disfraz constantemente podemos
utilizar el siguiente bloque, que hace uso de un bucle por siempre, un bloque de
cambio de disfraz y un bloque esperar, para que el cambio no sea demasiado rápido
Duplicando personajes:
Una vez que el dragón está listo, lo que vamos a hacer es duplicar el objeto para
tener otro dragón más. Este nuevo dragón tendrá exactamente el mismo
comportamiento sin tener que volver a escribirlo. Pinchando con el botón derecho
sobre el dragón en el área de personajes nos aparece la opción “Duplicar”, que crea
un nuevo personaje que es una copia exacta con todos sus programas.
Recogiendo recompensas:
Para terminar el juego, ahora tenemos que importar el objeto estrella que la bruja
tratará de ir cogiendo para sumar puntos:
El comportamiento de la estrella que deseamos es el siguiente: queremos que
aparezca en un punto al azar de la pantalla y que, cuando sea tocada por la bruja,
desaparezca y aparezca en otra posición al azar de la pantalla. Éste es el programa
que implementa ese comportamiento:

28. Como se puede comprobar, aparecen de nuevo muchos bloques que ya
conocemos: al presionar la bandera verde, bucle repetir por siempre, un bloque
condicional para ver si está tocando al objeto bruja… Quizás el bloque más
complejo de entender es el que controla la posición a la que debe moverse la
estrella, que es un número al azar entre -230 y 230 para la posición X y un número
al azar entre -170 y 170 para la posición Y, lo que hace que la estrella aparezca
cada vez en un sitio diferente de la pantalla.
Sumando puntos:
Como el objetivo del juego es sumar el máximo número de puntos posibles, es
necesario contar con un marcador que se vaya actualizando cada vez que la bruja
toque a la estrella. Para ello debemos irnos a los bloques de la categoría Datos y
crear una nueva variable que llamaremos Puntos. Al crear la variable nos
aparecerán nuevos bloques que podemos utilizar para actualizar su valor. Así,
cuando comience el juego siempre tendremos que darle a la variable puntos el valor
0; y cada vez que la bruja toque la estrella tendremos que modificar su valor para
sumar un punto más. Por eso este tipo de bloques, que guardan datos, se llaman

29. variables, porque su valor varía a lo largo de la partida. El código de la estrella
quedará tal y como se muestra en la siguiente imagen, en la que ya se han incluido
los bloques relativos al control de la variable:
Modificando el fondo:
Si has llegado hasta aquí, ¡buen trabajo! Ya tienes tu videojuego listo y funcionando.
Aunque quizás, para darle algo más de vistosidad, podríamos modificar el fondo de
la pantalla para que se muestre otro más apropiado. Para ello pulsaremos sobre el
escenario (bajo la ventana de objetos), nos iremos a la pestaña Fondos (similar a
los disfraces de los objetos pero para el escenario) y pulsaremos sobre el botón
Fondo nuevo: Elegir un fondo desde la biblioteca.

30. Y elegiremos, en la sección Espacio de la biblioteca, el fondo Stars:
Ahora sí, ¡enhorabuena! Tu videojuego está listo para guardar y compartir con quien
quieras a través de la web. ¿A que ha resultado mucho más fácil de lo que se podría
esperar en un principio? A partir de ahora, el límite lo marcas tú con tu imaginación.
Esperamos que este solo sea el primero de una larga lista de proyectos. Eso sí, no
dejes de contarnos cómo te va y de compartir con toda la comunidad tus avances.
CONCLUSION:
Pienso que es muy útil aprender sobre las diversas herramientas interactivas ya que
estas nos ayudan a facilitar nuestro desarrollo de motricidad y son muy necesarias
en la vida laboral y educativa.
De hoy en adelante se me será más fácil desarrollar cualquier actividad de
interacción gracias a las consultas que he realizado durante la elaboración de este
trabajo.

31. WETGRAFIA:
https://sites.google.com/site/scratchworld10/home/2---historia-de-scratch
http://aprendeenlinea.udea.edu.co/boa/contenidos.php/8ed5f60e3a91fc079829
b195175d4e42/931/estilo/aHR0cDovL2FwcmVuZGVlbmxpbmVhLnVkZWEuZWR
1LmNvL2VzdGlsb3MvYXp1bF9jb3Jwb3JhdGl2by5jc3M/1/contenido/
http://blogs.ua.es/gonzalo/2009/04/12/%C2%BFque-es-jclic/
http://www.ite.educacion.es/formacion/materiales/137/cd/m4_recursos_educati
vos/jclic.html
http://cuadernia.educa.jccm.es/
http://cuadernialaurita.blogspot.com.co/p/que-es-cuadernia.html
https://es.scribd.com/doc/80304917/Que-Es-Cuadernia