Passa al contenuto principale

🤳🏼 QR Code

Il livello QRCode disegna un codice QR che le persone inquadrano con la fotocamera del telefono. L'uso principale è quello statico, dove scrivi tu il valore e questo non cambia mai. Puoi usarlo anche come contenuto dinamico, aggiungendolo come sottolivello di un altro livello: in questo caso il codice viene ricostruito per ogni elemento che quel livello mostra.

Il valore non deve per forza essere un indirizzo web. Il campo QRCode Type dice al telefono che cosa contiene il codice, così lo stesso livello può consegnare un biglietto da visita, un evento da mettere in calendario o le credenziali Wi-Fi della sala.

Funziona offline

Il codice viene disegnato sul dispositivo, quindi un codice statico non ha bisogno di alcuna connessione di rete. Un codice dinamico aggiunto come sottolivello segue il livello padre, che invece una connessione la richiede per scaricare gli elementi di cui stampa i codici.

Un livello QRCode sopra un'immagine, con i suoi campi Content e Advanced

Aggiungi il livello a un progetto

  1. Apri la sezione Progetto e apri o crea il progetto in cui vuoi il codice.
  2. Clicca su Add Layer e scegli QRCode dal gruppo Advanced.

La voce QRCode nel pannello Add Layer

  1. Nella scheda Content, scrivi il valore in Data e scegli il Color del codice.
  2. Apri Advanced e imposta QRCode Type in base a quello che hai scritto. Selezionare un tipo riscrive Data con il formato che quel tipo si aspetta, quindi scegli prima il tipo e poi sostituisci il suggerimento con il tuo valore.
  3. Nella scheda Shape, dimensiona e posiziona il codice. Tieni larghezza e altezza uguali, perché un codice QR è quadrato.
Imposta il tipo prima del dato

Cambiare QRCode Type sovrascrive con un suggerimento di formato tutto quello che si trova già in Data. Se scrivi prima il valore e cambi il tipo dopo, il valore va perso e devi riscriverlo.

Tipi di codice QR

Data è un unico campo di testo per tutti i tipi. I tipi che richiedono più di un valore li leggono da una sola riga separata da virgole, nell'ordine indicato qui sotto: la posizione di ogni virgola è quindi importante.

QRCode TypeChe cosa scrivere in DataChe cosa fa il telefono quando lo scansiona
URLhttps://voome.comApre la pagina nel browser.
TextUn testo qualsiasiMostra il testo così com'è.
Phone NumberIl numero da chiamarePropone di comporre il numero.
SMSIl numero a cui scrivereApre un nuovo messaggio verso quel numero.
Emailnome@dominio.comApre una nuova email verso quell'indirizzo.
WifiSSID, PASSWORDSi collega alla rete WPA con quelle credenziali.
EventNOME EVENTO, LUOGO, DATAORAINIZIOPropone di aggiungere l'evento al calendario.
VCardNOME PERSONA, TELEFONO, EMAIL, SITO WEBPropone di salvare il contatto in rubrica.

Per Event, l'inizio è un timestamp UTC compatto: 20181106T160405Z significa 6 novembre 2018 alle 16:04:05. Una riga completa è per esempio Open Day, Sala Principale, 20181106T160405Z.

Per VCard, il nome viene diviso in corrispondenza del primo spazio, quindi Mario Rossi, +39 02 1234567, mario.rossi@example.com, https://example.com viene salvato come cognome e nome.

Niente virgole dentro i valori

Wifi, Event e VCard dividono la riga a ogni virgola. Una password, un luogo o il nome di un'azienda che contengono una virgola spostano nel campo sbagliato tutti i valori successivi, e il codice risulta illeggibile o errato. Scegli valori senza virgole.

Codici dinamici: il QR code come sottolivello

Due livelli possono produrre un codice QR per ogni elemento invece di uno solo fisso: SharePoint e Json API. Entrambi espongono il proprio campo indirizzo come sottolivello QRCode, così il codice a schermo punta sempre all'elemento visualizzato in quel momento. Un carosello di notizie preso da SharePoint può stampare, accanto a ogni articolo, il codice che apre proprio quell'articolo sul telefono.

