Taller REA con Scratch - Interacción. by julio cubillan

Agosto 2011 Versi贸n 1.0

Taller Diseño de REA con Scratch.

Guía de Trabajo 05 Interacción.

Contenido Contenido ................................................................................................ 2 Introducción. ............................................................................................ 3 Objetivos de la Actividad. ........................................................................ 3 Bloques de interés para los proyectos de esta Actividad. ...................... 3 Proyecto 1: Controlando objetos con el ratón: Sistema Digestivo. ......... 8 Primer paso: Preparación de los Objetos. ........................................... 9 Segundo paso: Programación del Objeto Robot. .............................11 Tercer paso: Programación del Objeto Texto. ..................................14 Mejorando el Proyecto con las Listas. ...............................................14 Proyecto 2: Controlando objetos con el teclado: Rescata Letras. ........24 Primer Paso: Preparación de los Objetos y el Escenario. .................25 Segundo Paso: Programación del Objeto Grúa. ...............................27 Tercer Paso: Programación de Las Letras. .......................................27 Proyecto 3: Uso del Micrófono: Globos. ................................................29 Descripción de la Variables. ...............................................................30 Descripción de los Objetos.................................................................31 Sinopsis. ................................................................................................32 Anexo A – Polígonos Regulares y No Regulares .. ¡Error! Marcador no definido.

Julio C. Cubillán M.

Página 2 de 33 15/08/2011

Taller Diseño de REA con Scratch.

Guía de Trabajo 05 Interacción.

Introducción. Uno de los atractivos principales de las tecnologías computacionales es, sin duda, la posibilidad de interactuar con los contenidos abriendo las posibilidades de registrar las respuestas del usuario y adaptando el comportamiento del REA de acuerdo a las reacciones del usuario a través de sus dispositivos de entrada. Tal vez, uno de las aplicaciones más expeditas sea la evaluación, sin embargo no debe perderse la vista a otras posibilidades como lo son la exploración, la instrucción y por qué no? El desarrollo de la creatividad. Este documento está orientado a desarrollar proyectos de tipo interactivo, entendiéndose como tal a aquellos que permiten la intervención del usuario en la dinámica del mismo valiéndose de los dispositivos de entrada del computador como lo son el teclado, el ratón, el micrófono y la cámara web. Se estará introduciendo también en este módulo a los efectos de sonido utilizando la biblioteca estándar de Scratch o sonidos externos bien sea grabados bajo la misma plataforma o importados en formatos mp3. Adicionalmente se estará trabajando con las estructuras de datos denominadas listas. En este módulo se asume que se han superado los módulos anteriores por con lo cual el lector deberá haber ganado ciertas competencias, de manera que se obvia la explicación de algunos programas o fragmentos de estos que, por ser abordados con anterioridad se suponen entendidos. Por supuesto que siempre es posible volver atrás o simplemente observar el código en los proyectos de ejemplo suministrados para refrescar lo aprendido.

Objetivos de la Actividad. Realizar REA interactivos utilizando contenidos del programa de primaria e incorporando efectos de sonido.

Bloques de interés para los proyectos de esta Actividad. A continuación se describen en detalle cada uno de los bloques se utilizarán en los diferentes proyectos de esta actividad. Julio C. Cubillán M.

Página 3 de 33 15/08/2011

Taller Diseño de REA con Scratch. Bloque

Guía de Trabajo 05 Interacción. Paleta

Sonidos

Sensores

Control

Julio C. Cubillán M.

Descripción Reproduce alguno de los sonidos incorporado en el objeto y continúa con la ejecución del programa. Puede seleccionarse dichos sonidos haciendo clic sobre el triángulo negro (▼). Reproduce alguno de los sonidos incorporado en el objeto al finalizar de reproducirlo, continúa con la ejecución del programa. Puede seleccionarse dichos sonidos haciendo clic sobre el triángulo negro (▼). Bloque de decisión que se incrusta en algunos bloque de control. Haciendo clic en el triángulo negro (▼), puede seleccionarse alguno de los objetos definidos en el proyecto. Cuando el objeto que contiene este bloque está tocando el objeto especificado con el triángulo negro, arroja un resultado “cierto” y “falso” en caso contrario. Bloque de decisión que se incrusta en algunos bloque de control. Este bloque detecta cuando un color de un objeto, en este caso el rojo, toca otro color externo (de otro objeto o del escenario) en este caso el gris. Cuando esto sucede devuelve “cierto”, en otro caso arroja un “falso”. Para cambiar los colores que compara el bloque, se hace clic sobre ellos y el cursor cambia su forma a gotero para seleccionar los colores respectivos. Bloque de decisión que se incrusta en algunos bloque de control. Arroja cierto cuando el nivel del sonido detectado por el micrófono sobrepasa el valor de 30, Este bloque se utiliza para encabezar programas los cuales se inician cuando se hace un clic sobre el Página 4 de 33 15/08/2011

Taller Diseño de REA con Scratch. Bloque

Guía de Trabajo 05 Interacción. Paleta

Listas

Julio C. Cubillán M.

Descripción objeto. Añade el valor que está el cuadro blanco a la lista. Al hacer clic al valor puede modificarse. También es posible insertar una variable en este espacio. Haciendo clic en el triángulo negro (▼), puede seleccionarse cualquiera de las listas definidas si el objeto donde se utiliza tiene acceso a la lista. Elimina el valor indicado en el óvalo blanco, este valor es el índice del valor a eliminar. Haciendo clic en el triángulo negro (▼) se despliega una lista con las opciones “1”, “último” y “todos”. También es posible insertar una variable en este espacio. Este es un hexágono de decisión para insertar en bloques donde lo requieren tales como “si”, “si sino”, “repetir hasta que”, entre otros. El bloque arroja un resultado “cierto” cuando el valor colocado en el rectángulo blanco está en la lista especificada y “falso” en caso contrario. Haciendo clic en el triángulo negro al lado del nombre de la lista (▼), puede seleccionarse cualquiera de las listas definidas, si el objeto donde se utiliza este bloque, si tiene acceso a dicha lista. También es posible insertar una variable en el rectángulo blanco. Este bloque inserta un elemento en una lista, tiene tres propiedades: La primera, un rectángulo blanco indica el valor a insertar en la lista, es posible incrustar una variable. La segunda propiedad es un óvalo blanco donde se coloca la posición en la lista donde se insertará el valor anterior. Haciendo clic en el triángulo negro (▼) se despliega una lista con las opciones “1”, “último” y Página 5 de 33 15/08/2011

