Thursday, 31 January 2019

AUDACITY: Tasca 3: Una història sonora (Parelles)

En aquesta activitat enregistrarem una història només amb sons, de forma que aconseguirem una banda sonora.

Es proposa generar un àudio que reflecteixi les accions que duem a terme pels matins: llevar-nos, rentar-nos, esmorzar, sortir de casa,... Per a això teniu a la carpeta sons un recull de àudios que podeu fer servir.

Els passos a seguir són els següents:

1. Comenceu per fer un petit guió que reflecteixi quin ha de ser l'ordre de les accions per relacionar-les amb els sons.

2. Obriu els àudios triats.

3. Modifiqueu les diferents pistes per establir l'ordre de les accions. Aquestes pistes són el soroll de fons d'una història que després gravareu.

4. Graveu el resultat en format mp3 amb el nom historia_Cognom1Cognom2.mp3, penjeu-lo a podomatic i publiqueu-lo al vostre blog. La publicació del podcast d'audio ha d'anar acompanyada del guió escrit de la història sonora.

ATENCIÓ: Guardeu l'àudio al Drive personal de cadascú de vosaltres a la carpeta info_cognom que heu creat prèviament.

EXEMPLE TASCA 3

Thursday, 24 January 2019

AUDACITY: Tasca 2 - Integració de música a l'enregistrament

Audacity ens permet treballar amb vàries pistes d'àudio a la vegada. En aquesta pràctica se us demana que integreu música a l'enregistrament fet a la tasca anterior. Recordeu que heu de fer servir una música sense drets d'autor.


Podeu trobar música amb llicència Creative Commons a diferents webs. En aquest enllaç teniu un portal amb moltes gravacions d'ús lliure.

Els passos a seguir són els següents:

1. Busqueu una música per afegir al vostre enregistrament.

2. Obriu els dos àudios a la vegada.

3. El resultat final ha de ser un únic fitxer que comenci amb música, afegir el vostre enregistrament sobre la música i acabar, de nou, només amb la música. Heu de tenir en compte que la música afegida ha de tenir una durada superior a l'enregistrament de la vostra presentació que tenia un a durada d'1 minuts.

4. Pel que fa a la música, heu de treballar amb efectes diferents, de forma que la música pugi d'intensitat, davalli quan comenci a sentir-se la vostra veu i es mantingui en aquesta intensitat, torni a pujar quan s'acabi la vostra presentació i gradualment desaparegui fins a acabar l'àudio.

5. Quan acabeu, Exporteu l'àudio resultant en format mp3 amb el nom TASCA_2_Presentacio2_Cognom.mp3 i publiqueu-lo al vostre espai a Podomatic. 
ATENCIÓ: Guardeu l'àudio al vostre Drive personal a la carpeta info_cognom que heu creat prèviament. 

 6. Un cop penjat a Podomatic, publiqueu-lo al vostre bloc, tal i comheu publicat el podcast anterior.

Thursday, 17 January 2019

Podcasting

Contesteu a les preguntes següents en una entrada al vostre blog personal:


1. Què és un podcast?

2. Què és podomatic?

AUDACITY: Tasca 1 - enregistrament i efectes de so

 

Comencem a treballar amb Audacity. En aquesta primera tasca se us demana que feu un enregistrament presentant-vos a vosaltres mateixos. El passos a seguir són els següents: 

1. Enregistreu una presentació de vosaltres que tingui una durada màxima d'1 minuts. No passa res si dubteu o us quedeu en blanc, després podreu modificar l'enregistrament tallant i muntant. Tot i així, convé que us prepareu un petit guió amb algunes idees que us permetin seguir un discurs coherent. 

2. Escolteu l'enregistrament i modifiqueu el que creieu convenient per deixar un discurs coherent. 

3. Reduïu el soroll de fons. 

4. Afegiu efectes de canvis de velocitat, incrementant-la i reduint-la.