Per stampare l'indirizzo della pagina SharePoint che si trova a schermo:

  1. Aggiungi e configura il livello SharePoint: scegli le credenziali Microsoft, il sito e il tipo di elementi. L'elenco dei sottolivelli resta vuoto finché il livello non ha letto il sito.
  2. Apri la scheda Sublayers e clicca su Add sublayer.
  3. Nell'elenco Dynamic, scegli Url. Viene aggiunto come sottolivello QRCode con Data già compilato con il segnaposto ((item.url)), che si risolve nell'indirizzo di ogni elemento man mano che il livello li scorre.
  4. Dimensionalo e posizionalo nella scheda Shape, poi imposta Color e i campi Advanced come faresti per un codice statico.

Un layout SharePoint con un codice QR dinamico che stampa l'indirizzo dell'elemento a schermo

Il segnaposto funziona solo dentro il livello che lo mette a disposizione. Scrivere ((item.url)) in un livello QRCode a sé stante produce un codice vuoto, perché non c'è nessun livello contenitore da cui leggere l'elemento.

Campi del contenuto

  • Data: il valore che il codice porta con sé. Obbligatorio. Il valore predefinito è https://voome.com. Il formato dipende da QRCode Type, vedi la tabella qui sopra.
  • Color: il colore del codice vero e proprio, nero per impostazione predefinita. Tienilo scuro: gli scanner si basano sul contrasto tra il codice e il suo sfondo.

Campi avanzati

  • QRCode Type: che cosa contiene il codice, URL per impostazione predefinita. Decide come viene interpretato Data.
  • Type Number: la versione del QR, da 1 a 10, oppure auto (predefinito). La versione stabilisce la dimensione della griglia e quindi quanti dati ci stanno. Lascialo su auto e viene usata la versione più piccola che contiene il tuo valore. Una versione fissa troppo piccola per il valore non produce alcun codice.
  • Error Correction Level: quanta parte del codice può essere sporca, danneggiata o coperta e restare comunque leggibile: 7%, 15% (predefinito), 25% o 30%. I livelli più alti perdonano di più ma comprimono più moduli nello stesso quadrato, quindi il codice diventa più fitto e ha bisogno di più spazio a schermo.
  • Background: white (predefinito) o transparent. Scegli white sopra le foto e gli sfondi movimentati. transparent funziona solo quando ciò che si vede in trasparenza è uniforme e abbastanza chiaro da mantenere il contrasto.
  • Generator: optimal_mask_is_skipped (predefinito) o with_optimal_mask. La seconda opzione calcola la maschera migliore per il tuo valore e impiega più tempo a disegnare. Lascia il valore predefinito, a meno che un codice non si faccia scansionare.

🙋🏼 Problemi comuni

Il codice nell'editor non è il mio codice

L'editor di progetto disegna al posto del codice QR un'immagine di esempio fissa, la stessa per ogni livello QRCode, quindi scansionarla nell'editor non porta da nessuna parte. Clicca su Preview per vedere il codice vero costruito a partire dal tuo Data, e scansionalo da lì.

Il codice non si fa scansionare

Verifica in quest'ordine le quattro cose che rovinano un codice. Il contrasto, quindi tieni un Color scuro e, sopra le foto, un Background white. La dimensione, quindi ingrandisci il livello, perché un valore fitto ha bisogno di più spazio. La distanza, tenendo presente che le persone scansionano da dove si trovano, non da dove l'hai progettato. Infine il valore stesso, perché un indirizzo molto lungo produce un codice fitto, difficile da leggere a qualsiasi dimensione.

Il codice Wi-Fi, evento o contatto apre qualcosa di sbagliato

I valori vengono letti per posizione, divisi sulle virgole. Conta le virgole nel tuo Data: Wifi ne richiede una, Event due, VCard tre. Ogni virgola dentro un valore ne aggiunge una in più e sposta tutto quello che viene dopo.

Il codice dinamico è vuoto su alcuni elementi

Il sottolivello stampa quello che l'elemento porta in quel campo. Un elemento senza indirizzo restituisce un valore vuoto, quindi per lui non viene disegnato nessun codice. Controlla l'elemento in SharePoint, poi verifica che il livello lo stia ancora restituendo.

Il codice sembra deformato

La scheda Shape ti lascia impostare larghezza e altezza in modo indipendente, ma il codice è sempre quadrato. Imposta i due valori uguali, altrimenti il codice viene disegnato nello spazio del lato più corto e il resto del livello resta vuoto.