Taller Diseño de REA con Scratch. Bloque

Guía de Trabajo 05 Interacción. Paleta

Listas

Julio C. Cubillán M.

Descripción “cualquiera”. La siguiente propiedad es el nombre de la lista. Haciendo clic en el triángulo negro al lado del nombre de la lista (▼), puede seleccionarse cualquiera de las listas definidas, si el objeto donde se utiliza este bloque, si tiene acceso a dicha lista. También es posible insertar una variable en el rectángulo blanco. Este bloque devuelve un valor determinado de una lista. Especificado en el óvalo blanco. Haciendo clic en el triángulo negro (▼) se despliega una lista con las opciones “1”, “último” y “cualquiera”. También es posible insertar una variable aquí. Haciendo clic en el triángulo negro al lado del nombre de la lista (▼), puede seleccionarse cualquiera de las listas definidas, si el objeto donde se utiliza este bloque, si tiene acceso a dicha lista. También es posible insertar una variable en el rectángulo blanco. Este bloque devuelve la cantidad de elementos que tiene una lista determinada. Este bloque reemplaza un elemento en una lista por otro, tiene tres propiedades: La primera, un rectángulo blanco indica el valor a reemplazar en la lista, es posible incrustar una variable aquí. La segunda propiedad es un óvalo blanco donde se coloca la posición en la lista donde se sustituirá el valor anterior. Haciendo clic en el triángulo negro (▼) se despliega una lista con las opciones “1”, “último” y “cualquiera”. La siguiente propiedad es el nombre de la lista. Haciendo clic en el triángulo negro al lado del nombre de la lista (▼), puede seleccionarse cualquiera de las listas Página 6 de 33 15/08/2011

Taller Diseño de REA con Scratch. Bloque

Julio C. Cubillán M.

Guía de Trabajo 05 Interacción. Paleta

Descripción definidas, si el objeto donde se utiliza este bloque, si tiene acceso a dicha lista. También es posible insertar una variable en el rectángulo blanco.

Página 7 de 33 15/08/2011

Taller Diseño de REA con Scratch.

Guía de Trabajo 05 Interacción.

Proyecto 1: Controlando objetos con el ratón: Sistema Digestivo. Antes de comenzar a desarrollar este proyecto, es recomendable descargarlo o ejecutarlo localmente o directamente desde la red. Desde una perspectiva general el proyecto está orientado a reforzar el tema del sistema digestivo. El robot da las instrucciones al usuario y permite explorar el sistema digestivo por una cantidad de segundos predefinida. La explicación de los diferentes órganos se despliega cuando se posiciona el cursor sobre cada uno. Al final se robot hace las preguntas y contabiliza los puntos en caso de que la respuesta sea correcta. Toda la coordinación de los objetos se realiza mediante mensajes entre objetos. En el proyecto se utilizan 3 variables globales y 14 objetos, las variables que deben ser accesibles desde todos los objetos (globales) y tienen las siguientes funciones: - Respuesta usuario: Almacena la respuesta del usuario al hacer clic sobre cada órgano y controla la secuencia de las preguntas. - Tiempo: Almacena la cantidad de segundos que se permite explorar al usuario. - Puntos: Acumulador de puntos por preguntas respondidas correctamente. A continuación describen las funciones, en términos generales que realizan los objetos del proyecto: - Robot: Da las instrucciones iniciales en la etapa de explicación, hace las preguntas, las evalúa y actualiza la variable puntos. - Droide: Da inicio a la etapa de exploración. - Texto: Muestra las instrucciones en la etapa exploración y la información de cada órgano cuando el cursor entra en contacto con ellos. - Órganos (estómago, hígado, esófago, etc.). En la etapa de exploración, activan la información pertinente en el objeto Texto cuando el cursor hace contacto con ellos.

Julio C. Cubillán M.

Página 8 de 33 15/08/2011

Taller Diseño de REA con Scratch.

Guía de Trabajo 05 Interacción.

En la etapa de evaluación, se utilizan para contestar las preguntas que hace el objeto Robot. Para entender el funcionamiento del proyecto es necesario identificar las tres etapas por las que pasa y se mencionaron en la descripción de los objetos: 1. En la primera que se denominará “explicación” El objeto Robot da las instrucciones iniciales, esta etapa termina cuando se hace un clic sobre el objeto Droide. 2. En la segunda, denominada “exploración”, los objetos Robot y Droide desaparecen mientras que el objeto Texto aparece. Los diferentes órganos, reaccionan al ser tocados por el cursor, provocando que el objeto Texto, despliegue la información pertinente. 3. La tercera etapa, denominada “evaluación”, reaparece el objeto Robot para hacer las preguntas, evaluarlas y cerrar la actividad.

Primer paso: Preparación de los Objetos. Los objetos de los órganos se definieron en base a la imagen del sistema digestivo descargada de internet, la cual se incorporó como un escenario y se colocó el título respectivo. Haga los cambios necesarios editando el escenario de manera que luzca como se observa en la figura 5.1. Figura 5.1 – El Escenario.

Julio C. Cubillán M.

Página 9 de 33 15/08/2011

Taller Diseño de REA con Scratch.

Guía de Trabajo 05 Interacción.

Puede descargar el proyecto SistemaDigestivo_base como punto de partida, solo contiene el escenario que se muestra en la figura 5.1.Logrado esto, se procede a crear un objeto por cada órgano copiando partes del escenario. Colocando el cursor sobre el escenario, se presiona el botón derecho del ratón y se selecciona la opción “Seleccionar región de la pantalla un objeto nuevo”. Figura 5.2 – Creando Objeto desde el Escenario.