5. Quan acabeu, Exporteu l'àudio resultant en format mp3 amb el nomTASCA_1_Presentacio_Cognom.mp3 i publiqueu-lo al vostre espai a Podomatic. Si no teniu Podomatic haureu d'obrir-vos un compte.
ATENCIÓ: Guardeu l'àudio al vostre Drive personal a la carpeta info_cognom que heu creat prèviament. 

 6. Un cop penjat a Podomatic, publiqueu-lo al vostre bloc, tal i comha quedat publicat el podcast anterior.

Formats d'arxius de so

Llegiu el document que ens informa dels diversos arxius de so que existeixen.
També teniu una llibreria de sons.
Aquests documents els teniu disponibles a l'Àgora.

 Formats d'arxius de so
 Sons

Tuesday, 15 January 2019

MoleMash

En aquest enllaç es troben les instruccions en anglès per construir el programa del joc MoleMash.


Tot seguit s'explicarà, en Català, com realitzar el programa.

Què volem fer?

Al joc MoleMash, un talp va apareixent en posicions aleatòries del camp de joc. El jugador aconseguirà marcar punts quan aonsegueixi colpejar el talp abans que aquest salti. 

El talp es mourà cada mig segon. Si és tocat, el marcador suma un punt més, i el telèfon vibra. Quan es prem el botó RESET el marcador es posa a zero.


Aquesta serà la superfície de joc:
Per començar

1. Entrar a la web d'AppInventor i comença un nou projecte. 
2. El nom del projecte ha de ser MoleMash_NomCognom1.
3. El Title de la pantalla serà MoleMash_NomCognom1.
4. Baixeu-vos la imatge del talp i desa-la a l'ordinador.

Primers components

1. Un Canvas anomenat MyCanvas. Aquesta és l'àrea de moviments del talp. Dimensions: 300pxls wide x 300pxls high

2. Una Label (etiqueta) anomenada "ScoreLabel", que mostra el marcador amb el nombre de vegades que el jugador ha colpejat el talp.

3. El text de l’etiqueta ScoreLabel ha de ser Score: --

4. Un botó anomenat "ResetButton". El text del botó serà RESET

5. Afegir un component de so i anomena'l Noise. Utilitzarem Noise per fer vibrar el mòbil quan el talp és colpejat.

6. Arrossega cap al Viewer el component Clock des de la secció Sensors de la Palette i anomena’l MoleTimer. Aquest component servirà per fer saltar el talp cada 500milisegons. Per a fer això, hem d’establir el valor 500 a la propietat TimerInterval del MoleTimer. Assegureu-vos que la propietat TimerEnabled està activada.

7. Per afegir el talp hem d’utilitzar un sprite. Arrossega unImageSprite des de la secció Drawing and Animation cap a MyCanvas al Viewer.  A continuació, estableix les propietats següents:
  • Picture: mole.png
  • Enabled: activat
  • Interval: 500
  • Heading: 0
  • Speed: 0.0
  • Visible: Activat
  • Width: Automatic
  • Height: Automatic
Un cop afegits els components a l'entorn de treball, ens quedarà una pantalla com la següent:


Especificar el comportament dels components

Què és un procediment (Procedure) en AppInventor? Es tracta d’una seqüència d’events que es poden produir més d’un cop durant l’execució d’un programa.

Definirem dos procediments:
  • MoveMole: Mou el sprite del talp a una nova aleatòria posició dins del MyCanvas.
  • UpdateScore: Mostra el marcador amb el resultat (score) a travès del text de l’etiquetaScoreLabel.


Definir el procediment MoveMole

1. A l’editor de blocs, a la secció Built-In, obre el calaix de procediments (Procedures), arrossega un blocto procedure i canvia l’etiqueta procedure perMoveMole.

2. A continuació es mostra el bloc to MoveMole, que és on s’estableixen les accions del procediment, que són establir les coordenades X i Y de la posició del talp. El valor de les coordenades serà una fracció aleatòria de la diferència entre el tamany de MyCanvas i el tamany del talp (Mole).

