💾 Archived View for gamifi.cat › blog › 2016-09-16_BJC_3 › index.html captured on 2023-05-24 at 19:56:44.
⬅️ Previous capture (2023-03-20)
➡️ Next capture (2024-02-05)
-=-=-=-=-=-=-
<!doctype html>
<html lang="ca">
<head>
<meta charset="utf-8">
<meta name="keywords" content="blog, cultura lliure, internet, programari lliure, snap, gemini, fediverse, llengua catalana, catala" />
<title>Curs BJC 2: Exercicis - Gamifica't!</title>
<link rel="stylesheet" href="../../static/style.css">
<link rel="shortcurt icon" type="image/svg" href="../../img/favicon.svg" />
</head>
<body>
<header class="header">
<a href="#main" class="skip">Salt al contingut</a>
<a href="../../" class="logo" ><img src="../../img/logo.svg" width="300" heigh="60" alt="Logo Gamifica't"></a>
<nav class="header-right">
<a href="../">Blog</a>
<a href="../../projectes/">Projectes</a>
<a href="../../glossari/">Glossari</a>
<a href="../../contacte/">Contacte</a>
<a href="../../blog.xml" class="logo" ><img src="../../img/rss.png" width="32" heigh="32" alt="RSS Gamifica't"></a>
</nav>
</header>
<main id="main">
<div class="page">
<div class="blog-post">
<h1>Curs BJC 2: Exercicis</h1>
<p class="meta">2016-09-16</p>
<p>Snap! Ă©s un llenguatge de programaciĂł amigable per a no programadors i, com veurem en aquesta segona setmana del curs, permet personalitzar blocs. Fer-ho ens ajuda a estalviar feina, ja que els blocs personalitzats poden actuar com a funcions recurrents que podem cridar quan les necessitem.</p>
<p>Aquesta setmana se’ns parla de funcions (domain & range) i dels tipus de blocs a Snap! o Scratch (command -blocs rectangulars-, reporter -blocs rodons-, predicate -blocs punxeguts). La lectura de la setmana Ă©s el primer capĂtol de Blow to bits (2008).</p>
<p><a href="../2016-09-10_BJC/index.html">Continguts del curs BJC</a></p>
<h2>Recordatori</h2>
<p>Per il·lustrar la creaciĂł de blocs, continuem amb els polĂgons. A la primera setmana del curs, se’ns animava a dibuixar quadrats i triangles. Ara bĂ©, podem, directament, programar una figura a la que poder-li canviar la mida en qualsevol moment. Per fer-ho, elaborarem el nostre propi bloc. I Ă©s molt xulo! Veiem-ho!</p>
<p>Si recordem el quadrat que vam fer la setmana anterior, el bloc blau de moviment ens indicava el nombre de passos, Ă©s a dir, la mida del quadrat. Si en posem 50, surt petitet, si en posem 100, ja surt mĂ©s gran… I aixĂ, anar fent. La cosa Ă©s que si ara vols fer un quadrat gran i, cinc minuts desprĂ©s, un de petit, haurĂ s d’escriure el codi dues vegades i perdrĂ s molt de temps…I diuen que els programadors sĂłn tant mandrosos que s’inventen el que faci falta per estalviar-se feina. Què carai! Clar que sĂ! Que treballin les mĂ quines! ;)</p>
<h2>Deures 1: inputs</h2>
<p>I aquest és el truc: fer-te el teu propi bloc de quadrat amb un nombre que puguis canviar quan vulguis. Per començar, haurem d’anar a Snap! Podem treballar online però si volem desar els canvis als projectes, ens haurem de registrar amb el nostre mail. Si acabes d’aterrar, potser t’interessa fer una ullada al tutorial introductori a Snap!</p>
<p>De fet, al tuto, hi ha tres entrades relacionades amb polĂgons i creaciĂł de blocs. Un cop ja sabem com dibuixar un quadrat, podrem reciclar els blocs de codi del quadrat per crear un bloc propi que dibuixarĂ un quadrat. NomĂ©s cal entendre la lògica dels polĂgons (passos i graus) per crear qualsevol polĂgon, aixĂ que podem modificar graus i costats per crear triangles, hexĂ gons, octògons, etc. A mĂ©s, com hem vist creant blocs propis, tambĂ© podem afegir ranures de mida als blocs per poder controlar la grandĂ ria d’un polĂgon.</p>
<p><img src="../../img/snap/blocs-crea-bloc-dibuixa-triangle-editor.png" alt="blocs-crea-bloc-dibuixa-triangle-editor" /></p>
<p>L’objectiu final d’aquest primer exercici prà ctic és aconseguir un sol bloc per dibuixar una caseta. Aquest nou bloc de la caseta serà possible grà cies a dos blocs que haurem creat abans: el del quadrat i el del triangle. Posant el triangle damunt del quadrat obtindrem la caseta i, si posem moltes casetes, dibuixarem un poblet :)</p>
<p>Per tal de trastejar un nou bloc d’Snap!, el de “repetir fins que”, se’ns proposa dibuixar casetes fins a una posició determinada de l’escenari. Aquà va bé repassar una mica de què van les coordenades, que són imprescindibles per situar els objectes a la pantalla o escenari. A més, a l’entrada de les coordenades, també trobem un exemple d’ús del bloc “repetir fins que”.</p>
<p>Quan tinguem les coordenades controlades, ens serà fà cil dir-li al bloc “repetir fins que” que es dibuixi les casetes fins on vulguem. Si tenim temps, ens animen a crear un hexà gon i, un cop creat, a dibuixar un rusc! Perquè faci la figura del rusc s’ha de jugar una mica amb els graus de gir… sinó, dibuixarà un hexà gon sobre un altre…</p>
<h2>Deures 2: polĂgons</h2>
<p>DesprĂ©s se’ns proposa un altre exercici: crear un bloc polivalent amb el que puguem dibuixar qualsevol polĂgon de qualsevol mida :) Tal com hem fet amb les ranures anteriors al quadrat, al triangle i a la caseta, crearem dues ranures en un sol bloc. El polĂgon es pot dir “polĂgon X costats X mida” (en anglès li han posat “draw polygon with X sides of lenght X”).</p>
<p>Les X seran els foradets on desprĂ©s li posarem el nĂşmero que vulguem. Si volem que el polĂgon tingui 3 costats per crear un triangle, ho indicarem al primer foradet (costats). Si li posem 6, dibuixarĂ un hexĂ gon i si n’hi posem 8, un octògon, i aixĂ anar fent… Amb el segon input o ranura podrem controlar la mida del polĂgon, aixĂ que si volem que mesuri 100 pĂxels o 50, ho haurem d’indicar al segon input o ranura.</p>
<p>Es poden crear blocs molt “locus”, com aquest per dibuixar totes les flors imaginables :) A més del nombre de pètals i la mida de la flor, podem escollir els costats, la posició de la flor a l’escenari, l’angle, el color i l’ombra. Tela, Manela!</p>
<p><img src="../../img/snap/bjc-block-flor.png" alt="bjc-block-flor" /></p>
<p>Si t’entrebanques molt i molt, deixo aquĂ el meu bloc de polĂgon :)</p>
<p><a href="https://snap.berkeley.edu/snap/snap.html#present:Username=Gamificat&ProjectName=BJC.x12-w02e04-Poligons">Bloc de polĂgon</a></p>
<h2>Deures 3: the for block</h2>
<p>Després de trastejar tres blocs de control (“per sempre”, “repetir vegades” i “repetir fins que”), en veurem un tercer, el “The FOR block”. Aquest bloc, però, no surt per defecte quan obrim Snap! El trobarem si cliquem a la icona de l’arxiu primer i, després, a l’opció “Importa eines”. Si passem el cursor pel damunt de l’opció, ens apareixerà un missatget indicant què fa aquesta opció. I el que fa és que “Carrega la llibreria oficial de blocs avançats”. Entre ells, trobarem aquest “The FOR block”, que diu “For i = 1 to 10”. Aquests blocs, de moment, estan en anglès.</p>
<p>!</p>
<p>Aquest bloc permet nombrar una variable (on posa “i” en taronja podem escriure el que vulguem) que indica a quina repetició som. Com a exemple, se’ns posa tot un seguit de blocs de “digues”. Cada bloc diu un número arrencant per 1 i simula que un personatge compta, tot dient: 1,2,3,4…</p>
<p>Imaginem que volem que compti fins a 100. Seria una bajanada escriure 100 vegades 100 números diferents. Ja comentà vem que els programadors/es tenen fama de ser molt mandrosos/es i que sempre se les empesquen per estalviar-se feina. Ben fet que fan :) Aixà que, per no posar innecessà riament 100 blocs gairebé iguals al nostre projecte, farem servir aquest bloc avançat.</p>
<p>Primer posem un sol bloc “digues durant 1 segons” (o els que vulguem) dins del bucle del nou bloc “the FOR block”. I després, arrosseguem la “i” fins al text del bloc d’aparença “digues”… Tachán! Veurem com compta tot solet de 0 a deu amb només dos blocs i no 10! Per trastejar una mica, podem fer-li fer un compte enrere. Al FOR block, haurem d’escriure 10 enlloc d’1 i 0 enlloc de 10. Tachán! Ja tenim un compte enrere :)</p>
<p>Per trastejar encara més, se’ns fa fer un exercici: hem de comptar de dos en dos, de 0 a 30. Houston!!!, no em surt! Per què segueix comptant després de 30 si li he posat de 0 a 30? Misteri… Aviam si me’n surto… També ens fan fer una “Squiral”, que és una espiral quadrada, aixà que haurà de girar 90 graus. Si variem els graus, es fan figures geomètriques molt xules, com flors: si posem 110 graus… Oi que sembla una carxofa? És divertit anar canviant el número de graus i veure formes diferents: sembla un caleidoscopi!</p>
<p>A mi m’agraden les formes del 92, 126, 175 i 225 :) També ens fan fer alguna la figura més propera a l’espiral, que es fa trastejant els blocs de moviment i gir. Apa, a provar… Si no te’ns surts gens gens, aquà la meva espiral.</p>
<p>Ara ens fan fer nius de quadrats. Primer hem de fer un quadrat normal amb ranura per la mida i, després, un bloc “nest squares” (quadrats “anidados”, que no em surt en català … “aniuats” o “niuat” no ho trobo…Coses de l’idioma, hehe). El nou bloc “nest squares” també ha de tenir ranura i l’input que posem dins determinarà quants quadrats es dibuixen. La conya marinera és que cada quadrat ha de ser més gran que el seu precedent a mesura que es dibuixen. El dibuix que ens ha de sortir és aquest:</p>
<p><img src="../../img/snap/bjc-quadrats.png" alt="bjc-quadrats" /></p>
<p>El FOR block serveix per comptar i dibuixar “floretes” però també serveix per lletrejar! (“spell” en anglès). Ara, toca crear un bloc que digui “Que tinguis un bon dia!” Com trobo que és molt llarg, n’he creat un altre que lletreja: “WOW, mola!” ;)</p>
<p><img src="../../img/snap/bjc-spell-block.png" alt="bjc-spell block" /></p>
<p><a href="../2016-09-17_BJC_4/index.html">Snap!Lab – Tres en ratlla</a></p>
</div>
</div>
</main>
<footer>
Internets duals: gemini://gamifi.cat</br>
<a href="../../llicencies/">Diverses llicències</a> / <a href="../../kukis/">PolĂtica de Kukis</a></br>
♥ Fet amb paciència i tecnologies lliures ♥
</footer>
</body>
</html>