El cursor asume la forma de cruz, listo para seleccionar una zona rectangular. Ubique el cursor en una de las esquinas y arrastre para seleccionar la zona. Al soltar el botón, el objeto queda creado con la zona seleccionada. Luego se edita el objeto recién creado dejando solo la imagen del órgano en cuestión. Se recomienda colocar nombres adecuados a cada objeto. Finalmente cada objeto se superpone sobre la imagen original del escenario, de manera que no se note la diferencia entre el objeto y el escenario. El procedimiento para la creación de estos objetos se muestra en el video denominado Creación de Objetos desde el Escenario, disponible en la página de esta actividad.

Julio C. Cubillán M.

Página 10 de 33 15/08/2011

Taller Diseño de REA con Scratch.

Guía de Trabajo 05 Interacción.

Respecto al objeto Droide, es creación propia y está disponible en el proyecto SistemaDigestivo_base.sb. Y en relación al objeto Robot, es una variación del objeto Robot1 de la librería estándar. A ambos objetos se le agregaron disfraces para realizar las animaciones. El objeto Texto, es muy fácil de construir, los contenidos textuales relacionados con instrucciones y descripciones de órganos se colocan en disfraces separados que activan convenientemente cuando reciben el mensaje adecuado. Los objetos Botón 1 y Botón 2, tienen la función de identificar los órganos que componen el tubo digestivo y las glándulas anexas respectivamente. Solo aparecen en la etapa de exploración y tienen un efecto de ser presionados al hacer clic sobre ellos (animación).

Segundo paso: Programación del Objeto Robot. Como se ha explicado anteriormente, la coordinación del comportamiento de todos los objetos se realizó mediante mensajes, enviados por cuatro (4) objetos, Robot, Droide, Botón 1 y Botón 2. Dado a que el objeto Robot define la secuencia del todo el proyecto, este será el primero en programarse. El objeto Robot contiene tres programas. Los dos primeros se activan con la bandera verde (Se ejecutan simultáneamente) el tercero con el mensaje “inicio” emitido por el objeto Droide. Los programas que se activan como la bandera verde son bastante sencillos el primero fija condiciones iniciales del objeto, mueve el objeto de un lado a otro, fija el disfraz “defrente” (es una modificación del disfraz original ) para comenzar a dar las bienvenida e instrucciones iniciales. El segundo programa que inicia con la bandera verde, el cual se ejecuta al mismo tiempo que el anterior, simplemente reproduce el efecto de sonido “computerbeep1” tres veces. Para utilizar los efectos de sonido o incorporar sonidos externos es necesario agregarlos primero al objeto que los utiliza, es por eso que es necesario importarlo. Para esto es necesario, activar el objeto Robot (haga clic sobre el objeto en la lista de objetos), luego debe hacer clic en la pestaña sonidos, luego hacer clic en el botón importar. Julio C. Cubillán M.

Página 11 de 33 15/08/2011

Taller Diseño de REA con Scratch.

Guía de Trabajo 05 Interacción.

Figura 5.3 – Importando Sonidos

Los efectos utilizados están en la carpeta “Electronic”. Importe, además de “computerbeep1”, “zoop” y “screech”, los cuales se utilizarán en la etapa de evaluación. Finalmente, la configuración de sonidos del objeto Robot debería lucir como se muestra en la figura 5.4. Figura 5.4 – Importando Sonidos para un Objeto

Julio C. Cubillán M.

Página 12 de 33 15/08/2011

Taller Diseño de REA con Scratch.

Guía de Trabajo 05 Interacción.

El programa que se muestra en la Figura 5.5 produce el efecto de sonido inicial, a la par del movimiento de lado a lado del Objeto Robot, La cantidad de Figura 5.5 – Efecto de Sonido

veces a repetir se obtuvo por ensayo y error, la idea es que terminara, justo cuando el Objeto Robot quede mirando al frente. Se utilizó el bloque “tocar sonido y esperar” para que el efecto son se sintiera

superpuesto cada vez se repite (haga el cambio con la instrucción “tocar sonido” para que sienta el efecto). El otro programa que inicia con la bandera verde, se deja al lector para desarrollar. El tercer programa, inicia cuando hace clic sobre el objeto Droide, éste emite un mensaje “inicio” que lo dispara, es por ello que está encabezado por un bloque “al recibir”, luego desaparece para dar lugar al objeto Texto que se

Figura 5.6 – Preguntas y Cierre

utilizará en la etapa de exploración que

termina

pasados los 120

segundos en la variable tiempo. Cuando reaparece para hacer las preguntas. Antes de cada pregunta, se fija la variable respuesta usuario con el valor “Nada” para que el usuario

seleccione

órgano

correspondiente haciendo un clic en él, El bloque “esperar hasta que” es el responsable de esto. Cuando se hace clic en algún órgano, se almacena el nombre correspondiente del órgano en la variable respuesta usuario para dar paso a la validación (bloque “si sino”) finalmente se Julio C. Cubillán M.

Página 13 de 33 15/08/2011

Taller Diseño de REA con Scratch.

Guía de Trabajo 05 Interacción.

vuelve a fijar el valor “Nada” a la variable para esperar otra respuesta, el grupo de bloques central mostrado en la Figura 5.6, debe repetirse tantas veces como preguntas se realicen haciendo las modificaciones particulares. Más adelante se mejorará este código utilizando listas. Los últimos tres bloques de este procedimiento, muestran los resultados de la etapa de evaluación.

Tercer paso: Programación del Objeto Texto. Este objeto contiene todo el texto relacionado con los órganos. La explicación de cada órgano está en un disfraz diferente, por eso es conveniente que el disfraz que contenga la información del estómago, tenga el nombre “estómago”; el que tenga la información del hígado, se llame “hígado” y así sucesivamente. Esto facilitará la programación del mismo. Este objeto funciona sobre la base de mensajes: por ejemplo, cuando recibe el mensaje “estómago”, cambia al disfraz que contiene la información del estómago, de manera que hay un programa que activa el disfraz correspondiente cuando recibe el mensaje que identifica al órgano correspondientes. En este caso son nueve disfraces, más el mensaje inicial que da las instrucciones para la etapa de exploración. En total son 13 programas que no se van a mostrar en esta sección con la intención de que el lector los desarrolle por sí mismo. Finalmente es necesario programar los dos botones que identifican los órganos del tubo digestivo y las glándulas anexas. Estos simplemente envían mensajes para que los órganos aludidos desplieguen el globo de texto que los identifica.

