Apuntes ESO Iniciacion a la programacién. Scratch. INICIACION A LA PROGRAMACION POR BLOQUES CON SoRA Toe ee CSO) 9 aramiremaharro Pagina 1 de 80Apuntes ESO Iniciacién a la programacién. Scratch. INDICE 1. Los lenguajes de programacion. Conceptos bisicos de programacion. . = 1.1. 2Qué es un lenguaje de progeamacion?. 1.2, Qué es un programa’ 1.8. ,Cémo programar una maquina? 6 2. 2Qué es Scratch?, 2.1, Crear una cuenta de Scratch, eet 2.2. Explorando la pantalla de inicio de Scratch 9 3. Entomo de programacion Scratch 3.1, Introduccion al entorno de programacion Scratch, - u 3.2, Entorno de programacién Scratch a fondo... S.2.1. Pestana Cédigo" 8.2.2. Pestaita “Disiruces” 17 8.2.8, Pestaita “Sonidos*... 4, Programar con bloques. Movimientos. . . 19 5. Creacién y modificacion de escenarios. 22 6. Objetos que interactian. 7. Preguntas y respuestas 8. Puntuaci6n. 9. Sonidos. indice de figuras - 29 Bibliograila y referencias. 30 BS eo acamisernanarro Pagina 2 de 90Apuntes ESO Iniciacion a la programacién. Scratch. 1. Los lenguajes de programacion. Conceptos basicos de programacion. 1.1. 2Qué es un lenguaje de programacion? Un lenguaje de programacion es tn sistema de comunicacion estructurado y diseriaco para que las ‘maquinas y los ordenadores se entiendan entre si y con los humanos. ‘Todo lenguaje de programacion se estructura en base & tres elementos. léxico, sintaxis y seméntica. El Iexico es el conjunto de palabras y simbolos vilidos en ese lenguaje conereto. La sintaxis es el conjunto de reglas que nos indica como combinar las palabras y simbolos en el lenguaje de programacion. ¥ por iiltimo, 1a gemntica es todo lo relativo al significado de una frase en un lenguaje. ‘asi los elementos listados a B us ti mismo O1. Bn el siguiente cédigo de un progeama identi continuacién forman parte del léxico, sintaxis 0 semantica del programa. WA>7AndB< 5Then ‘MsgBox (‘Acs mayor que 7 yB menor que S*) End If Sintaxis _Seméntica it a oOo a. > a a a MygBox a a a <5 a a a End it a a a WA>7AndB< 5 Then o a a Dentro del conjunto de lenguajes de programacion podemos distinguir dos tipos principales, Lenguajes de alto nivel: Son lenguajes alejados del obdigo maquina y cercanos al lenguaje humano (inglés, espaol, ete.) son mas ficiles de entender por cl programador. ya que su Iéxico, estructura sintactica y semntica es similar al lenguaje humano. Por ejemplo, Fortyan, Cobol, C, C++, Basic, Visual Basic, Scratch, ete, COS @aramireznaharro Pagina 8 de $0‘Apuntes ESO Iniciacion a la programacion. Scratch. Bue ‘ti mismo 02 Fijate en los siguientes extractos de obdigo de dos programas en lenguaje de progeamacién diferente. 2Qué similitudes ves con idiomas como el inglés o el espafol? gSerias capaz de entender, grosso modo, el proceso que desencadenan en el programa? ‘Visual Basic Scratch, Aunque no conozcamos el lenguaje de programacién, no resulta complicado adivinar qué hari el codigo al ejecutarse, Lenguajes de bajo nivel, Son similares al lenguaje maquina. © cddigo binario (0s y 1's). son de dificil comprension por el ser humano. Por ejemplo: lenguuaje ensamblador, lenguaje C. etc. PB use ‘ mismo 08. Observa el siguiente osdigo escrito en lenguaje C, zEres capaz de interpretar que haria este programa? No parece ficil, zno? Argumenta tu respuesta BSE cscamizeznanano Pigina 4 de $0‘Apuntes ESO Iniciacion a la programacién. Scratch. 1.2. gQué es un programa? Un programa es un conjunio de instruceiones creado de manera légica y ordenada en un lenguaje de ‘programacién conercto para proporcionar solueién « un problema dleterminado, En la definicion anterior de programa, esta implicita la definicion de algoritmo, ‘conjunto ordenado y finito de operaciones que deben seguirse para resolver un probleme a A) En tu opinion se puede considerar una receta wn algoritmo? Razona tu respuesta, B) Indica tres algoritmos que conozcas. Los algoritmos pueden expresarse de diferentes formas, grifica, texto, etc, La forma més habitual es el diagrama de flujo, que es un diagrama que describe un proceso, sistema o algoritmo informatice. A modo de curiosidad, veamios un algoritmo para cocinar un huevo. Figura 1. Algoritmo para cocina un huevo. Extratido de (http,//www.areatecnologia com) PARA SABER MAS. Si cstis interesado/a en ampliar tus conocimientos en relacién a los diagramas de flujo y quieres tener unas nociones sobre cémo se elaboran, puedes consultar la siguiente pagina web. hitp.//wwwareatecnologia com/diagramas-de-flyjoshtm. oc) @aramireznaharro Pagina 5 de $0‘Apuntes ESO Iniciaci6n a la programacién. Scratch. Un algoritmo también puede escribirse en pseudocddigo (also Lenguaje) que es una forma de escribir Jos pasos que va a realizar un programa de una forma cercana al lenguaje de programacién que vamos a utilizar posteriormente. En definitiva es como un falso lenguaje cercano a nuestro idioma y mas entendible que el lenguaje de programacion. Como curiosidad, échale un vistazo al ejemplo siguiente, Figura 2, Algoritmo escrito en pscudocddig PARA SABER MAS. Clicando en el enlace de la figura relucion a lo que es pseudoosdligo. En resumen, un programa es 1.Inicio 2.nicializar variables: A= 0,8 = 0 3.Solicitar ta introduccién de dos valores distintos 4.Leer los dos valores 5.Asignarios a las variables A y B 6.SIA = B Entonces welve a3 porque los valores deben ser distintos T.SiAsB Entonce Escribir A, Es of mayor 8.De lo contrarlo: Escribir B, “Es el mayor” 9.Fin_Si 10. Fin puedes incrementar {us conocimientos en la expresion de un algoritmo en un determinado lenguaje de 1.3. ,Cémo programar una maquina? El problema al que nos enfrentamos en programacién es que la maquina (el ordenador, autémata, etc.) soloentiende un lenguaje, el lenguaje maquina o cédigo maquina que “es el sistema de cédigos directamente interpretable por un circuito microprogramable, como el microprocesador de un ordenador, (Wikipedia). Ademis el codigo maquina es tinico y espevifico para cada maquina. A continuacién se puede ver un ejemplo de cétigo maquina. Wow Dx, 0108) Wow aK,O9 mr 2 Woy —aK,00 mer 21" TFC GT] Hola, locro 20 65 73 74 65 20 65 73-20 75 GE 20 70 72 GF 67 este es un prag loceD F2 61 &0 61 20 Ge 65 63-68 GF 20 65 GE 20 61 73| rama hecho en a loceo 73 65 6D 62 &C 6S 72 20-70 61 72 61 20 SC 61 20) Semoler para Ta [ocd 5? 63 68 63 70 65 64 69-61 24 Wikipedia Pagina 6 de $0Iniciaci6n a la programacién. Scratch. Entonces zcomo hacemos para que nuestro programa sea ejecutable por una méiquina? Para entender este proceso debemos definir tres conceptos nuevos, codificacion. cédigo fuente y compilador. Codificacién es el proceso de tradiccién de un algoritmo en pseudocddigo (fuse de codificacién) a un Ienguaje de programacién determinado. (Cédigo fuente es un algoritmo escrito en tn lenguaje de programacion Compilador es un programa informatico que lee el cédigo fuente y lo traduce a wn lenguaje maquina determinads. HI proceso de programacion de una maquina queda resumido en la siguiente figura. [csevoocdoico } (ean) pies ‘COMPILADOR Figua 3, Mapa conceptual, proceso de programacion de una maquina, Elaboracion propia. codificar, programa, B) ,Como relacionarias estos tres conceptos? C) El lenguaje maquina zesta mas cerca de un lenguaje de programacion de alto nivel o de uno de bajo nivel? BS eo acamisernanarro gina 7 de 90“Apuntes ESO Iniciacion a la programacion. Scratch. 2. Qué es Scratch? Scratch es un lenguaje de programacién de alto nivel, en el que las Srdenes se representan mediante bloques, y uniendo estos bloques podemos crear programas, A continuacion tienes a modo de ejemplo algunos bloques de Scratch, Scratch nos permite desarrollar juegos, animaciones y hacer programas # la ver, que nos sirve para expresar sentimientos, emociones y reflejar pensamientos ¢ ideas de una forma interactiva y creativa Ademas de los bloques de instrucciones, Scratch pone a nuestra disposicion dibyjos. sonidos y diferentes escenarios para completar juegos, animaciones y todo lo que seas capa. de imaginar y crear Se puede trabajar con Scratch online a través de la plataforma hitips//scraich mnil.ecu, También es posible trabajar de modo local en tu ordenador descargando e instalando la ultima version de Scratch disponible en https.//seratch mit edujdownload, Scratch 2.0. CURIOSIDAD, ;,Cuintos espaiioles hay en el MIT? En qué estan trabajando? Lee el siguiente articulo. hittps//www lavanguardia com/ciencia/20 1804 14/44253756204 2/investigadores-espanoles-mit tral CURIOSIDAD, lin qué se esta trabajando en el MIT? hitps,//youtuube/HIL1) EVILS 2.1. Crear una cuenta de Scratch Para crear una cuenta en Scratch seguirems los siguientes pasos 1. Entra en la web de Scratch littps//scrateh mit.edu 2.rincha en Eee 3. Completa el formulario de registro. (1) Nombre de usuario y contraseria (2) Fecha de nacimiento, género y pais. (8) Comreo clectrinico. BBODGL, 4 expioraro, Puedes ver un video presentacién sobre cémo crear una cuenta en Scratch en hitps//view.genial.ly/Se42505294a8d076497db6: 4, YATIENES UNA CUENTA Ei iscraich-crear-cuenta, Ya eres usuario registrado de Scratch, a partir de ahora cuando vayas a trabajar en la plataforma tendnis que Ee BS eo acamisernanarro Pagina 8 de 90‘Apuntes ESO Iniciacion a la programacion. Scratch. Figura 4. Iniciar sesion en Scratch. BE suse mimo 06 Facies win Vans «ear meses ppc cuca ce SOREL siguiendo el proceso indicado, Figura 5, Pestayia usuario Scratch. Desplegando 1a pestaiia de usuario tendris las opciones de acceder y configurar tu perfil, ver los proyectos en los que trabajas y colaboras (Mis cosas). configurar tu cuenta de Scratch o salir de la sesion de ‘trabajo con Scratch en la que estas. 2.2. Explorando la pantalla de inicio de Scratch Alacceder a Sractch nos encontraremos la siguiente pantalla. 9 0 Witmnemainee x Noticias de Seraten en Ome Serateh proyectos de inicio otros Scratchers ——— Figura 6, Pagina de inicio plataforma Scratch, BSE cscamizeznanano Pagina 9 de $0“Apuntes ESO Iniclacién a la programacién. Scratch. tn la que podremos realizar las siguientes acciones. 1. FEBS nos da acceso al entorno de programacién, trabajaremos con el mas adelante 2, EEE, accedemos a una pigina en la gue encontraremos diferentes proyectos y estudios realizados con Scratch categorizadosen animaciones, arte, juegos, etc. En definitiva, se trata de un repositorio. de proyectos y estudios Scratch categorizados. 3, BES te da acceso a diferentes tutoriales de 4, EESEEEY a través de esta pestana a qué es? ,Quién lo usa?, etc. cratch para la realizacion de animaciones y juegos, -cedens a otra informacion interesante en relacion a Scratch, 5, EEE para buscar en ef reposiorio de Scratch usando un citerio dado por elusuaio, por ejemplo “El cuerpo human 6. 2) aqui veris tos mensajes y comentarios de Scratch relacionados con Jos prayectos en los que ‘trubajas 0 colaboras. 7. [EI para acceder a “tus cosas* Scratch, proyectos y estudios en los que estas trabajando de forma compart o individual BE se meson KEIED ses nuregr yr as animacion gn itera ect yr otros usuarios de la plataforma. Selecciona un juego y una animacién que os interesen para compartirla con la clase. OS) aaramireznaharro Pagina 10 de $0“Apuntes ESO Iniciacion a la programacion. Scratch. 3. Entorno de programacion Scratch. 3.1, Introduccion al entorno de programacién Scratch. Accedemosal entorno de programacién de Scratch pulsando en [id y las éreas mas importantes que encontramos en el entorno de programacién son las mostradas en las figuras siguientes, Figura 8. Pagina entorno de programacién Scratch IL @aramireznaharro Pagina 11 de 30‘Apuntes ESO Iniciacion a la programacién. Scratch. F1 escenario tiene 480 puntos (pixeles) de ancho por 860 pixeles de alto y esti dividido en un plano cartesiano xe y, tal y como se muestra en La figura siguiente, El centro del escenario se corresponde con las coondenadas x - Oey -0. vy [ovoret80) Figura 9, Coordenadas cartesianas del escenario de Scratch. Analizamos a continuacion los diferentes comandos de la barra de ments. Caacion de un nuevo pecyecko Guardas. el proyecto en que estamos teabajando Guaad.as. una, copia del. proyecto Caagaa.en la Scaatch un pacyecko almacenado on tu PC Guctdan dl fchero en ts PC Figura 10, Comandos barra de ments entorno de programacion Scratch, EI iste comando nos da acceso a la pagina de nuestro proyecto que ver’in todos los usuarios de Scratch cuando Jo compartamos. Es aqui donde compartiremes con la comunidad Scratch las instrucciones, notas y créditos de nuestro juego por ejemplo. ¥ donde podremos obtener el enlace (CI ) para compartir muestra CREACION, @aramireznaharro Pagina 12 de 30FP} unites = © we © oF Figura 11. Pigina “Ver pagina del proyecto” Soratch. & Harlo tt mismo 08. Vamos a empezar la casa por el tejado. Imagina un juego o animacién simple, muy simple, no vamos a programar todavia. A continuacién, 1. Describe brevemente la dindmica del juegoo animacion, no mas de 5 lineas de texto. 2 Inventa un nombre original para tu juego o animacién, $ 1Cuailes son Las instrucciones que tienen que seguir los miembros de la comunidad Scratch para usar tu aplicacién? 4. Fscribe las “Notas y eréditos* de tu aplicacign para compartir con la comunidad Scratch. 8. Comparte tu aplicacion con la comunidad. 6 Genera un enlace para compartir tu aplicacisn y enviaselo a tu profesor. Continuamos conociendo Scratch, la barra de herramientas. Inician, aplicacion Con Detener. aplicacion de Figura 12. Comandos barra de herramientas entorno de programacion Scratch. @aramireznaharro Pagina 13 de 30‘Apuntes ESO Iniciacion a la programacién. Scratch. En el area de caracteristicas de objetos encontraremos los siguientes comandos. Nombac , dat selo a Mostear - Ceultar objeto eek) Elegie. aleatoriamente . . un objebo Dibyja manualmente Es un abjeko a Ege chico de x ola sien. tamaio Lista de Recon Ae Obj je en el. escenario Figura 18. Comandos *irea de objeto" entorno de programacion Scratch. Be resssmimeot Vamos a hacer nuestros “primeros pinitos* en Scratch, 1. Entra en tu cuenta Scratch. 2, Borna el objeto que aparece por defecto (el gato, logo de Scratch), 4, Duplica el obejto “Monet” y ponle un nombre original. 5. Cambia las siguientes caracteristicas de “Monet” 5.1, Duplica su tamaio, 5.2, Ponlo cabeza abajo. 6. Dibuja un cuadrado de fondo rojo en el escenario SD craramireznanarro Pagina 14 de 30Apuntes ESO Iniciacion a la programacién. Scratch. 3.2. Entorno de programacién Scratch a fondo. 3.2.1. Pestafia “Codigo”. Ya conocemos la interfuz de crateh, veamos como progeamar un objeto a través de las instracciones © comandos de programacién disponibles en Scratch y llamados bloques que encontraremos en la paleta de ‘bloques del area de programa, En la pestaiia encontramos 9 categorias diferentes de bloques. ©. Movimiento, controlan el movimiento, la orientacion, ete ©. Apariencia, permiton cambiar el disfraz, que un objeto sea o no visible, ete, © sonido, permiten la introduccién de sonidos controlando el timbre, la duracion y otras caracteristicas del sonido. ©. Eventos, para enviar un mensaje, indicar la accién a realizar al escuchar un sonido, ete © Control, estos bloques sirven para controlar la gjecucion del programa, permiten hacer que el programa avance hasta que reeiba una s ‘lal, incluir bucles de repeticion, et ©. Sensores, por medio de sensores podemes decirle al programa como reaccionar frente a las sefiales que detects, ©. Operadores, operadores matemiiticos y logicos para operar y establecer relaciones: © Variables, bloques para crear variables que usaremos en nuestro programa, ©. Mis Bloques, podemos crear nuestro propios bloques 0 afiadir extensiones disponibles en Scratch pulsando [ES por ejemplo, los bloques de la categoria “Lapiz” © 9 cualquier otro de la libreria de Scratch. Paramiremaharro Pagina 15 de 30Figura 14, Libreria de extensiones Scratch. Para conocer todos y cada uno de los bloques de todas las categorias de Scratch consulta ef anexo I, (Lopez Garcia, 2013), Este anexo es un documento de referencia que debes tener presente cuando empieces 4 programar a modo de guia rapida en la que consultar que hace cada uno de los bloques de programacién de Scratch, En Scratch vamos a encontrar tres tipos de bloques hisicos. Bloques para apilar (Stacks), son bloques encajables tipo puzle que pueden encajarse entre ellos formando pilas de bloques. En algunos de ellos puede introduciese informacion para contigurar la accion aque qjcttan, por ejemplo, AED , mcitcando e124" podentos cambiar coordenada xdel objeto enel escenario. ‘Sombreros (Hats), tienen la parte superior redondeada y se ubican siempre en la parte superior de las plas, Ejecutan la pila de bloques que tiene debajo cuando sucede aquello para lo que estan diseftados, por ejemplo. a ejecutari la pila de bloques que tiene debajo cuando pulsemos la bandera verde. Reporteros,estin disefiados para acoplarse en el rea de entrada de informacion de otros bloques. Hay dos tipos, de hordes redondeados GENES y de bores en punta GED, tos primeros sirven para informar al programa ntimeros y cadenas de texto ¥ los segues informan de valores booleanos (verstadero y falso), logicamente cada uno puede colocarse solo en otros blogues en los que el puzle encaja Y con estos blogues encajados programamos nuestras aplicaciones, acciones que ha de ejecutar un objeto, etc. Vearnos un ejemplo, @aramireznaharro Pagina 16 de 30Apuntes ESO Iniciaci6n a la programacién. Scratch. oo J LJ ©.-O Figura 15, Ejemplo de aplicacién Scratch Esta secuencia de comandes posiciona el objeto en el centro de la pantalla, lo mantiene en esa posicidn durante 5 segundos, lo mueve 100 pasos y en la nueva posicién el objeto dir “Hola* a través de un bocadillo. ‘También puedes incluir comentarios en los bloques pulsando el boton derecho sobre el blogue que quieras comentar. Esto fe permitira anotar aclaraciones a lo largo de un proceso de progeamacion complejo. Figura 16, Comentarios en bloques de programacién Scratch. 3.2.2, Pestafia “Disfraces". En la pestaila *Disfraces" podemos ver y editar los disfraces del objeto. Por ejemplo, nuestro amigo “Monet” dispone de 5 disfraces, nombrados de “Monet-a" a *Monet-* Disfhaces de objto "Monet Figura 17, Disfraces de un objeto, @aramireznaharro Pagina 17 de 30‘Apuntes ESO Iniciacion a la programacion. Scratch. 11 botdntige un disea, OD, nos ofrece las mismas posiilidades (comandos) que el hon “lige un objeto” visto en la figura 13. Comentaremos solo el comando EY que nos permite insertar como objeto lacaptura de la webcam de nuestro PC. 3.2.3. Pestafia *Sonidos". En la pestaiia "Sonidos" tenemos acceso a los sonidos que usaremos en la programacion, podremos modificar caracteristicas del mismo como velocidad de reproduccion, eco, volumen, ete, Ademis de crear y editar nuestros propios sonidos para usar en nuestros programas Scratch admite ficheros de sonido en formato MP3, WAV, Aly AU. Figura 18, Sonidos de un objeto. & Harlo tt mismo 10. Interpretamos cédigo. Interpreta que hace el siguiente eéxligo Scratch y clasifica los bloques empleados en la categoria correspondiente. @aramireznaharro Pagina 18 de 30“Apuntes ESO Iniciacion a la programacion. Scratch. 4. Programar con bloques. Movimientos. Pues bien, vamos a dar nuestros primers pasos en programacién con nuestro ya conocido allo. Programaremos un objeto para que nos salude, Realizaremos un ejemplo, paso a paso, vamos 1. Accede a tu cutenta Scratch y pulsa *Crear* para realizar tu primer programa en Soratch. 2, Nomibra tu proyecto. fit el text box “Titulo” escribe el titulo “Saludo* que sera el titulo identificador de tu programa, Pulsa "Guardar ahora” para que tu proyecto quede guardado, no olvides guardar cada cierto tiempo tu proyecto para no perder el trabajo realizado ante un problema en el PC. 3, Borra el gato de Scratch, vamos a cambiar de personaje. Ventana objeto > Selecciona el gato > Pulsa el aspa de la esquina superior derecha del objeto gato, 4, Selecciona el objeto “Kai, Ventana objeto “blige un objeto” + Categoria “Gente” > Objeto “Kai. Ya tenemos a Kai entre nuestros objetos y en nuestro escenario. Ve a la pestaita “Distraces* y comprueba los disfraces que tiene Kai, exacto, tiene 2 disfraces, kai-a y kai-b, 5. Vamos a ponerle un fondo, Ventana escenario “Elige un fondo" > Categoria “Interiores” > Fondo “Halle 6. Ajustar tamario del objeto al escenario, ‘Tachan! Ya estamos viendo a Kai en el hall de su instituto en el rea de escenario y visualizacion de programa, pero parece un poco grande, vamos 4 ajustar el tamaiio de Kai al 70% para que quede mas proporcionado, 7. Mas objetos. Introduzcamos en el escenario la pelota de basket de Kai, Ventana objeto “Elige un objeto” —> Categoria “Deportest > Objeto ‘Basketball’ 8. Y si introducimos algtin sonido, Pestaita “Sonidos* > «Elige un sonido” > Categoria “Deportes” > Sonido “Basketball bounce”, Reduce el tamaito de la pelota al 70% y haz que no sea visible en el escenario. ‘Ya tenemos todos los elementos de nuestro programa, objetos, escenario, sonidos. ete. 9, Programacion con bloques: Programemos arrastrando los bloques correspondientes al area de edicion de programas. Para Kai el programa consistiré en cambiar el distraza *kai-b’, se colocari en las coordenadas x ~ — 194 ey ~ -40 del escenario, esperané 1 segundo tras el cual se moverit 180 pasos a la derecha, en la nueva ", momento en el cual se dirigind a nosotros posicién esperard 1 segundo y cambiard su disfraz a +k: diciendo *iHola! ,Qué tal estais programadores?, “Soy Kai el mago”, +z0s lo demuestro?”, “2Quertis ver mi pelota de basket?*, todos los mensajes de Kai permanecerin en pantalla 5 segundos, Sonar el sonido “Basketball bounce" y aparevert la pelota de basket de Kai, objeto “Basketball", una ver, terminada esta secuencia se enviard el mensaje ‘mensaje 1" @aramireznaharro Pagina 19 de 30‘Apuntes ESO Iniciacion a la programacion. Scratch. figura 19, Primer programa en Scratch, movimiento y conversacion de objeto. Para la pelota el programa consistira en hacerse visible al recibir el mensaje “mensaje1" enviado por ee Figura 20, Primer programa en Scratch, cambio de propiedades objeto. Kai. Qué crees que ocurrini si quitamos los bloques activados por el evento “al hacer clic en P del objeto “Basketball”? No respondas en voz alta, apunta tu respuesta en un trozo de papel, Ja compartiremos con el resto de la clase después. ‘Ya solo nos queda comprobar el correcto funcionamiento del programa, para ello pulsamos * y comprobams que el resultado es el esperado y ambos objetos realizan todas las acciones programadas. En el siguiente enlace podemos ver el programa que hemos hecho en el ejemplo anterior ttps:/scratch mit.edu/projects/28402945 7). PB uw {ti mismo 11. Compartimos nuestra primera experiencia de programacion Scratch, Vamos a realizar un pequefto y ordenado debate en clase para poner en comiin nuestra primera experiencia tutorizada con Scratch. Respetamos los tumos de palabra de nuestros compaiteros y levantamos la mano para hablar. Las siguientes preguntas nos pueden servir de guia, ~ ge ha parecido dificil realizar este programa? ~ ,Crves que serias capaz de hacer tu propio programa similar al realizado? BS eo acamisernanarro gina 20 de 80‘Apuntes ESO Iniciacion a la programacion. Scratch. & Hazlo tt mismo 12. Continuamos programando, realiza el siguiente programa: 1. Crea un programa al que Hamaras “movimiento_raton”, 2, Hlimina el objeto “Cat” e introduce el objeto “Mouse 1". 3. Haz un programa para que el ratén describa un cuadrado de lado 150. Para ello partira de las coordenadas (-200,- 150). El ratdn se orientara hacia amriba y se movera deslizandose durante 3 segundos hasta la posicion (-50,0). La orientacion del ratin cambiar hacia la izquierda y se movers hasta la posicion (200.0). A continuaci6n, el ratén e orientard hacia abajo y se desplazara a la posicién (-200, -150), el raton ‘terminaré orientado hacia la derecha. © PISTA: Necesitaris todos los bloques que aparecen a continuaciém, algunos mis de una ver No olvides ordenarlos. A continuacion vamos a condicionar los movimientos de wn objeto a la pulsacion de determinadas teclas de nuestro ordenador, como intuyes esto ser bastante funcional para la programacién de juegos y otras aplicaciones. El ratdn se ha eaido a la piscina, Vamos a sacarlo de ahi usando los cursores de nuestro teclado, para ello asociaremos Ia flecha hacia arriba al movimiento ascendente del raton, y la flecha hacia abajo al ‘movimiento descendente del raton, 1, Crea un nuevo programa que llamaris *movimiento2_raton* 2. Inserta el objeto “Mouse” y el fondo de escenario “Pool, 8. Coloca el *Mouse1” en las coordenadas (0,180) del escenario, direcciin del objeto 0. 4, Para programar movimiento ascendente con xy movimiento descendente con W debemos de apilar Jos blogues siguientes. @aramireznaharro Pagina 21 de 30‘Apuntes ESO Iniciacion a la programacion. Scratch. Be snesott mimo 18. Te atreves con el siguiente reto, a) Programa el objeto “Mouse1” para ademas de los movimientos anteriores, las flechas derecha ¢ izquierda del teclado hagan que cl ratén se mueva a la derecha y a la izquierda, Intenta que el raton mire sierapre en la direccion en la que se mueve. b) gSerias capaz de aminar el raton de forma que simule con el movimiento de sus patas que esta andando? 5. Creacion y modificacién de escenarios. En todo juego que se precie encontraris diferentes pantallas. Pasaras de una pantalla a otra cuando ‘cumplas con todos los objetivos de la anterior. 2Qué es una pantalla en Scratch? Seguro que ya lo sabes, un escenario, Desde el area de escenario “Elige un escenario’ > *pinta*, podemos crear nuestro propio escenario, Figura 2 I, Herramientas para creacién de escenarios Scratch. Como ves las herramientas para crear escenarias son hustantes simples, ademds si colocas el puntero del ratén encima de alguna de ellas te aparece el nombre. La creacién de escenarios no es complicada y lo mejor es practicar para ver la utilidad de cada una de las hervamientas disponibles en la paleta de herramientas. BS eo acamisernanarro gina 22 de 80‘Apuntes ESO Iniciacion a la programacion. Scratch. PB uw ‘ti mismo 14. Practicand el uso de la paleta de herramientas de creacion de escenarios, Crea un nuevo proyecto y nombralo “mi_inslituto", queremos ver tu capucidad creadora para lo cual te pedimos que crees un escenario usando todos los comandos que est disponibles en espacio de creacién de escenarios de Scratch, el escenario representara la entrada a tu instituto. Y como deciamos al principio de este apartado, en un buen juego hay que cambiar de pantalla, vamos como se programa tn cambio de escenario (pantalla), B store nome 15, Crea un programa nuevo siguiendo las instrucciones siguientes. 1. Crea um nuevo programa y Ilémalo *cambio_escenatio” 2. Selecciona dos fondos. Hall 2° y “Room 1” 3, Selecciona el objeto “Avery walking”. En el escenario *Hall 2* (pantalla inicial) el tamatio de Avery sera 50%, Vamos a programar oddigo para que “Avery” se cologue al pulsar la bandera verde en las coordenadas (0. -6) del fondo *Hall 2%, Dotaremos a Avery de dos movimientos, derecha e izquierda con flechas correspondientes. Avery se moveriide 3 en 3 pasos tantoa derecha como a izquienda y apilaremos los bloques necesarios para que Avery de la sensacion de que esta andando (1o hace falta que la orientemos en la direccion del movimiento). Lo anterior ya lo hemos practicado en ejercicios anteriores. A continuacion viene lo nuevo, Cuando Avery egue a la puerta rodeada de rojo, entrara a la biblioteca (cambiara el escenario) se colocanti en las coordenacas (-180, -20) y st tamatio se incrementaré al 100%, Para resolver esta tiltima parte del program y ejecutar un cambio de escenario apila los siguientes bloques, BS eo acamisernanarro igina 28 de 80‘Apuntes ESO Iniciacion a la programacién. Scratch. Figura 22, Programacion cambios de escenarios Scratch. ‘Ya solo queda que comprucbes si Avery sigue moviendose en el segundo escenario (la biblioteca) con las flechas derecha e izquierda como habiamos programado, Para finalizar comprobemos que no nuestra animacion (juego) funciona correctamente, Pulsa Ver pagina de proyecto, asi es como veran los miembros de la comunidad Scratch tu programa, pulsa bandera verde y comprueba que todo lo programado funciona correctamente, Podéis acceder a la aplicacién completa en. hittps//scratch mit.edujprojects/284926069/ 6. Objetos que interactuan. Una de las acciones que nos faltan para programar un juego es que los personajes del mismo interactiien, vamos a ello. Practiquemos, que es la mejor y mas cémoda forma de aprender, Vamos a programar un juego en que un perrito Dog!" tiene que esqui por encima de él, siel perro toca el globo el juego acaba y aparece el mensaje “Game Over” ar un globo “Ballon 1" saltando Resolvamos el sigitiente programa *Coge el globo" en que sus protagonistas. "Dog" y *Ballon I" interact mos las instruceiones que se dan a continuacién. in, para ello s 1, Seleeciona de las librerias de Scratch los objetos “Dog 1", reduce su tamaite al 80% y “Ballon”, fija su tamaiio al 40%. 2, Coloca “Dog I” (0, -120) en las coordenadas y Ballon" (200, -120), al inicio del juego. 8, Selecciona de las librerias el fondo “Beach Malibu’ y busca un fondo, por ejemplo en pixbay com que cubra la pantalla Scratch completa ¢ indique *Game Over", fijalo como “fondo 2" y ndmbralo «Game Over 4, Vamos a programar con las instrucciones que se dan a continuacién, que el perro salte cuando pulsemos la flecha hacia arriba, Para ello, utilizaremos el bloque ‘al presionar tecla” de la categoria “Eventos"; ¥ el bloque *repetir” de la categoria “Control, en el que indicaremosun ntimero para que realice varias veces, un avance de pasos hacia arriba. Ademés cambiaremos el estilo de rotacién del objeto ratén de izquierda a derecha. A continuacion, selecciona el blogue *repelir” y, con el boton derecho del raton, elige la opeion “Dupli movimiento, en este caso “Hacia abajo”. Ten en cuenta que si cambiamos el niimero de pasos, conseguimos 1 para que el ratén pueda bajar En el bucle lo tinico que tenemos que cambiar es la direccién del que el salto que hace el ratén sea més 0 menos rapido, @aramireznaharro Pagina 24 de 305, Programa el siguiente codigo para que el globo aparezca en el otro extremo del escenario, Para ello, Jo ubicamos con unas coordenadas y lo giramos, para que mire al perro. A continuacién, lo hacemos andar de forma continua hacia el perro Ademis, queremos que ef globo, cuando Hegue al final del escenario, desaparezca y aparezca de nuevo en el lado derecho. 6. Programa el siguiente cédigo para cuando el globo toque al perro, se envie un mensaje de finalizacion del juego “iiBooom!!”, Este cédigo debes insertarlo en el objeto “Ballon”, 7. Cuando el programa reciba el mensaje *tiBooom!!”, el juego debe acabar y cambiar el fondo a *Gamie ‘Over’, Para ello debes seleccionar el escenario y programar el siguiente cbdigo. 8. Por tiltimo comprucha que el juego funciona correctamente. Para ello, pulsa el botin *Ver pagina del proyecto”. Puedes ver el proyecto finalizado en hit mit edu/projects/300739220). BSE cscamizeznanano gina 25 de $0‘Apuntes ESO Iniciacion a la programacién. Scratch. 7. Preguntas y respuestas. Hay un tipo de juegos que no hemos tocado todavia, los juegos de preguntas y respuestas tipo trivial Vamos a ello. Con Scratch podras crear tu propio juego de preguntas y respuestas, para lo cual necesitaris dos instrucciones que vas a encontrar en la categoria *Sensores’ *preguntar |...] y esperar” y “respuesta”, A trabajar... A continuacién programaremos un juego de preguntas y respuestas con tres simbolos eléctricos “derechos de 1. Realiza en Google la buisqueda *simbologia eléctricat, clige timagenes’, sherramienta uso", “Etiquetadas para utilizacién no comercial, ysabias que estas imagenes se pueden usar sin incurrir en delitos contra la proteccion intelectual? Descarga en tu ordenador los simbolos de toma de tierra, diodo ‘emisor de luz y resistencia variable, abrelas con Paint y reduce el tamario de st laclo mayor a 100 pixels. Las, aremos mas adelante, 2, Sube las imagenes anteriores como objetos a Scratch, Usa la opcién *Objetos* *Cargar objeto desde archivo’ 3. Cambia el nombre de los objetos por “LED”, “Resistencia Variable” y “Toma de Tierra". 4, Selecciona fondo en Scratch y escribe un encabezado como el siguiente *Simbolos eléctricos* Distribuye en el escenario los objetos a tu gusto. Una vez preparado todo, empezamos con la programacién, Simbolos eléctricos LL Anodo 4 Ctodo = ~yhe 5. Vamios a programar cada uno de los abjetos para que, cuando pulsemos sobre el simbolo, aparezca Ja pregunta en un bocadillo y se pueda escribir la respuesta en la barra de texto que se mostrar. Sigue los siguientes pasos, selecciona el objeto que vas a programar. En “Programas > Eventos" elige el bloque ‘al hacer clic en este objeto’. A continuacién, en la categoria “Sensores” selecciona el bloque “pregunta [...] y esperar’, En este bloque escribimos la pregunta, “ZA qué elemento pertenece este simbolo eléctrica™ Incorpora el bloque “si [...] entonces sino [...]" de la categoria “Control”, De tal manera que, si la respuesta es correcta, aparece el mensaje *Correcto’; y sino lo es, aparece “Error”, Introduce un operador para poder comparar la respuesta con Ia solucion correcta a Ia pregunta. Para ello, atiade el bloque respuesta de la c .goria *Sensores* dentro del operador @aramireznaharro Pagina 26 de 30‘Apuntes ESO Iniciacion a la programacion. Scratch. 6. Repite el codigo anterior para cada uno de los objetos. O bien, clickea y arrastra la pila de bloques hasta cada simbolo, De esta manera, solo tendras que cambiar la respuesta pant cada uno de los simbolos. 7. Por tiltimo comprucba que el juego funciona correctamente. Para ello, pulsa el botdn *Ver pagina del proyecto", Puedes ver el proyecto finalizado en https, scratch mit edu/projects/3007 44623) 8. Puntuacion. ‘Todo juego que se precie debe asignar puntuaciones a medida que se cumplan los retos condiciones del mismo. Todavia no hemos tratado este asunto y por tanto nuestro juego estarii un poco incompleto, programemios puntuaciones Vamos @ mejorar el juego del apartado 7, de preguntas y respuestas, incluyendo puntuacion, para ello sigue los pasos que se dan a continuacion. 1. Crea una variable, Debes la categoria “Datos de la pestaiia “Programas’. Pulsa “Crear una variable”, ‘Nombra la variable creaca como “puntes* y clica en la opcion “Para todos los objetos", de esta manera todos Jos objetos sumarin puntos. 2, Marca el recuadro que aparece a la derecha de la variable “puntos*, para que aparezca a modo de ‘cuuadrado de texto en el escenario de tu juego de preguntas y respuestas. puntos SD Simbolos eléctricos 3, Programa el siguiente cédigo para cada uno de los objetos del juego, de tal manera que, cuando acertemos una respuesta, sume 100 puntos y. cuando fallems, reste 50 puntos. Afiade a la programacién wn bloque inicial para que cuando se presione Ja bandera se inicialice la cuenta puntos, poniendo los puntos a cere. BSE cscanizeznanaro igina 27 de 80‘Apuntes ESO Iniciacion a la programacién. Scratch. 4. Por tiltimo comprucha que el juego funciona correctamente. Para ello, pulsa el botin *Ver pagina del proyecto”, Puedes ver el proyecto finalizado en https//scratch mit edu/projects/3007477 12). 9. Sonidos. Lo tinico que nos falta, en esta introduccién a Scratch, son los sonidos para poder hacer un juego ‘complete. Crearemos para practicar la introduccién de sonidos en Scratch, un juego que asocie un instrumento. a su sonido y al que lamaremos "Mi banda’, 1. En La ventana *Objetos* pincha en *Selecciona un objeto desde la biblioteca” y escoge la c Musica’, Sclecciona los objetos “Drum y “Trumpet’ 2, Haz. un programa como el que aparece a continuacion para que el lambor suene durante 3 segundos y Inego cambie su disiraz. 3. Programa para que la trompeta suene durante 3 segundos y cambie su disfraz, mientras esta sonando y cuando acabe de sonar vuelva al disiraz inicial a 4, Por tiltimo comprucba que el juego funciona correctamente. Para ello, pulsa el botdn *Ver pagina del proyecto", Puedes ver el proyecto finalizado en https, scratch. mit edu/projects/3007 49609). BS eo acamisernanarro gina 28 de 80‘Apuntes ESO Iniciacion a la programacion. Scratch. indice de figuras Figura 1, Algoritmo para cocina un huevo, Extraido de (Iitp/;www.areatecnologia com), Figura 2, Algoritmo escrito en pseudooddigo. Extraido de (httpy/www.areatecnologia.com)) Figura 3. Mapa conceptual, proceso de programacion de una méquina, Blaboracion propith nn Figura 4. Iniciar sesion en Scratch Figura 5. Pestaita usuario Scratch, Figura 6, Pagina de inicio plataforma Scratch. Figura 7. Pagina entomo de programacion Scratch I i Figura 8. Pagina entomo de programacién Seratch IL u Figura 9. Coordenadas cartesianas del escenario de Scratch Figura 10. Comandos barra de mentis entorno de programacién Scratch. Figura 1 1, Pagina “Ver pagina del proyecto” Scratch Figura 12, Comandos barra de herramientas entomo de programacion Scratch. 13 Figura 1. Comandos “Area de objeto" entomo de programacion Scratch 14 Figura 14, Libreria de extensiones Scratch. snes 1G Figura 15. Ejemplo de aplicacion Scratch. Figura 16, Comentarios en bloques de programacion Scratch. 7 Figura 17. Disfraces de un objeto. 7 Figura 18, Sonidos de un objeto. Figura 19, Primer programa en Scratch, movimiento y conversacion de objeto. sees 20 Figura 20, Primer programa en Scratch, cambio de propiedades objeto... Figura 2 I, Herramientas para creacién de escenarios Scratch, Figura 22, Programacion cambios de escenarios Scratch, oc) @aramireznaharro Pagina 29 de 30“Apuntes ESO Iniciacion a la programacion. Scratch. Bibliografia y referencias: Lopez, T, Arboledas, D,, Moreno, L, Gallego, V. y Muftoz, $. (2016) Tecnologie aplicada. I ESO. ‘Madrid. SM. Aula Facil. Cursos outline educative. 1.2 Programacién. Lenguajes de Alto y Bajo Nivel Recuperado el 16 de enero de 2019 de htips,/www.aulafacil. com/cursos/programacion/ Lenguajes de programacién - #1, Maol, M. (Director). (2018). [Video] Youtube, Recuperado el 16 de enero de 2019 de httpss www.youtube com/watch?y-fkiOskQbewMé&feature-youtube. Tecnologia (sf) Diagramas de flujo Recuperado cl 17 de ener de 2019 de itp /fwww areatecnologia comy/diageamas-de-flujo htm. Tecnologia (Sf). Diagnimas de flujo Recuperado el 17 de enero de 2019 de http.//www areatecnologia comin formatica/pseudocodigo html BS eo acamisernanarro gina 80 de 80