Posar puntuacions a les lliçons fetes amb Google Breadcrumb

Seguint amb el tema de Google Breadcrumb que vaig comentar fa uns dies, he escrit un petit tutorial de fer lliçons amb puntuació. Això permet fer preguntes al lector i, segons la resposta que seleccioni., rebrà una puntuació una altra.

Això és molt útil, tant per motivar al lector com per donar-li unes mètriques sobre el que ha aprés. Ja veureu que és molt fàcil.

Primera pàgina, iniciar el comptador a zero punts

Com es va comentar a la introducció, les pàgines d'una lliçó comencen totes amb un parèntesi que n'indica el nom. Per exemple (1) seria la pàgina anomenada "1". El que no vaig dir és que el nom de la pàgina no és l'única cosa que pot anar dins els parèntesis.

Si després del nom posem ":" Google Breadcrumb interpretarà la resta com una instrucció. Així, si fem "(1:score=0)" en carrega la pàgina "1" el sistema crearà una variable anomenada "score" i se li assignarà un valor inicial de zero.

A continuació poso el codi d'exemple:

(1:score=0) Ara mateix tens 0 punts així que no et preocupis. [Continuar] (2)

Com fer que les respostes sumin o restin punts

A l'anterior article vàrem veure que si posem "[text] (pàgina)" es convertia automàticament en un enllaç cap a una altre pàgina de la lliçó. Per exemple "[Continuar] (2)" faria que la paraula "Continuar" es converteixi en un enllaç cap a la pàgina "2".

Doncs igual com passava amb els parèntesis de l'inici de pàgina, els parèntesis dels enllaços també poden tenir instruccions. Així doncs, si fem per exemple "[Correcte] (3:score++)", quan l'usuari faci clic sobre "Correcte" s'incrementarà la variable puntuació en 1 i s'anirà a la pàgina "3", i si fem "[Erroni] (3:score--)" si l'usuari fa clic sobre "Erroni"la variable "score" decrementarà en 1 i també s'anirà a "3" .

Un codi d'exemple seria:

Llavors si barrejo groc i blau faré verd?

1.[Sí] (7:score++)

2.[No] (5:score--)

Com imprimir la puntuació actual

Com podeu suposar, mantenir la puntuació no serveix de res si no la mostres a l'usuari. Per fer que el valor d'una variable surti per pantalla només cal escriure "<%= nomvariable %>". Per exemple, si fem "La teva puntuació és <%= score %>" es mostrarà el valor actual d'score.

Un codi d'exemple seria:

La teva puntuació és <%= score %>

Un exemple sencer

Com ja podeu imaginar,  he fet un exemple on es posa en pràctica tot això. Si el voleu provar des del navegador podeu seguir aquest enllaç. I si ho voleu provar des del mòbil us deixo el codi QR d'accés.

Codi QR de la lliçó amb puntuació

Una cosa bona que té Google Breadcrumb és que és possible veure el codi font de qualsevol lliçó. En aquest cas podeu accedir al codi amb aquest enllaç.

Tinc també exemple més avançat que implementa un parell de minijocs amb javascript que el deixo per un tercer (i final) article.

El meu abecedari friki

Fa un temps vaig veure en algun bloc que algú havia fet el seu propi abecedari friki. La idea em va fer gràcia i la vaig proposar a les xarxes socials però no em van fer massa cas.

Reprenent la idea, he fet el meu propi abecedari friki amb alguns dels referents que em m'han influït. Tot un atac de nostàlgia.

 L'abecedari friki de La Veu de T

Si algú s'anima a fer-ne un que avisi i li posaré el link al Sospir de T.

Com aconseguir un canal RSS d'un usuari de Twitter

Faig una entrada petita per un matí poc aprofitat. Des que fa uns dies vaig iniciar El Sospir de T, alguns m'heu preguntat com seguir un usuari de Twitter amb un feed RSS. La veritat és que ho vaig contestar per Twitter directament, però entenc que també hauria d'estar com a article.

Twitter va eliminar fa un temps la sindicació RSS per algun estrany motiu. Tot i això és pot fer un truc fent servir l'API de Twitter. Concretament, l'API per a realitzar cerques no només permet filtrar per usuari, sinó que, a més, permet el retorn de resultats en format RSS.