Mejorando el Proyecto con las Listas. Las listas son unos tipos de variables que pueden almacenar más de un valor a la vez, es decir una lista de valores, de allí su nombre. Al igual que las variables, las listas pueden ser locales o globales, globales cuando pueden ser manipuladas por cualquier objeto, incluyendo el escenario; mientras que son listas locales cuando pueden ser manipuladas solo por objetos que las contienen. Julio C. Cubillán M.

Página 14 de 33 15/08/2011

Taller Diseño de REA con Scratch. Figura 5.7 Definiendo Listas

Guía de Trabajo 05 Interacción. Existen un grupo de bloques especiales para manipular las listas, en principio no son visibles, pero cuando se crea la primera lista del proyecto aparecen automáticamente en la paleta de variables. El procedimiento para crear una lista es exactamente igual al de crear variables. En

este

caso

crearán

dos

listas:

preguntas y respuestas para los efectos no importa que sean locales o globales. Para tal fin es necesario hacer clic el botón variables de la paleta de bloques. Luego presiona el botón “Nueva lista” ubicado debajo de los bloques de variables, (Figura 5.7). Inmediatamente aparecerá la ventana emergente para definir una lista nueva (Figura 5.8), Nótese que la única diferencia con la ventana para definir variables es solo el título. Escribe el nombre de la lista

Figura 5.8 – Nombre de la Lista

(preguntas) en el campo y luego selecciones la opción “Para todos los objetos”. Esto creará una lista de tipo global. Es de hacer notar que estas opciones no aparecen si se crea una variable desde el escenario ya que en el escenario solo se crean variables de tipo global. Recuerde que la opción “para este objeto” se utiliza cuando la variable solo puede ser consultada o actualizada en el objeto en el se crea. Una vez creada la primera lista, entonces aparecen los bloques que permiten la manipulación de las mismas, tal como se muestra en la Figura 5.9 – Bloques de las Listas:

Julio C. Cubillán M.

Página 15 de 33 15/08/2011

Taller Diseño de REA con Scratch. Figura 5.9 Bloques de las Listas

Guía de Trabajo 05 Interacción. Después de los bloque de variables, en un color naranja oscuro, aparecen los diferentes bloques de las listas. La lista recién creada aparece en un óvalo naranja. También aparece en el escenario un cuadro gris con el nombre de la lista en la parte superior:

En la parte inferior del cuadro gris, se observa un símbolo “+”, este se utiliza para crear elementos en la lista, nótese que en medio se indica la longitud de la lista: Cero (0), porque no tiene elementos todavía (vacía). Al presionar el “+” aparece un cuadro naranja con el número 1:

Inmediatamente, el valor de longitud, se convierte en 1. Cada vez que se presione el símbolo de “+” se crea otro elemento y se van agregando otros cuadros naranja, los cuales se van numerando consecutivamente. Es importante resaltar que los elementos de la lista tienen un orden el cual se define, a través del número que se visualiza al lado izquierdo de la lista y se denomina índice. Julio C. Cubillán M.

Página 16 de 33 15/08/2011

Taller Diseño de REA con Scratch.

Guía de Trabajo 05 Interacción.

Los valores de las listas pueden modificarse haciendo clic sobre el cuadrado naranja y escribiendo el valor que se desea tener en ese elemento de la lista. También puede notarse que aparece una “X” al lado del valor seleccionado para modificar, el cual es utilizado para eliminar ese elemento. Finalmente, en la esquina inferior derecha del cuadro gris que representa la lista, hay unas líneas inclinadas, haciendo clic sobre estas líneas y arrastrando, puede modificarse el tamaño de la misma, en caso de que se requiera más espacio para visualizar los elementos. Con estas indicaciones pueden incluirse entonces todos los valores de la lista preguntas, además crear la lista respuestas en donde se almacenarán las respuestas a cada pregunta incluida en la lista preguntas. Es muy importante que los índices de las preguntas coincidan con los índices de las respuestas ya que es el elemento que relaciona, cada pregunta con su respectiva respuesta. En la Figura 5.10 se muestran las dos listas con sus respectivos contenidos. Figura 5.10 – Listas y sus Contenidos

Antes de continuar es necesario definir estas dos listas y sus respectivos contenidos. Se puede aprovechar la oportunidad para ingresar tantas preguntas como se quiera con sus respectivas respuestas, siempre y cuando, el índice de Julio C. Cubillán M.

Página 17 de 33 15/08/2011

Taller Diseño de REA con Scratch.

Guía de Trabajo 05 Interacción.

cada pregunta, coincida con el índice de cada respuesta ya que el algoritmo utilizado para presentar las preguntas y validar la respuesta utiliza este elemento para relacionar cada par pregunta – respuesta. A continuación se va a modificar el programa del robot que hace las preguntas y valida las respuestas, este es el que se encabeza con el bloque “al recibir inicio”, puede notar que hay una secuencia de bloque que se repiten con pocas modificaciones entre uno y otro (Figura 5.11) Figura 5.11 – Boque que se Repite

Este bloque se repetirá (con un bloque repetir) tantas veces como preguntas haya y los espacios marcados con rectángulos rojos serán sustituidos con bloques que permitan extraer la información requerida de las listas preguntas y respuestas. Antes de continuar, es necesario recordar el funcionamiento de los bloques que permiten manipular las listas a continuación se muestran nuevamente: Bloque

Paleta

Listas

Julio C. Cubillán M.

Descripción Elimina el valor indicado en el óvalo blanco, este valor es el índice del valor a eliminar. Haciendo clic en el triángulo negro (▼) se despliega una lista con las opciones “1”, “último” y “todos”. También es posible insertar una variable en este espacio. Este es un hexágono de decisión para insertar en bloques donde lo requieren tales como “si”, “si sino”, “repetir hasta que”, entre otros. El Página 18 de 33 15/08/2011

