Arxiu de categories eines digitals

PerPere Cornellà Canals

Devfest Lleida 2015

Aquest passat 12 de desembre ha tingut lloc el primer DevFest (#devfestedu) centrat en educació i educadors i, està clar, en tecnologies Google. Vaig tenir l’oportunitat d’assistir-hi i aportar el meu granet de sorra parlant de gamificació.

En podreu trobar més informació en aquest enllaç. Hi trobareu el detall de les ponències, dels ponents, dels patrocinadors…

S’hi van presentar interessants experiències reals per part de professionals de l’educació. Va ser interessant que hi participessin propostes de centres privats, de centres concertats i de centres públics. Tots n’hem d’aprendre molt de tots. M’enduc un bon grapat de bones idees.

Llegiu més
PerPere Cornellà Canals

Sant Narcís i les Galaga-mosques

img062

En els darrers anys, quan s’acosten les Fires de Sant Narcís a Girona, a finals d’octubre, l’Ajuntament convoca un concurs per triar el cartell que anunciarà les festes. Aquest any 2015, el projecte guanyador ha estat el que han proposat per Joan Codina i Gemma Moreno. En podeu trobar més detalls fent clic aquí.

Personalment trobo que la proposta és genial. Segur que ho fa el meu “amor” pels videojocs, però és d’aquelles idees que fan enveja sana que no les hagis pensat tu.

Llegiu més
PerPere Cornellà Canals

PONG

Homenatge a un dels primers videojocs d’arcade i considerat el primer videojoc d’esports. Hi heu pogut jugar mai? Us deixo una aproximació feta amb Scratch.

Llegiu més
PerPere Cornellà Canals

Creació d’històries interactives: Twine, AXMA Story Maker i inklewriter

Un dels aspectes que treballo amb els meus alumnes de l’assignatura Videojocs i Educació de 4t del Grau de Mestre a la UdG, és la narrativa. Des del meu punt de vista, és un aspecte molt important a tenir en compte tant en el moment d’analitzar un videojoc com en el moment de crear-lo. Per això, per grups, els proposo un repte que consisteix en la creació d’una història interactiva, a mode de joc basat en text, una història del tipus tria la teva aventura, per entendre’ns. Això els obliga a posar-se a la pell del lector i mirar la seva història des de l’altre costat. D’aquesta manera són capaços de preveure totes les possibles eleccions i reaccions del lector i poden anar construint una història sòlida, que els ajudarà a avançar en el camp del disseny de jocs. I els demano que ho facin en format digital.

images (1)Fa un temps vaig descobrir una eina molt interessant, el Twine. En el moment d’escriure aquest post existeix la versió descarregable 1.4.2, tant per a sistemes Windows com per a OSX, i una versió per treballar online que encara es troba en fase beta. És una bona eina, molt visual que permet crear connexions entre passatges i afegir-hi imatges. En ser open source (basat en TiddlyWiki) permet remenar el codi i adaptar-lo a les pròpies necessitats. Les històries creades queden compilades en llenguatge HTML, de fàcil distribució.

220px-AXMAStoryMakerLogoUna alternativa a aquesta aplicació la podem trobar en AXMA Story Maker. Aparentment sembla una evolució de Twine. Disposa, a l’igual que l’anterior, d’una versió per descarregar i una altra en línia. Com a avantatges, cal destacar que ofereix més facilitat a l’hora de formatar text, d’afegir sons i imatges i de gestionar els passatges. I té un manual que és molt útil per familiaritzar-se amb la interfície i les instruccions que cal utilitzar. A més, hi ha una versió Pro, de pagament, amb més característiques.

inkleI fa uns dies vaig descobrir una alternativa molt interessant: inklewriter, de la companyia de videojocs Inkle. Aquesta aplicació la podem trobar, en versió beta, només en versió online. És molt fàcil d’utilitzar i té moltes prestacions interessants com, per exemple, la possibilitat d’afegir marcadors en els passatges de la història per controlar, per exemple, si l’usuari ja ha llegit aquell passatge o no, o quantes vegades hi ha passat. Permet, també, afegir condicionals, fent que aparegui un text o una opció en funció d’algun paràmetre determinat. Una característica interessant és que, quan el lector va avançant en la història, els nous passatges es van afegint a sota dels que ja ha llegit, de manera que sempre es pot veure el que s’ha llegit en funció del camí que has triat. Com a desavantatge podem destacar que les narracions creades resten en el seu servidor i que hi apareix publicitat (hi ha la possibilitat de convertir-lo en format eBook per ser visualitzat en dispositius Kindle per un preu d’un cost entre 5 i 10 lliures).

En definitiva, tres opcions per triar i remenar. Però tres bones opcions per treballar la narrativa, la creativitat i la imaginació.

Per acabar de decidir amb quina opció us quedeu, podeu fer un cop d’ull a aquests exemples:

PerPere Cornellà Canals

Google Maps i Google Earth

Ahir vaig fer una sessió per al professorat d’Educació Secundària sobre Google Maps i Google Earth. La veritat és que, en aquests darrers anys, aquestes aplicacions han sofert molts de canvis: tractament de les imatges en 3D, Street View, itineraris, exploració de l’Univers, Mart, la Lluna, enregistrament de viatges… Tot un seguit de possibilitats que animen a fer el xafarder i anar experimentat totes les possibilitats que ofereixen. Val la pena potenciar la curiositat!

Enganxo, aquí sota, la presentació que vaig fer servir i on es mostren algunes de les funcionalitat d’aquestes aplicacions. Al pas que evolucionen, compto que el que trobareu a la presentació quedarà obsolet en ben poc temps 🙁

PerPere Cornellà Canals

Portafolis

He preparat una prezintació sobre els Portafolis: concepte general i explicació del portafolis digital. Dins l’oferta que podem trobar al mercat, faig una ràpida menció a Mahara, el portafolis digital que ha escollit la UdG per poder-lo integrar amb el Moodle. He estrenat aquesta prezintació en el marc de la Jornada sobre Docència Basada en Competències i Acció Tutorial de la UdG.

PerPere Cornellà Canals

Hoppala i Layar: una bonica relació

 

Layar és, sense cap mena de dubtes, una de les aplicacions més potents per crear i visualitzar Realitat Augmentada. A més del conegut navegador per a dispositius mòbils, disposa de Layar Creator, un visualitzador de Realitat Augmentada a partir d’imatges.

En aquest article ens centrarem en la creació de contingut per a ser visualitzat com a capes de realitat augmentada en el navegador Layar per a dispositius mòbils.

Per això, utilitzarem el propi Layar, combinat amb Hoppala Augmentation, una aplicació que ens facilitarà crear els punts d’interès (POIs – Point Of Interest) que vulguem.

En aquest procés seguirem els passos següents:

  1. creació del conjunt de POIs a Hoppala,
  2. creació de la capa de Layar,
  3. enllaç del conjunt de POIs amb la capa
  4. donar format a la capa
  5. publicar, si escau, la capa; o utilitzar-la en mode Test

Tant en el Hoppala com en el Layar haurem de tenir un registre d’usuari per poder fer totes aquestes accions. Per això, si encara no en tenim, caldrà crear-los.

1.- Creació del conjunt de POIs a Hoppala

Accedim a la pàgina de Hoppala (http://augmentation.hoppala.eu/). Si tenim un compte d’usuari, el podem escriure per accedir al nostre espai. Si encara no el tenim, l’haurem de crear. El procés demana confirmació via email.

Accedirem a un espai amb diverses opcions. A l’extrem inferior dred, trobarem un enllaç que diu Add overlay. Hi farem clic per crear un nou conjunt de punts.

En fer clic, obtindrem un resultat similar al que mostra la imatge:

2013-04-12_1133

Fent clic sobre el llapis, podrem editar el títol i el nom del conjunt de POIs per adaptar-los a les nostres necessitats. La Overlay URL és l’adreça que necessitarem per connectar els punts a la capa de Layar que crearem posteriorment. Fent clic sobre el títol o el nom, accedirem a un mapa on situar els nostres POIs. Podem utilitzar el camp de cercador d’adreces per situar els nostres punts, o bé naveguem a través del mapa fins a localitzar-los. Fixeu-vos que podeu navegar pel mapa en format mapa, satèl·lit o híbrid.

Un cop localitzat el lloc on volem crear el primer punt, fem clic sobre l’enllaç de la part inferior dreta de la pantalla que diu Add augment. Això fa aparèixer sobre el mapa la icona clàssica de localització. Amb el ratolí el arrosseguem la icona al lloc exacte on volem situar el POI.

hoppala3

Podem observar que a la part dreta de la pantalla ha aparegut una casella amb el títol Untitled. Fent-hi clic a sobre, accedirem a entrar els detalls del punt que estem creant. Ens apareix una bafarada emergent amb quatre pestanyes:

hoppala4

  • General: on escriurem el títol del punt, la descripció (3 línies) i la miniatura que es mostrarà quan el navegador de RA apunti cap al punt (sol ser una imatge del lloc; es recomana que sigui de 100 x 100 píxels); podem pujar i utilitzar les imatges que vulguem (jpg o png).
  • Assets: a l’apartat Layar podem triar el tipus d’icona que es mostrarà al navegador per assenyalar els POIs: podem triar entre els que vénen per defecte o escollir-ne un altre joc (que gestionarem a Layar); també podem triar un asset: un objecte 3D o una imatge (jpg o png) que es mostrarà en el lloc on haguem definit el POI.
  • Actions: podem triar diverses accions per a cada punt que s’activaran en seleccionar-lo des del navegador de RA: incloure àudio o vídeo, enllaçar un lloc web, escriure un tuit, fer una trucada, enviar un email o un SMS. Per a cadascuna de les accions, podem decidir si s’executen quan l’usuari estigui en un radi concret de distància al punt o no.
  • Location: latitud, longitud (aquests camps ja estan omplerts, però els podem acabar d’ajustar) i altura del POI.

Un cop entrades totes les dades que vulguem, fem clic al botó Save. Veurem els canvis a la casella de la dreta.

Seguint el mateix procés, crearem tants punts com vulguem. Veurem que van quedant al costat dret de la pantalla. Tots els punts són editables posteriorment. Quan els tinguem tots, ja estarem a punt per al següent pas.

2.- Creació de la capa de Layar

Accedim a la pàgina de Layar (http://www.layar.com). Si tenim un compte d’usuari, el podem escriure per accedir al nostre espai. Si encara no el tenim, l’haurem de crear. El procés demana confirmació via email. Atenció! Al web de Layar ens podem donar d’alta de dos serveis:

  • servei de creació i gestió de capes de RA,
  • servei de Layar Creator (per generar RA que utilitza imatges per activar les accions).

Tot i que podem gaudir dels dos serveis, cal fer un registre independent per a cadascun d’ells. En el nostre cas, el que ens interessa és el primer, el de creació i gestió de capes de RA. Per donar-nos d’alta en aquest servei hem de buscar l’apartat Developers. En el moment d’escriure aquest article, el trobem a la part inferior de la pàgina, en una zona amb fons gris fosc. Si també ens donem d’altra del servei Layar Creator, podrem utilitzar aquesta tecnologia en les nostres capes de RA.

layar1

El procés de creació del compte implica rebre i respondre algun correu.

3.- Enllaç del conjunt de POIs amb la capa

Un cop tinguem el compte creat, podrem accedir al nostre espai on, a la part superior dreta, trobarem un botó per accedir a les nostres capes (layers).layar2

Farem clic sobre el botó Create a new layer! per crear la nostra nova capa. Això fa aparèixer una finestra emergent on hem d’omplir les dades bàsiques de la nostra capa (si posem el cursor sobre el camp d’entrada de cada apartat, veurem els requisits que hem de seguir):

  • el nom de la capa: és un identificador,
  • el títol de la capa: és el que apareixerà com a nom de la capa,
  • una descripció curta,
  • el nom de la persona que publica la capa,
  • l’API endpoint URL: és el camp més important, perquè és el que ens lliga Hoppala i Layar. En aquest camp hem d’escriure l’adreça que apareixia a la columna Overlay URL del nostre conjunt de punts creats a Hoppala,
  • tipus de Layar: escollir entre 2D o 3D en funció dels elements que hi vulguem utilitzar,
  • Layar Vision: si el volem habilitar o no (en principi no ens cal per crear una capa de RA).

Fem clic sobre Create layer i ja tindrem la nostra capa creada. Si ho hem fet tot correctament, prémer el botó ens portarà a una nova pantalla on podrem acabar de perfilar (si ho creiem necessari) algunes de les característiques de la nostra capa.

layar4

4.- Donar format a la capa

De fet, a hores d’ara, ja ho tenim tot llest per a poder visualitzar la capa a través del nostre navegador Layar. Però li podem donar una mica de format. No faré aquí un repàs exhaustiu de totes les opcions (ho deixo perquè investigueu una miqueta vosaltres), però sí que en destaco alguns apartats. Recordeu de desar cada canvi que feu.

  • Apartat Listing & indexing: molt important a nivell d’informació i d’estètica. Podem afegir una icona que identificarà la nostra capa, una captura de pantalla, ampliar la informació i afegir etiquetes. A la part superior dreta hi trobareu l’enllaç Click here for an example que ens orientarà sobre quina és la funció de cada element.
  • Apartat Look & feel: ens ofereix la possibilitat d’afegir un bàner personalitzat, triar els colors de l’espai on apareix la informació dels nostres POIs i canviar els indicadors de POIs (en podem crear tants com vulguem, si volem un per POI; aquest element va relacionat amb el conjunt d’icones que podem triar, per a cada punt, a Hoppala -apartat Assets-).
  • Apartat Filters: són filtres que es mostraran abans de carregar la capa. Generalment no caldrà utilitzar-los, però va bé saber que existeixen perquè, en alguna ocasió, ens poden ser útils.
  • Apartat Permissions: des d’aquí podem canviar la persona que publica la capa i, sobretot, afegir noves persones que poden visualitzar (Add viewer) la capa mentre no sigui pública (mentre sigui en mode Test); aquestes persones que poden visualitzar la capa mentre no és pública cal que tinguin un compte de Layar.

Desem els canvis que haguem fet tot fent clic sobre Save.

5.- Publicar, si escau, la capa; o utilitzar-la en mode Test

Tal i com ho tenim ara, la capa que acabem de crear no és pública. Això vol dir que només la poden veure la persona que l’ha creada i les persones que apareixen a la llista de Viewers de l’apartat Permissions. D’aquesta manera, per poder veure la nostra capa caldrà:

  • instal·lar Layar al nostre dispositiu mòbil,
  • executar l’aplicació,
  • accedir a l’espai de configuració,
  • anar a l’apartat d’usuari (o de compte… depèn del sistema operatiu) i donar-se d’alta amb el mateix usuari de Layar,

Un cop fet això, veurem que als grups de capes, apareix un nou grup anomenat Test (o desenvolupador, o… un cop més en funció del sistema operatiu del dispositiu mòbil). Allà ha d’aparèixer la nostra capa.

Ja només ens queda carregar-la i gaudir de l’experiència de la Realitat Augmentada!

Un cop comprovem que tot funciona correctament (a vegades cal ajustar algun punt, refer alguna descripció, corregir algun enllaç…) podem decidir si volem fer pública la capa o no. Si la volem publicar, cal anar a la llista de les nostres capes de Layar.

Podem retornar a la llista de les nostres capes fent clic sobre el botó de la part superior dreta que diu My Layers. Veurem que a l’apartat Status de la capa en qüestió es mostra la paraula Testing. Això vol dir que no és pública. Per publicar-la caldrà fer clic sobre el botó Request approval. Perquè una capa sigui aprovada i publicada ha de superar uns determinats requeriments. Una sèrie de pantalles d’informació ens aniran guiant i informant de si tot ho tenim correcte. Un cop tot llest, la capa es farà pública en un termini de cinc dies.

Molt bona feina!

PerPere Cornellà Canals

Planificació i ús de tècniques per a una comunicació efectiva amb els estudiants

Planificació i ús de tècniques per a una comunicació efectiva amb els estudiants. Aquest és el títol de la sessió que he fet avui dins el marc del Postgrau Interuniversitari en Docència Universitària.

A primera vista és un títol molt pretensiós. Si algú en tingués la clau, tindria l’èxit assegurat en la seva experiència docent…

Tot i així, és cert que podem trobar eines i recursos que ens ajudin a tenir una comunicació més efectiva amb els nostres estudiants. Tot plegat ha de partir del coneixement de la situació del nostre entorn i de com són els nostres estudiants.

Com que m’agrada tot allò que fa referència a la tecnologia educativa, per dur a terme aquesta sessió he posat el “mode tecnologia: ON”. És des d’aquesta perspectiva que he enfocat el meu discurs.

Us deixo la presentació que he utilitzat en la sessió:

PerPere Cornellà Canals

Creativitat, joc i noves tecnologies

El passat divendres 9 de novembre de 2012 vaig participar, al Centre Cultural La Mercè, a les Jornades de reflexió Mirades actuals sobre la creativitat.

Em van proposar de parlar de creativitat, joc i noves tecnologies. Realment la proposta era molt interessant perquè aquests són tres termes que lliguen bé. El plantejament que vaig fer tenia, inevitablement, un rerefons educatiu, com no podia ser d’altra manera.

Aquesta és la presentació que vaig utilitzar en la meva participació:

PerPere Cornellà Canals

Realitat Augmentada al teu web (versió ràpida)

En una entrada anterior he explicat com posar realitat augmentada al teu web a través d’un procediment laboriós, però que ens permetia controlar determinades variables i personalitzar noms.

La intenció d’aquesta nova entrada és la de simplificar tot el procediment i obtenir, de forma ràpida, una aplicació de realitat augmentada que podem posar al nostre lloc web.

Es necessita:

  • un conjunt d’arxius que he modificat a partir de la proposta de Saqoosha FLARToolKit i que he preparat en aquest arxiu comprimit,
  • un marcador (arxiu .pat) al que heu de posar el nom marcador.pat (en aquest espai es mostren dues maneres de crear-los: online i amb BuildAR),
  • un arxiu .dae i, si escau, la carpeta amb les textures; aquest arxiu es pot generar amb el Trimble Sketchup, tal i com s’explica en aquesta entrada. L’arxiu .dae l’heu de batejar amb el nom model.dae (no cal que canvieu el nom a la carpeta.

I ja ho tenim tot! Ara hem de seguir el següent procediment:

  1. descarreguem i descomprimim l’arxiu RA.rar,
  2. posem l’arxiu marcador.pat a la carpeta marcador,
  3. posem l’arxiu model.dae i, si escau, la capeta de textures, a la carpeta model.

I això és tot! Podem comprovar que funciona fent doble clic sobre l’arxiu index.html. I, si volem, pengem tota la carpeta al nostre lloc web.

Bona feina!