dijous, 14 de juliol del 2011

Google Breadcrumb: lliçons amb realitat augmentada fàcils de fer

Ahir, via el bloc d'un tal Marcello Rinaldi, vaig descobrir una petita aplicació de Google Labs que m'ha semblat molt interessant. L'aplicació en qüestió es diu Google Breadcrumb. De moment està clarament en beta, però té molt bona pinta.

Què és Google Breadcrumb?

Google Breadcrumb permet definir lliçons amb una sintaxi molt senzilla. Una lliçó són un conjunt de pàgines amb enllaços entre elles, com una mena de wiki però amb un recorregut ja definit. A més, és possible posar-hi codi javascript si es volen programar activitats i d'altres comportaments més avançats.

Fins aquí cap novetat. La gràcia està amb què la interfície està adaptada per dispositius mòbils i que, per cada lliçó, el programa genera un QR-code. Perquè serveix això? Doncs bàsicament permet posar el QR-code en qualsevol lloc (imprès en un pòster, en una diapositiva d'una presentació, enganxat pel carrer, tatuat...) i qualsevol smartphone serà capaç d'accedir a la lliçó fent una foto del codi (en Android amb el BarcodeScanner).

El programa està pensat per aportar un component de realitat augmentada a les explicacions. Per exemple, si s'està fent un conferència sobre diversos temes, permetria incloure un QR a les transparències que portessin a una lliçó sobre els punts principals que s'estan tocant en aquell moment. Així, l'audiència podria, tot fent una fotografia amb el móbil, accedir a l'índex de la presentació, o bé se li podrien donar referències per ampliar allò que s'està explicant, i ho tindrien directament al mòbil.

Un exemple senzill

La següent captura mostra la interfície de Google Breadcrumb amb un exemple extremadament senzill:

Exemple de lliçó amb Google Breadcrumb (feu clic per veure millor)

La interfície d'edició mostra 4 elements: el requadre on escriure el codi de la lliçó, una previsualització de com es veuria en un dispositiu mòbil, un diagrama amb els recorreguts que podria fer l'usuari i el codi QR d'accés a la lliçó. Per si voleu provar-ho, us deixo el codi QR en gran.

Codi QR d'accés a la lliçó simple

Si mireu el codi veureu que no cal saber massa res per definir una lliçó. La sintaxi bàsica és:
  • Si una línia comença amb alguna cosa escrita entre parèntesis, vol dir que allà s'inicia una de les pàgines de la lliçó (que s'identifica amb el nom que hi hagi dins els parèntesis). Tot el que s'escrigui fins que es trobi un altre inici de pàgina, formarà part de la pàgina actual. Per exemple, si una línia comença "(2) bla,bla,bla..." vol dir que s'ha iniciat la pàgina amb nom "2".
  • Si un text es posa entre claus, per exemple [així] vol dir que és un enllaç. Si després de les claus es posa alguna cosa entre parèntesis vol dir que l'enllaç anterior va on digui el parèntesis. Per exemple "blabla [som-hi] (2) blabla" vol dir que la paraula "som-hi" apareixeria com un enllaç i en fer clic portaria a la pàgina anomendada "2". També e spoden posar direccions externes entre parèntesis.
  • La resta del format es pot fer amb html estàndard (imatges, taules, llistes...).
He provat de fer un exemple força més complex tot usant javascript per donar-li una mica més d'interactivitat a la lliçó, però com que l'article em quedaria massa llarg i una mica més tècnic, ho deixo per més endavant.

NOTA: per a Android hi ha una aplicació anomenada Crouton dissenyada específicament per a Google Breadcrumb. A més de fer les lliçons, permet emmagatzemar-les en local per fer-les més endavant.

NOTA 2: d'acord, potser no és exactament realitat augmentada, però no em negareu que no ven més dir-li així que lliçons mòbils amb QR-code. Al cap i a la fi volia que no només els geeks com jo entenguessin perquè pot servir.