Taller Diseño de REA con Scratch. Bloque

Guía de Trabajo 05 Interacción. Paleta

Listas

Julio C. Cubillán M.

Descripción bloque arroja un resultado “cierto” cuando el valor colocado en el rectángulo blanco está en la lista especificada y “falso” en caso contrario. Haciendo clic en el triángulo negro al lado del nombre de la lista (▼), puede seleccionarse cualquiera de las listas definidas, si el objeto donde se utiliza este bloque, si tiene acceso a dicha lista. También es posible insertar una variable en el rectángulo blanco. Este bloque inserta un elemento en una lista, tiene tres propiedades: La primera, un rectángulo blanco indica el valor a insertar en la lista, es posible incrustar una variable. La segunda propiedad es un óvalo blanco donde se coloca la posición en la lista donde se insertará el valor anterior. Haciendo clic en el triángulo negro (▼) se despliega una lista con las opciones “1”, “último” y “cualquiera”. La siguiente propiedad es el nombre de la lista. Haciendo clic en el triángulo negro al lado del nombre de la lista (▼), puede seleccionarse cualquiera de las listas definidas, si el objeto donde se utiliza este bloque, si tiene acceso a dicha lista. También es posible insertar una variable en el rectángulo blanco. Este bloque devuelve un valor determinado de una lista. Especificado en el óvalo blanco. Haciendo clic en el triángulo negro (▼) se despliega una lista con las opciones “1”, “último” y “cualquiera”. También es posible insertar una variable aquí. Haciendo clic en el triángulo negro al lado del nombre de la lista (▼), puede seleccionarse cualquiera de las listas definidas, si el objeto donde se utiliza este bloque, si Página 19 de 33 15/08/2011

Taller Diseño de REA con Scratch. Bloque

Guía de Trabajo 05 Interacción. Paleta

Descripción tiene acceso a dicha lista. También es posible insertar una variable en el rectángulo blanco. Este bloque devuelve la cantidad de Listas elementos que tiene una lista determinada. Este bloque reemplaza un elemento en una lista por otro, tiene tres propiedades: La primera, un rectángulo blanco indica el valor a reemplazar en la lista, es posible incrustar una variable aquí. La segunda propiedad es un óvalo blanco donde se coloca la posición en la lista donde se sustituirá el valor anterior. Haciendo clic en el triángulo Listas negro (▼) se despliega una lista con las opciones “1”, “último” y “cualquiera”. La siguiente propiedad es el nombre de la lista. Haciendo clic en el triángulo negro al lado del nombre de la lista (▼), puede seleccionarse cualquiera de las listas definidas, si el objeto donde se utiliza este bloque, si tiene acceso a dicha lista. También es posible insertar una variable en el rectángulo blanco. Como el índice (posición en la lista) de cada pregunta coincide con el índice de cada respuesta, se utilizará una variable como contador con un valor inicial de 1 y un incremento de 1. Esta será la variable n la cual se inicializará en 1 para comenzar con la primera pregunta de la lista y se incrementará en 1 después de haber hecho cada pregunta. Eso significa que antes de comenzar con las preguntas deberá haber un bloque “fijar n en 1” y después de cada pregunta un bloque “cambiar n por 1”

A continuación, se incrustará el código (grupo de bloques de la figura 5.11) dentro de un bloque repetir, y el valor a repetir (óvalo blanco) se sustituirá por un bloque “longitud de” en el cual se seleccionará la lista preguntas. Julio C. Cubillán M.

Esto va a

Página 20 de 33 15/08/2011

Taller Diseño de REA con Scratch.

Guía de Trabajo 05 Interacción.

permitir que, si agregamos una pregunta más a la lista, con su respectiva respuesta, no sea necesario modificar este valor en el programa. Figura 5.12 – Modificaciones para usar Listas

En la Figura 5.12 se muestra el código incrustado en el repetir mencionado en el párrafo anterior, donde se han incluido los bloques para llevar el contador de las preguntas (“fijar n a 1” y “cambiar n por 1” al

principio

segmento

y al de

final

del

programa),

además se han dejado en blanco los espacios a sustituir con los datos de las listas. El espacio en blanco del bloque “decir” deberá ser sustituido por un bloque “ítem n de preguntas”.

Observe que el primer valor del bloque, ha sido sustituido por la variable n, esto permitirá que cada vez que se repita el ciclo, se seleccione de la lista preguntas el valor siguiente, ya que el valor de n irá incrementándose en 1, cada vez que se repita el ciclo. El siguiente valor a sustituir es el la respuesta correcta del bloque de comparación incrustado en el bloque “si sino” igualmente, se sustituye por un bloque ítem, pero esta vez seleccionando la lista respuestas, es decir, “ítem n de respuestas”.

Julio C. Cubillán M.

Página 21 de 33 15/08/2011

Taller Diseño de REA con Scratch.

Guía de Trabajo 05 Interacción.

Esto permitirá que la respuesta del usuario, almacenada en la variable respuesta usuario, sea comparada con la respuesta correcta correspondiente almacenada en la lista respuestas. El siguiente espacio en blanco a completar, corresponde al bloque “decir por” incrustado en la sección “sino” del bloque “si sino”. Se supone que en este instante, debe darse la respuesta correcta ya que la respuesta dada por el usuario está errada. De manera pues, es necesario construir la respuesta, uniendo el bloque “ítem n de respuestas” con el texto “ es la respuesta correcta.”

Al realizar todos los cambios descritos anteriormente, el programa completo debería lucir como se muestra en la figura 5.13. Figura 5.13 Programa Utilizando Listas

Otro de los bloques que se

puede

bloque

modificar

“cambiar

por”

para

ajustar incremento de manera tal

que

puntuación

consiga máxima,

una sin

importar cuantas preguntas se agreguen en la lista. Por ejemplo, si se desea que la puntuación máxima sea 20, entonces el incremento será:

dividido

entre

