Pràctica 1. Creant els elements del joc

El joc que proposem és una variant del clàssic Simon. Quatre botons de color vermell, groc, blau i verd, reprodueixen una seqüència audiovisual que hem de memoritzar. Per fer-ho amb Scratch el més fàcil és crear 4 objectes, distribuïts com el joc i que tinguin aquest comportament programat. Els botons es podem dibuixar fàcilment amb l'editor de dibuixos. Una possibilitat és fer 2 cercles concèntrics i petits talls horitzontals i verticals, aprofitant que els podem emplenar amb una brotxa transparent. Després retallem cada botó.

Prement la tecla Majúscules podem fer cercles perfectes.

Podem jugar amb els botons de simetries de l'editor per anar replicant els diferents botons.

Us recomanem dibuixar un cercle gran i dibuixar un cercle petit de color transparent al centre i dos rectangles transparents horitzontals i verticals.

Per cada botó definirem un bloc de codi que detecti la pulsació del ratolí sobre l'objecte; respondrem amb un canvi d'aspecte gràfic i reproduirem una nota musical. Farem servir la peça 'al prémer …' de la categoria 'Control'.

Un efecte gràfic que podríem aplicar als nostres botons és 'transparent' que fa una mena de difuminat sobre el gràfic i sembla com si estigués il·luminat. Podríem pensar en l'efecte 'lluentor' però amb colors plans com els del dibuix no es destaca prou. Una vegada aplicat l'efecte gràfic hem d'esperar un temps per visualitzar i restaurar l'estat original. Aquesta acció és fa amb la peça 'treu els efectes gràfics' de la categoria 'Aspecte'.

El codi seria el següent:

Per fer l'efecte de la pulsació més evident ens podríem ajudar de les possibilitats de canviar la mida dels objectes. Mitjançant les peces 'augmenta … la mida' o 'fixa la mida a … %' de la categoria 'Aspecte' podem augmentar la mida del nostre botó temporalment creant un interessant efecte d'expansió. Per restaurar la mida original farem servir la peça 'fixa la mida a 100%'.

El codi per fer aquest efecte d'expansió seria el següent:

Només ens queda la part musical, que es pot resoldre ràpidament fem servir la peça 'toca nota … durant … pulsacions' de la categoria 'Sons' (rosa). Aquesta peça espera un número de nota i la durada d'aquesta nota. Per fer-ho més senzill podem escollir la nota desplegant un petit teclat de piano, que surt quan premem la fletxa del desplegable de la peça.

Escollim la nota:

Per la nostra pràctica farem servir les notes 60, 62, 64 i 65 (CDEF o Do Re Mi Fa). Es pot escollir l'instrument a reproduir amb la peça 'fixa l'instrument a …'. Prement sobre la fletxa ens sortirà una llista dels instruments disponibles. Farem servir un vibràfon, que correspon a l'instrument 12.

Escollim un vibràfon:

Com que la peça de tocar nota ja porta implícita una pausa el nostre codi només haurà d'activar els efectes gràfics, reproduir la nota i finalment restaurar l'aspecte gràfic.

El codi del botó verd serà el següent:

Podem posar comentaris al nostre codi fent servir el botó dret del ratolí sobre l'espai de les instruccions i escollint 'afegeix comentari'

Finalment haurem de replicar el codi per cada botó. Ho podem fer duplicant l'objecte, mitjançant el tampó o el botó dret del ratolí. Recordeu canviar la nota.

Les dues formes de duplicar un objecte:

Pràctica 2. Generant la seqüència

Hem de generar una seqüència que després haurem d'encertar. Per tant l'haurem de guardar en algun lloc per poder reproduir-la posteriorment. En principi necessitaríem una variable per cada element de la repetició. Si volem augmentar la dificultat del joc hauríem de crear tantes variables com la màxima seqüència que volguéssim fer servir. A més, quan volguéssim comprovar que la seqüència és correcta hauríem d'anar variable per variable comprovant els valors.

L'alternativa que funciona des de la versió 1.3 de l'Scratch és fer servir una llista. La llista és una estructura de dades que permet anar afegint dinàmicament elements. És a dir, pot anar creixent o minvant en funció de les nostres necessitats. A més es pot accedir a qualsevol element de la mateixa, mitjançant un índex. Simplement canviant aquest valor podem fer un recorregut per la llista i fer les comparacions que desprès necessitarem.

Les operacions amb llistes les trobarem a la categoria 'Variables' (color carbassa) i només seran visibles després de fer servir el botó 'Nova llista'.