D'aquesta manera,si accedim a la url http://search.twitter.com/search.atom?q=+from%3AElSospirDeT veurem la RSS de l'usuari (en aquest cas de l'usuari ElSospirDeT). Així de fàcil. (via The Sociable).

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.

4 anys d'articles: selecció personal

Continuant amb la celebració dels 4 anys segueixo amb els llistats d'articles. Aquest cop amb els que considero que formarien part del top de l'any des del meu punt de vista, independentment de l'impacte i les visites:

1. El format del guió cinematogràfic: justament, obligar-me a aprendre coses noves és el principal motiu d'existència d'aquest blog i aquest article i els 2 relacionats (el primer i el segon) em van obligar a indagar en temes que desconeixia però m'interessaven.
2. Espelmes d'església virtuals: m'esperava escriure un article curtet i va ser molt divertit anar estirant i veure com la bola s¡'anava fent grossa.
3. Rol en Viu a Barcelona: una mirada antropològica: si bé aquest treball tindria més sentit com a part del meu portafoli (que tinc intenció d'obrir en breu), considero que m'ha obligat a plantejar-me molts temes i veure'ls des d'un punt de vista diferent.
4. Arcaron el secreto de Shier'pe: aquest macro article en 4 parts descriu i aprofundeix en una experiència que per mi va ser molt enriquidora i que considero que, com tots els articles sobre el rol en viu del bloc, aporten una visió menys estereotipada de la que se'n té normalment.
5. Feliç dia de l'IPv6: em va servir per refrescar molts conceptes de la carrera d'informàtica i m'agrada com va quedar el resultat final

A mode de menció, també voldria afegir l'especial de Sitges 2010 que, com sempre, és un dels esdeveniments més importants del bloc. Principalment perquè em serveix d'excusa per escriure crítica cinematogràfica.

El sospir de T

Fa temps vaig decidir que no em faria un compte microblogging (a Twitter) fins que no tingués un smartphone amb tarifa de dades. Aquest moment ja pràcticament ha arribat, només em falta la tarifa de dades però sóc una mica impacient, així ja l'he creat.

 El sospir de T

El nou lloc és diu El Sospir de T i ja podeu veure l'enllaç a la dreta (els que entreu al blog). La meva idea és parlar dels temes que no comento al blog o que, simplement, no requereixen d'una explicació més enllà dels 160 caràcters.

En breu, tots els sospirs que publiqui aniran publicat automàticament a les xarxes socials (Facebook, Buzz i Google+ de moment), o sigui que bàsicament serà on centralitzaré els missatges públics. De moment publicaré poc però suposo que ja anirà creixent a mida que vagi acostumant-m'hi.

La veu és el seny, el sospir la rauxa.

4 anys d'articles: els més llegits

Per continuar amb la tradició dels aniversaris, llisto els articles que s'han vist més durant aquest any. La veritat és que tampoc és un mètrica molt fiable perquè només inclou lectures directes des de la web i omet tant els agregadors d'RSS com les visites a la pàgina principals, però de moment és l'única manera que tinc de veure-ho:

1. Què és un troç de quòniam? sembla que aquest és el gran article del blog i cada any hi ha algú que el recupera en alguna xarxa social.
2. Perquè les càmeres compactes són un festivla d'ulls vermells? un altre clàssic. En el fons me n'alegro perquè això vol dir que la gent encara fa servir Internet per aprendre (encara que sigui procrastinant), i no només per perdre el temps.
3. Com funciona un projector digital DLP: aquest ha pujat molt. Curiosament sembla que interessen més que els projectors LCD, unes quantes posicions per sota.
4. Revisionat de Despertaferro (El grito en el fuego): per mi va ser tot un atac de nostàlgia i veig que no sóc l'únic que recorda aquesta pel·lícula.
5. Exposició de cine NIC a Girona: va ser una gran exposició i que deixessin fer fotografies em va permetre fer un gran article. A veure si n'aprenen la resta de museus.
6. Primer concurs de microrealts: realment és una gran idea, llàstima que no sortís del tot bé.
7. Zombie Walk Sitges 2008: molta foto i poc text. Pot ser que siguin una bona recepte actualment perquè un article sigui vist.
8. Parentiu en català i castellà: tinc la sospita que pujarà moltes posicions l'any que ve.
9. Arcaron el secreto de Shier'pe (Part 1): va ser una gran partida i es mereix estar al rànquing.
10. Hora.cat: aprendre a dir l'hora en català: suposo que el títol es lleugerament enganyós i per això està en aquesta posició.
11. Exemples de microrelats: quan em miro aquest article em donen ganes d'organitzar-ne un altre concurs. Algú s'anima a buscar patrocinadors?
12. Arcaron el secreto de Shier'pe (Part 2): amb dos terços de les visites de la part 1.
13. Com funciona un projector LCD: només té un terç de les visites que ha generat el DLP.
14. La llar d'infants lliure: un article que es resisteix a marxar del rànquing tot i que la majoria de la gent que hi va em temo que no troba el que busca.
15. Recàrrega de cotxes elèctric a Andorra: pel que he sabut avui, es veu que comencen a haver-n'hi a Barcelona.

Fins aquí els 15 articles amb més visites. M'estic pensant si posar els menys vistos perquè considero que la mètrica és massa poc exacte, el que sí que segur faré és el dels incompresos.