cantidad de preguntas que se realicen y eso se obtiene con un

bloque

“longitud

preguntas”, de manera que, sustituyendo tal división por el número 5 que aparece en el Julio C. Cubillán M.

Página 22 de 33 15/08/2011

Taller Diseño de REA con Scratch.

Guía de Trabajo 05 Interacción.

bloque “cambiar puntos por” puede ingresar cualquier cantidad de preguntas y la puntuación máxima siempre será, en este caso, 20. El tema de este proyecto es el sistema digestivo, sin embargo, aplicando el mismo procedimiento puede crear un REA con cualquier tema de manera sencilla, bien sea para reforzar o como proyecto para desarrollar con sus estudiantes, situación que considero de mayor provecho para el estudiante. Otras modificaciones pueden ser: 1. Completar los órganos que faltan. 2. Agregar algún efecto para identificar el órgano indicado cuando el usuario se equivoca. 3. Agregar voz a las explicaciones del objeto Robot. 4. Permitir al usuario ajustar el tiempo para explorar. 5. Complementar la manera de identificar los órganos resaltados por los botones “tubo digestivo”, “glándulas anexas” con animaciones. 6. Habilitar un botón que permita modificar las listas de preguntas y respuestas por el usuario.

Julio C. Cubillán M.

Página 23 de 33 15/08/2011

Taller Diseño de REA con Scratch.

Guía de Trabajo 05 Interacción.

Proyecto 2: Controlando objetos con el teclado: Rescata Letras. El primer dispositivo utilizado para los juegos sin duda fue el teclado y esta técnica no ha perdido vigencia. En Scratch esto es muy sencillo ya que en la paleta de bloque del control se consiguen bloques de encabezado denominado al “presionar tecla” con los cuales se encabezan programas que se ejecutarán cuando se presione determinada tecla.

El bloque anterior, está configurado para iniciar un programa al presionar la tecla de espacio. Nótese que la tecla puede ser cambiada haciendo clic sobre el triángulo oscuro (), de manera que en un objeto puede haber varios programas que reaccionan de forma diferente cuando se presionan diferentes teclas. En esta oportunidad el proyecto (rescataletras.sb) que se va a diseñar tiene como finalidad arrastrar unas letras que están en la parte de debajo de la pantalla para la parte de arriba donde formarán la palabra representada por una figura que está en la parte de arriba. Figura 5.14

Julio C. Cubillán M.

Página 24 de 33 15/08/2011

Taller Diseño de REA con Scratch.

Guía de Trabajo 05 Interacción.

Las letras se arrastran con la grúa verde, la cual se controla con las teclas de las flechas. Las letras se enganchan en la grúa presionando la letra “E”. Otra de las particularidades de este proyecto es que utiliza una lista llamada palabras que contiene las palabras con las que se va a jugar las cuales se eligen de forma aleatoria. Estas palabras están ordenadas de menor longitud a mayor longitud en la lista para facilitar el manejo de las letras de todas las palabras que están distribuidas en seis objetos, uno para cada posición o dígito de las palabras.

Primer Paso: Preparación de los Objetos y el Escenario. La preparación del escenario es bastante sencilla, consiste en colocar dos franjas, una naranja y otra azul tal como se muestra en la Figura 5.14, estos colores se utilizarán posteriormente en la programación de los objetos. Como se mencionó anteriormente, las palabras están ordenadas de menor longitud a mayor longitud en la lista palabras para facilitar el manejo de las letras que están distribuidas en seis objetos denominados Letra1, Letra2, Letra3, etc. uno por cada posición de la letra en la palabra. En cada objeto se distribuyen las letras de manera tal que, el índice de la palabra en la lista coincida con la posición del disfraz de cada letra en cada posición de acuerdo al siguiente cuadro: Cuadro 15.1 N

Lista Palabras

Disfraces de los Objetos Letra3 Letra4 Letra5 Letra6

Letra1

Letra2

1 OSO

2 OJO 3 PEZ 4 CASA

O P

J E

O Z

5 LORO

6 ABEJA

7 PERRO

8 PELOTA

Julio C. Cubillán M.

Imagen

Página 25 de 33 15/08/2011

Taller Diseño de REA con Scratch.

Guía de Trabajo 05 Interacción.

En la columna N, se identifica el índice de las palabras en la lista Palabras, este índice coincide con la posición de sus letras en cada uno de los objetos Letra1, Letra2, Letra3, etc. En las siguientes columnas se identifican los disfraces que deben tener los objetos y la posición que estos deben ocupar en cada objeto. Por su parte el objeto figura, debe contener las imágenes correspondientes a cada palabra, ordenaras de la misma manera. Esta distribución permite que al seleccionar un número aleatorio, el cual estará almacenado en la variable “n” se pueda relacionar cada palabra con los disfraces de cada una de las letras. A continuación debe crearse la lista Palabras y colocar las palabras que aparecen en la columna “lista palabras” del cuadro anterior, en el mismo orden en que están. Seguidamente deberán crearse los objetos Letra1 hasta Letra6 importando en cada uno los disfraces de letras en el mismo orden que aparecen en el Cuadro 15.1. Los otros objetos son las bolas amarillas, de las cuales se programará una y se clonaran las demás y el objeto figura que debe contener las imagenes correspondiente en el orden indicado en el Cuadro 15.1. Figura 15.5

Julio C. Cubillán M.

Página 26 de 33 15/08/2011

Taller Diseño de REA con Scratch.

Guía de Trabajo 05 Interacción.

Segundo Paso: Programación del Objeto Grúa. La programación de este objeto es muy sencilla, ya que contiene varios programas cortos que permiten controlarlo con el teclado y enganchar las letras, en este caso, se envía el mensaje “enganchar” a todos los objetos. La letra que esté tocando la grúa la seguirá hasta tocar la acera azul. La Figura 5.15 muestra los programas descritos. Podrá observar un programa adicional para ubicar la grúa en su posición inicial del juego.