Aquí teniu les diferents peces que trobareu quan feu una llista nova:

La primera instrucció afegeix un element al final de la llista. El següent grup d'instruccions permeten esborrar, afegir i canviar elements de la llista, donant la posició que volem modificar. També tenim una peça que ens permet accedir a un element determinat de la llista i una altre que ens diu la llargada de la llista, és a dir el número d'elements que té. A la versió 1.4 d'Scratch, es va afegir una peça que permet detectar si una llista conté un element.

L'índex per accedir o modificar la llista pot ser un número o també es pot indicar 'darrer' per accedir al darrer de la llista o en algun cas 'qualsevol' que retorna o accedeix a una posició a l'atzar dins de la llista. A la instrucció esborrar també trobarem 'tots' que permet buidar la llista.

Per generar la nostra seqüència anirem afegint mitjançant la peça 'afegeix … a …'. Ho farem tantes vegades com elements vulguem reproduir i el que posarem a la nostra llista seran els diferents colors dels elements. Farem servir un nombre a l'atzar entre 1 i 4 per triar el color i l'afegirem a la llista.

Una primera aproximació al codi per generar la llista amb 5 elements seria el següent:

La primera instrucció és buidar la llista; escollim 'esborra l'element tots de llista'. Després anem assignant els valors en funció del valor del nombre generat. Podem inspeccionar la llista marcant la casella que es troba al costat del nom de la mateixa. Noteu que podem manipular elements directament des d'aquest visualitzador. El botó '+' afegeix un nou element.

Proveu un altre mètode per emplenar la llista fen l'exercici 2

La flexibilitat de les llistes s'entén millor fent una modificació al nostre codi. Farem servir una variable que es dirà 'nivell' que ens indicarà la dificultat del joc. Com més elements tingui la llista més difícil serà de recordar. El nostre codi no varia pràcticament en res si fem servir aquesta variable. Només canviem el 5 per 'nivell'. Fer el mateix codi amb variables suposaria crear tantes variables com el màxim nivell que tinguéssim.

Ens falta construir el codi que agafa la informació de la llista i que reprodueix la seqüència. El que farem serà recórrer la llista variant l'índex i, amb el valor que obtindrem enviarem el missatge d'activació al botó. Recordeu que els nostres botons es diuen igual que els elements que hem afegit a la llista. És a dir si trobem 'VERMELL' hauríem d'enviar un missatge 'VERMELL' i el botó vermell respondrà il·luminant-se i sonant.

El codi per reproduir seria el següent:

Tenim un bucle que es repeteix tantes vegades com el nivell en el que estiguem. Simplement fitxem 'Index' a 1 al començar i anem incrementant el seu valor amb ''suma 1 a Index'. La clau d'aquest codi és la instrucció que envia el missatge. Accedim a l'element de la llista mitjançant la peça 'element Index de Llista' i enviem el missatge a tots els objectes del programa. Si fos, per exemple el 'GROC' seria equivalent a posar la peça 'enviar a tots GROC'. L'objecte 'GROC' respondrà canviant el seu aspecte i fent un so.

Per posar-ho tot en conjunt podem fer visible la variable Nivell amb un lliscador i afegir un botó de 'Començar'. Variant el valor del lliscador generem una seqüència nova. T

El botó 'Començar' genera la seqüència i desprès la reprodueix en funció del valor de 'nivell'. A més, hem introduït una variable que es diu 'Jugant' que ens indica si estem reproduint la seqüència o si estem esperant la resposta de l'usuari.

El codi del botó 'Començar' seria el següent':

Veurem en la propera pràctica la importància de definir aquesta variable per distingir l'estat del programa. Ara només ho farem servir per controlar que no es puguin prémer quan estem en la fase de reproduir la seqüència.

El codi modificat pels botons és el següent:

Hem fet algunes variacions en l'efecte del botó amb efectes 'ull de peix' i 'lluentor'.

Desa l'arxiu com M5Pràctica2.NomiCognom.sc.

Pràctica 3. Afegint la lògica de control del joc

Ja que tenim feta la part de reproduir la seqüència, només ens queda comprovar que el que juga ho està fent bé. Per això ho comprovarem cada vegada que premem un objecte que correspon a l'element de la llista que toca. Si no és així haurem de generar algun tipus d'error i tornar a començar. L'element correcte es pot extreure fent servir una variable 'Index' i consultant el valor de la llista. En el nostre cas hem canviat el nom de la llista, l'hem anomenat 'Ninos' i el codi seria:

Pots deixar el nom de la llista que tenies, no cal fer una llista nova.

Només caldria fer una comparació i decidir. Però l'Scratch no pot comprovar directament cadenes de caràcters. El problema es pot resoldre fent servir una variable intermèdia. En aquest cas li direm 'Nino' i veurem que la podem fer servir desprès per fer altres funcions.

El codi aproximat per l'objecte 'BLAU' per comprovar la seqüència seria aquest:

Si encertem, enviarem un missatge 'BLAU'. Aprofitarem que la variable 'Nino' té aquest valor. També canviarem la variable 'Index' per 1 per continuar comprovant la seqüència. Si fallem enviarem un missatge 'Perdut' que ja processarem.

El codi complet del nino 'VERMELL' seria el següent:

La variable 'Jugant', només s'activarà quan ens troben en el procés de comprovació de la seqüència, és a dir, jugant. D'aquesta forma evitem fer comprovacions quan aquesta s'estigui reproduint. És una forma d'aïllar els diferents estats del nostre programa.

Com que tenim tots els elements necessaris, podem crear la part principal del nostre joc. Hem d'inicialitzar les variables 'Nivell' i 'Jugant', generar la seqüència, reproduir-la i esperar la seqüència de resposta, és a dir la jugada. Si tot va bé, incrementarem el nivell. Aquest codi el podem posar a l'etapa del nostre projecte.

El codi principal seria el següent:

Hem posat un limit de 10 nivells i si l'aconseguim donem per guanyat el joc. Hi ha una sèrie de missatges com ara 'Ajuda' i 'Guanyat' que veurem després com es construeixen. Bàsicament són informatius per donar indicacions al jugador de com ho està fent.

Ara ens fixarem en el missatge 'Jugar'. El que s'ha de fer és establir el valor 1 a la variable 'Index' i esperar fins que sigui més gran que el nivell actual. Això voldria dir que aquest nivell s'ha aconseguit. Enviarem un missatge 'MoltBe' de caire informatiu i la jugada estarà feta.

El codi de resposta a jugar, també a l'etapa, serà el següent:

Ja tenim el joc pràcticament acabat. A l'etapa tindrem la part de generació, reproducció i control del joc. Cada objecte serà responsable de la part gràfica, el so, les pulsacions i la comprovació amb la seqüència generada. Només ens queda afegir un nou objecte que serà el responsable de donar les informacions al jugador. Escollirem el nostre estimat gat.

El nostre amic en acció:

El codi és molt senzill, simplement farem servir la instrucció 'digues … durant … segons' de la categoria 'Moviment'. En el cas de rebre 'Guanyat' o 'Perdut' aturarem tot el programa. Es podria fer una versió que tornés a començar però s'ha d'estudiar adequadament el fluix de missatges per no provocar una espera contínua en algun lloc del nostre programa.

El codi de resposta de 'Ajuda', 'Guanyat', 'Perdut' i 'MoltBe' és el següent:

El missatge 'Perdut' s'envia a l'objecte correcte per fer veure al jugador on s'ha equivocat. Potser es podria fer un efecte visual diferent quan es perd.

Desa l'arxiu com M5Pràctica3.NomiCognom.sb.

Exemple resolt:

https://scratch.mit.edu/projects/297410452/

Per si no trobes la manera de fer-ho. És una mica diferent de l'anterior.

Exercici 1. Diferents sons i diferents efectes

Obre l'arxiu M5Pràctica1NomiCognom.sb.

Prova amb sons en lloc de notes, els que vulguis (no pugis gaire els altveus).

També fes un vestit diferent per a cada color i efectes diferents a cadascun.

Desa l'arxiu com M5Exercici1NomiCognom.sb

Exercici 2.

Continua amb el fitxer anterior.

Aprofitant que es pot accedir a un element d'una llista a l'atzar, fent servir la instrucció 'element qualselvol de llista' es pot generar la seqüència d'una forma molt compacta i molt flexible.

Aquí teniu els elements necessaris:

Desa l'arxiu com M5Exercici2NomiCognom.sb.

Exercici 3. Joc automàtic

Aconseguir un joc totalment automàtic. S'ha de poder tornar al començament quan acabem el joc i afegir un control de temps mitjançant les peces 'reiniciar cronòmetre' i 'cronòmetre' per evitar un temps d'espera molt gran en les respostes. Podríem fer que si en 10 segons no es fa res donem el joc per perdut i es comença de nou.

Desa l'arxiu com M5Exercici3NomiCognom.sb