Què és l'App Inventor

En aquest apartat trobarem una breu introducció a l'App Inventor i com podem utilitzar-lo com a docents, dins d'un entorn de treball per projectes, per incorporar-lo com a llenguatge de programació de dispositius mòbils Android a l'aula.


Més concretament es pretén donar resposta a les preguntes següents:


  • Què és l'App Inventor?
  • Què ens permet fer?
  • Com és l'entorn?


L'App Inventor és un entorn de programació de dispositius mòbils Android, creat originalment per Google i recollit posteriorment pel MIT –Massachusetts Institute of Technology–. És un entorn de programació per blocs pensat per entorns educatius, amb l'objectiu que, en la programació de dispositius mòbils, els estudiants es puguin centrar en la resolució d'un problema.


L'entorn de programació de l'App Inventor

Quan anem a http://appinventor.mit.edu arribem a una plana on trobem aquesta capçalera:



Podem navegar per la web de l'App Inventor, veure la documentació i els recursos que hi ha i, finalment, si volem entrar a l'entorn de programació, hem de fer clic al botó Create apps! Per accedir-hi ens hem de validar amb un compte de Google, en aquest sentit podem utilitzar el de la XTEC.


Un cop validats, accedim a una pantalla on hi haurà tots els projectes que anem creant. Per començar a treballar creem un nou projecte amb el botó Start new project i li donem un nom:



D'aquesta manera accedirem al nostre espai de treball, que té aquest aspecte:



En aquest entorn de treball podem distingir diferents zones, que en aquesta imatge estan marcades en diferents colors:

  • Vermell: Els diferents components, agrupats per categories, que podem utilitzar en la nostra app
  • Blau fosc: Espai, que vol representar la pantalla del dispositiu mòbil, on cal col·locar els diferents components a utilitzar
  • Rosa: Zona on hi ha el llistat de tots els components utilitzats, des d'on se'ls pot canviar el nom o eliminar-los
  • Carbassa: Espai on podem veure i modificar les propietats del component que estigui seleccionat
  • Groc: Espai des d'on pujar fitxers multimèdia (imatges, sons…) a la nostra app
  • Blau cel: Botons per definir diferents pantalles a la nostra app
  • Morat: Botons per canviar entre el mode disseny i el mode programació
  • Verd fosc i verd clar: Zona de menús del programa


L'App Inventor té tres modes de treball diferents. Els botons de la zona de color morat ens permeten canviar entre el mode disseny (Designer), on dibuixem com serà la pantalla de la nostra app, i el mode programació (Blocks), on podrem programar el comportament dels diferents components:



En aquesta pantalla hi ha tots els components que hem afegit al nostre projecte, i, en seleccionar cadascun d'ells, veiem totes les instruccions que podem utilitzar amb aquest component. Tanmateix també hi ha, a la part superior esquerra, una sèrie de blocs per defecte (Built-in) que sempre podrem utilitzar en els nostres projectes independentment dels components que hi hagi.


Finalment, el tercer mode de treball és el mode execució, on podem veure en funcionament el programa que hem creat. Hi ha tres formes de veure aquest mode:

  • Connectar l'ordinador i el dispositiu mòbil a una mateixa wifi (AI Companion)
  • Utilitzar l'emulador de dispositiu mòbil des del mateix ordinador
  • Connectar el dispositiu mòbil a l'ordinador amb un cable USB



L'opció que millor funciona, la que dóna menys problemes de comunicació i la més recomanada és la primera: connectar ambdós dispositius a una mateixa wifi.


Connectem l'App Inventor amb el dispositiu mòbil

Els passos, doncs per connectar l'app que estem fent amb l'App Inventor i el nostre dispositiu mòbil són:


1. Instal·lar al nostre dispositiu mòbil una app, en funció del nostre dispositiu:


2. Obrir la connexió des de l'App Inventor. Cal anar al menú Connect i triar l'opció AI Companion:


3. Ens apareixerà un quadre de diàleg on hi ha un codi QR:


4. Anar al dispositiu mòbil i executar l'app MIT AI2 Companion o MIT App Inventor que prèviament ens hem descarregat i hem instal·lat. Des de l'app hem de llegir el codi QR que ens ha proporcionat l'App Inventor:


És important adonar-se que, a mesura que fem canvis en la nostra app, aquests canvis es reflecteixen immediatament al nostre dispositiu mòbil, sempre que mantinguem l'app en funcionament i no trenquem la connexió amb l'App Inventor.


Podem trobar més informació al respecte a http://appinventor.mit.edu/explore/ai2/setup.html