Tercer Paso: Programación de Las Letras. La programación de las letras es muy similar, pueden clonarse, sin embargo lo ideal es que se programe una de ellas, se copien los programas a las otras letras y se ajusten una por una. En primer lugar es necesario que se tenga en cuenta que cada letra tiene una ubicación fija al lado de la figura, esta posición (coordenadas X y Y) deben fijarse expresamente. El otro aspecto importante es que dependiendo la posición de la letra en la palabra, esta interviene en la jugada o no. El primer programa, encabezado por el bloque “Al Presionar Bandera”, fija las coordenadas de la letra en la palabra y las almacena en las variables locales X y Y, también fija la variable enganchada en “no”, esta última variable indica si el objeto está enganchado a la grúa o no. Incluye también reducción del tamaño de la letra a 25% para ajustarlo a las dimensiones del escenario El segundo programa, encabezado por el bloque “Al recibir inicio”, debe detectar si está en la jugada, dependiendo de la posición de la palabra en la lista (véase Cuadro 15.1) en caso de que está jugando, debe ubicarse en la zona anaranjada de forma aleatoria y cambiar su disfraz al que le corresponde dependiendo de la palabra que fue escogida aleatoriamente y cuya posición en la lista está almacenado en la variable n. El tercer programa, encabezado por un bloque “al recibir enganchar”, detecta si está tocando la grúa, si no está no realiza acción alguna. Pero si está tocando la grúa entonces debe colocar el valor “si” en la variable enganchada, ejecuta un sonido “pop” y cae en un ciclo donde está detectando si el objeto toca el Julio C. Cubillán M.

Página 27 de 33 15/08/2011

Taller Diseño de REA con Scratch.

Guía de Trabajo 05 Interacción.

color amarillo (alguna de las bolas amarillas). Si este es el caso entonces debe desengancharse (fija la variable enganchada en “no”) y volver a la zona anaranjada. El cambio de valor de la variable enganchada puede utilizarse para salir del ciclo anterior. El cuarto programa, que se encabeza con el bloque “al recibir arrastrar”, simplemente fija la posición en dirección a la grúa y avanza dos pasos en esa dirección (siguiendo la grúa). Esta acción debe realizarla siempre y cuando la variable enganchada es igual a “si”. Este programa si es idéntico en todas las letras. El resto de los objetos se dejan para desarrollar por parte del lector, recuerde que siempre tiene la oportunidad de ver los programas en los proyectos suministrados. Siempre es interesante, comparar los desarrollos propios con los realizados por otros programadores para las mismas tareas. Algunas variantes para este proyecto pueden ser: 1) Agregue palabras nuevas al juego. 2) Incluya letras adicionales que, puedan arrastrarse igualmente, pero que se devuelvan a la zona naranja si no forman parte de la palabra seleccionada. 3) Incremento de velocidad de las bolas amarillas cada vez que pasa a un juego nuevo.

Julio C. Cubillán M.

Página 28 de 33 15/08/2011

Taller Diseño de REA con Scratch.

Guía de Trabajo 05 Interacción.

Proyecto 3: Uso del Micrófono: Globos. Este proyecto incorpora el uso del micrófono como dispositivo de interacción mediante uno de los bloques sensores denominado “¿sonido fuerte?”. El Juego comienza cuando un elefante, da las instrucciones para el juego, después de lo cual desaparece y comienzan a caer globos rojos movidos por el viento, Soplando sobre el micrófono se impulsa el globo para que caiga en la cesta. Los bloque de interés aquí son los mostrados en el cuadro siguiente: Bloque

Paleta

Sensores

Julio C. Cubillán M.

Descripción Bloque de decisión que se incrusta en algunos bloque de control. Haciendo clic en el triángulo negro (▼), puede seleccionarse alguno de los objetos definidos en el proyecto. Cuando el objeto que contiene este bloque está tocando el objeto especificado con el triángulo negro, arroja un resultado “cierto” y “falso” en caso contrario. Bloque de decisión que se incrusta en algunos bloque de control. Este bloque detecta cuando un color de un objeto, en este caso el rojo, toca otro color externo (de otro objeto o del escenario) en este caso el gris. Cuando esto sucede devuelve “cierto”, en otro caso arroja un “falso”. Para cambiar los colores que compara el bloque, se hace clic sobre ellos y el cursor cambia su forma a gotero para seleccionar los colores respectivos. Bloque de decisión que se incrusta en algunos bloque de control. Arroja cierto cuando el nivel del sonido detectado por el micrófono sobrepasa el valor de 30, Permite a un objeto recuperar algún atributo de otro objeto. Haciendo clic en el primer triángulo negro (▼), se selecciona el valor a recuperar, en el segundo triángulo negro (▼), se selecciona el objeto. Página 29 de 33 15/08/2011

Taller Diseño de REA con Scratch.

Guía de Trabajo 05 Interacción.

Se recomienda descargar la aplicación y jugar con ella antes de iniciar la lectura de esta sección (globos.sb). El proyecto cuenta con cinco objetos, 4 variables generales y un programa que lleva el control de toda la acción y reside en el escenario. Los objetos móviles utilizan, en vez de los bloques “mover” y “girar” (coordenadas polares, gráficos de tortuga), los bloques “ir a x y” (sistema de coordenadas) dentro de un ciclo indeterminado que calcula, cada vez, la nueva posición del objeto dependiendo del viento y la gravedad. A continuación se describen las variables:

Descripción de la Variables. Las variables X y Y son locales en cada objeto móvil y representan el incremento de desplazamiento del objeto en cada dimensión. La variable estado general del juego, cuando el valor de esta variable es “fin” indica que ha terminado el juego y los objetos responden a esto. La variable gravedad contiene una constante, que en este caso es 0.001 la cual se le va restando a la variable Y de cada objeto móvil en cada ciclo. Aumentando este valor las hojas y los globos caerán más rápido. La variable viento contiene un número variable que se calcula en cada ciclo y produce el movimiento horizontal de los objetos (se sustituye en la variable X de cada objeto móvil en cada ciclo) Este valor se calcula aleatoriamente entre -0.2 y 0.2 (los valores negativos producen movimiento hacia la izquierda). La variable globos es el contador de globos colocados en la cesta y está visible en el escenario. Antes de describir el comportamiento de los objetos, es importante recalcar que los colores tienen un papel importante aquí, por ejemplo el verde oscuro se utiliza para reventar los globos, el gris en contacto con el color rojo del globo se utiliza para detectar cuando éste debe entrar en la cesta y el verde claro se utiliza para detectar cuando las hojas han caído al suelo.