Definir el procediment UpdateScore

1. Definir una variable score, que contindrà el marcador del resultat obtingut a cada instant. Inicialment, la variable creada haurà de tenir valor zero:

2. A l’editor de blocs, a la secció Built-In, obre el calaix de procediments (Procedures), arrossega un blocto procedure i canvia l’etiqueta procedure perUpdateScore.

3. Arrossegueu un bloc de text des del calaix de Text, i poseu el text “Score:”.

4. Afegeix un bloc join per ajuntar el text “Score:” al valor de la variable global score:

Afegir un Timer

Per fer que el talp es mogui hem d’utilitzar el ClockMoleTimer
A l’editor de Blocs, seleccionem l’event when MoleTimer.Timer. Aquest event cridarà el moviment del talp (procediment MoveMole) cada 500ms (TimeInterval).

Afegir l’acció de Tocar el talp

Crearem una rutina when Mole.Touched que faci el següent:

1. Incrementar el marcador (valor de la variablescore).

2. Cridar la rutina call UpdateScore per mostrar el nou marcador.

3. Fer vibrar el telèfon durant 100 milisegons cada segon.

4. Cridar la rutina call MoveMole per a que el talp es mogui inmediatament, enlloc d’esperar al timer.

Posar el marcador a zero
Fer que el botó ResetButton canviï el valor de la variable score (marcador) a zero i cridi call Update score

Programa complet:

Friday, 11 January 2019

Paint Pot (2)

I ara què fem?

A partir de l'aplicació PaintPot ja creada, farem una evolució que ens permeti, a més a més, pintar punts de diferents tamanys.
L'objectiu és aprendre a utilitzar les variables globals.
Als llocs web següents disposes dels tutorials del PaintPot1 i PaintPot2 en anglès:

http://appinventor.mit.edu/explore/ai2/paintpot-part1.html 

http://appinventor.mit.edu/explore/ai2/paintpot-part2.html


Pantalla de l'App

Hem de crear una pantalla per a la nostra app com la que es veu a continuació.

La pantalla ha d'afegir, als controls que teníem abans, un botó per afegir punts petits i un altre botó per afegir punts grans. Vegeu l'exemple:




Pantalla de Blocks

A continuació tenim el programa que hem de realitzar a la secció de Blocks:

Estudi del programa: Funcionament dels botons

  • Quan cliquem el botó VERMELL (RedButton), s'agafa el color vermell com a color de pintura (PaintColor) per al Canvas.
  • Quan cliquem el botó BLAU (BlueButton), s'agafa el color blau com a color de pintura (PaintColor) per al Canvas.
  • Quan cliquem el botó VERD (GreenButton), s'agafa el color verd com a color de pintura (PaintColor) per al Canvas.
  • Quan cliquem el botó Wipe (ButtonWipe), es crida l'ordre d'esborrat de qualsevol traç que hi hagi al Canvas.

Estudi del programa: Variables i botons de variables

En primer lloc, el programa inicialitza les variables smallbig idotsize, i les inicialitza als valors 2, 8 i 2 respectivament.

A continuació, el boto ButtonBig es programa per a que, en ser clicat, prengui el valor de la variable global big i l'adjudiqui a la variable global dotsize.

De la mateixa manera, el botó ButtonSmall es programa per a que, en ser clicat, prengui el valor de la variable global small i l'adjudiqui a la variable global dotsize.


Estudi del programa: Pintar punts i línies

Vegeu que la part del programa que dibuixa els punts és igual que la realitzada per al programa PaintPot (1), amb la diferència que el radi no s'obté directament d'un bloc numèric, sino que s'obté de la variable global dotsize.

D'altra banda, la part del programa que dibuixa les línies és idèntica a la realitzada al programa PaintPot (1).


Com introduir al programa les variables globals