Julio C. Cubillán M.

Página 30 de 33 15/08/2011

Taller Diseño de REA con Scratch.

Guía de Trabajo 05 Interacción.

Descripción de los Objetos. El objeto cesta, es tal vez el más sencillo de programar, ya que solo requiere ser ubicado en un sitio aleatorio cuando inicia cada ciclo. Lo importante de este objeto es que su borde superior es de color gris, que permitirá al globo detectar cuando ha llegado a salvo a la cesta. Otro detalle de este objeto es que su punto de rotación ( punto del objeto que puede fijarse a través del editor de dibujos y se utiliza como referencia para su rotación y además es la intersección de sus coordenadas X y Y) debe estar en el centro de la figura, puesto que los globos rescatados, se acomodan aleatoriamente según este punto. Al inicio del juego la cesta debe estar en un lugar a la izquierda para dar espacio al elefante. El objeto elefante, aparece al principio del juego para dar las instrucciones y al final para el cierre, contiene dos programas que se disparan con los mensajes “instrucciones”

“fin”

respectivamente.

Ambos

programas

son

bastante

secuenciales e incluyen efectos de movimiento (cambios de disfraces). Los objetos hoja y hoja1, se activan cuando aparecen cuando reciben el mensaje “hojas” y aparecen después de un tiempo aleatorio corto, desde un punto, aleatorio también, superior del escenario. Luego caen en un ciclo que se detiene cuando su coordenada y es menor que -160. También detecta cuando está en alguno de los bordes laterales del escenario y lo traslada al otro borde para dar la sensación de continuidad. Las hojas dejan de aparecer cuando la variable estado es igual a “fin”. Estos objetos pueden ser clonados para darle mayor dificultad al juego. El objeto globo, por su parte se activa cuando recibe el mensaje “aparece”, el programa se desarrolla en tres fases, la primera define las condiciones iniciales, como los valores iniciales de X y Y, Posición inicial, dirección y disfraz inicial. La segunda fase es un ciclo indeterminado que se detiene cuando el color rojo del globo toca un color verde oscuro o un gris, entonces se calcula su nueva posición. La nueva posición de x, resultará de incrementar la posición con el valor de viento, mientras que la nueva posición de y, será resultado de incrementar la posición por la gravedad. Dentro del el ciclo, existe un bloque “si”, con un bloque “¿sonido

Julio C. Cubillán M.

Página 31 de 33 15/08/2011

Taller Diseño de REA con Scratch.

Guía de Trabajo 05 Interacción.

fuerte?” que detectan cuando se está soplando el micrófono, cuando esto sucede, entonces se incrementa el valor de la variable Y. La fase final de este programa, detecta si el globo salió del ciclo anterior por tocar un color verde, en tal caso debe explorar cambiando rápidamente de disfraces; o salió por tocar un color gris presente solo en el borde superior de la cesta, en este caso el globo se estampará en el interior de la cesta, recuperando las coordenadas de ésta mediante el bloque “valor de objeto” para finalmente desaparecer.

Sinopsis. Este documento está orientado a desarrollar proyectos de tipo interactivo, entendiéndose como tal a aquellos que permiten la intervención del usuario en la dinámica del mismo valiéndose de los dispositivos de entrada del computador como lo son el teclado, el ratón, el micrófono y la cámara web. El primer proyecto es un recurso que permite al usuario explorar el sistema digestivo y luego hace preguntas sobre lo explorado. Utiliza los mensajes entre objetos para coordinar el funcionamiento del proyecto en tres etapas, en cada etapa los objetos realizan varias funciones dependiendo de la etapa en donde se encuentra el usuario. Se introduce el uso de las listas, las cuales se definen como una variable que puede almacenar varios valores al mismo tiempo, los cuales almacena en un orden determinado asignándoles a cada valor, un número consecutivo, iniciando por uno (1), este valor se denomina índice. Las listas pueden ser globales si todos los objetos tienen acceso a ella, y local cuando solo el objeto que la contiene, tiene acceso a la lista en cuestión. De la misma manera, se introduce al uso de los bloques para consultar y manipular las listas. En este proyecto se hace énfasis en la técnica para descomponer una imagen en diferentes partes convirtiéndolas en objetos, con lo que es posible crear rompecabezas y efectos especiales. Julio C. Cubillán M.

Página 32 de 33 15/08/2011

Taller Diseño de REA con Scratch.

Guía de Trabajo 05 Interacción.

En el segundo ejercicio es un juego de completar construir palabras asociándolas con una imagen, las palabras son arrastradas por una grua al lugar donde se arma la palabra, pero debe pasar por una zona con obstáculos móviles. Aquí se hace uso de la interacción mediante el teclado, a través del bloque de encabezamiento “al tocar tecla”. La técnica consiste en crear dentro del objeto varios programas encabezados por este bloque, cada uno de los cuales provoca un comportamiento determinado en el objeto. Además se utilizan las listas para coordinar el comportamiento de los objetos involucrados, específicamente de las letras y la imagen relacionada. El tercer ejercicio, hace uso del micrófono para elevar un globo que viene cayendo e intentar hacerlo caer en una cesta, aquí se utiliza se detecta el nivel de ruido del micrófono con la condición “¿sonido fuerte?”, respecto al control de los objeto. Se utiliza un programa que reside en el escenario que controla todos los objetos en los diez ciclos del programa mediante mensajes y variables de control. Aspectos resaltantes de este proyecto lo constituyen la simulación de la gravedad y el viento mediante de variables que afectan la posición de los objetos móviles del proyecto. La variable gravedad afecta la coordenada Y, mientras que la variable viento afecta la variable X..

Julio C. Cubillán M.

Página 33 de 33 15/08/2011