Per inicialitzar (crear-les i donar-les un valor inicial) les variables globals procedirem com s'indica als dibuixos següents:

PaintPot (1)

Què farem?

Crear una aplicació que ens permeti:
  • Ficar el dit en un pot de pintura virtual per a poder pintar
  • Arrossegar el dit per la pantalla del mòbil per dibuixar una línia
  • Fer copets a la pantalla per dibuixar punts
  • Esborrar les línies i punts dibuixades prement un botó d’ESBORRAR
  • Afegir una imatge com a dibuix de fons (background)

Per començar

Obre un projecte now (Start new project) i anomena’lPaintpot_NomCognom

A la secció Components selecciona Screen1. Llavors, a la secció de propietats (Properties), canvia el Title perPaintpot_NomCognom.

Seleccionar els components

Els components a utilitzar seran:
  • 3 Buttons per a seleccionar pintura REDBLUE oGREEN + un altre Button per ESBORRAR.
  • Un llenç (Canvas) o superfície de dibuix. Aquest Canvas ha de tenir una imatge de fons (BackgroundImage), disponible en aquest enllaç.
  • Un HorizontalArrangement per a alinear els 3 botons.

Col·locar els botons a la pantalla de l’app
  1. Des de la categoria Layout de la secció Palette, arrossega el HorizontalArrangement a la secció Viewer.
  2. Situa els botons dins de l’ HorizontalArrangement, com es mostra a la figura següent. 
  3. A la secció Components canvia el nom dels components als mostrats a la figura següent.


Col·locar el Canvas i el botó ESBORRA a la pantalla de l’app
  1. Des de la secció Drawings and animation de la Palette, arrossega un Canvas al Viewer.
  2. Canvia el nom del Canvas per DrawingCanvas. Ajusta el seu ample (Width > Fill Parent) i l’alçada (Height a300 pixels).
  3. Afegeix una imatge de fons (Background Image) alCanvas: Fes click al camp Image que conté el textNone...  Adjunta una imatge d’un gat diferent de la del fitxer kitty.png.
  4. Des de la Palette, secció User Interface, arrossega l’últim botó a sota de la imatge. Es dirà el botó ESBORRAR (ButtonWipe).

Afegir comportaments als components

Primer establirem que els botons canviïn el color de la pintura. Després afegirem blocs que permetin pintar quan algú toca o arrossega el dit per la pantalla del mòbil.

A l’editor de blocs:
  1. Selecciona el calaix del botó vermell (ButtonRed) i arrossega el bloc when ButtonRed.Click.
  2. Selecciona el calaix del Canvas (DrawingCanvas). Arrossega el bloc set DrawingCanvas.PaintColor to i situa’l al bloc when ButtonRed.Click.
  3. Del calaix de colors, selecciona el color vermell i connecta’l al bloc set DrawingCanvas.PaintColor to.
  4. Repeteix aquests passos per a la resta de botons de colors.
  5. Selecciona el calaix del botó ESBORRA (ButtonWipe) i arrossega el bloc when ButtonWipe.Click a la pantalla del editor. Del calaix del botó DrawingCanvas,arrossega el bloc call DrawingCanvas.Clear a dins del bloc when ButtonWipe.Click
Ens ha de quedar un programa com el següent:

Ara afegirem blocs que permetin pintar punts quan algú toca la pantalla del mòbil.

Ara heu de muntar, al mateix àrea de blocs, el programa següent, que ens dibuixarà un cercle de radi 5 cada cop que fem un toc sobre el Canvas a les coordenades del punt on s’ha tocat:

Ara afegirem blocs que permetin pintar línies quan algú arrossega el dit per la pantalla del mòbil.

Ara munteu el programa següent, que serveix per pintar línies cada cop que arrosseguem el dit per la pantalla. El programa va prenent coordenades X i Y dels punts pels quals passa el nostre dit, i va dibuixant una línia amb els punts obtinguts.