Nel corso degli anni il team di Blockly e Blockly Games ha imparato molte lezioni applicabili a chi sviluppa nuovi blocchi. Di seguito sono riportate alcune insieme di errori commessi o comunemente commessi da altri.
Queste sono lezioni generali che abbiamo appreso usando lo stile visivo di Blockly. potrebbero non applicarsi a tutti i casi d'uso o a tutti i progetti. Esistono altre soluzioni. Questo è e non esaustivo dell'elenco dei problemi che gli utenti potrebbero riscontrare e di come evitarli. che li rappresentano. Ogni caso è un po' diverso e ha i suoi compromessi.
1. Condizionali e loop
I blocchi più difficili per i nuovi utenti sono le condizionali e i loop. Molti gli ambienti basati su blocchi raggruppano entrambi questi blocchi negli stessi "Controlli" ed entrambi i blocchi hanno la stessa forma e lo stesso colore. Questo spesso crea frustrazione, dato che i nuovi utenti confondono i due blocchi. Blockly consiglia di spostare condizionali e loop in una "Logic" separata e "Loop" categorie, ognuna con un colore diverso. Questo chiarisce che sono idee distinte che si comportano in modo diverso pur avendo forme simili.
Consiglio: mantieni separati le condizionali e i loop.
2. Elenchi basati su uno
I programmatori alle prime armi reagiscono male quando si imbattono per la prima volta in elenchi basati su zero nel tempo. Di conseguenza, Blockly segue l'esempio di Lua e Lambda Moo creando una lista e l'indicizzazione delle stringhe in base uno.
Per usi più avanzati di Blockly, è possibile creare elenchi con base zero la transizione al testo. Per un pubblico più giovane o per i neofiti l'indicizzazione in base a una singola è comunque consigliata.
Consiglio: uno è il primo numero.
3. Input utente
Esistono tre modi per ottenere un parametro dall'utente. Un menu a discesa è più restrittiva ed è ideale per tutorial ed esercizi semplici. Un campo di immissione consente maggiore libertà ed è ideale per attività più creative. Un blocco di valore (di solito con un blocco ombra) offre l'opportunità di calcolare un valore (ad es. un generatore casuale) invece di essere solo un valore statico.
Consiglio: scegli un metodo di inserimento appropriato per i tuoi utenti.
4. Immagini di blocchi live
La documentazione relativa ai blocchi deve includere immagini dei blocchi a cui fa riferimento a. Acquisire screenshot è facile. Ma se esistono 50 immagini di questo tipo, l'applicazione viene tradotta in 50 lingue, all'improvviso si mantengono 2.500 di immagini statiche. La combinazione di colori cambia e 2500 immagini devono essere aggiornate. -- di nuovo.
Per liberarci da questo incubo di manutenzione, Blockly Games ha sostituito tutti gli screenshot con istanze di Blockly in esecuzione in modalità di sola lettura. Il risultato sembra identico a un'immagine, ma è garantito che sia aggiornato. Sola lettura ha reso possibile l'internazionalizzazione.
Consiglio: se supporti più di una lingua, utilizza la modalità di sola lettura.
5. L'altra sinistra
Feedback da bambini negli Stati Uniti (sebbene non sia provenienti da altre nazioni) rivelava una confusione dilagante tra sinistra e destra. Il problema è stato risolto con aggiunta di frecce. Se la direzione è relativa (ad esempio a un avatar), lo stile delle frecce è importante. Una → freccia dritta o una freccia di svolta ↱ non è chiara quando l'avatar è rivolto nella direzione opposta. La più utile è una circolare ⟳ anche nei casi in cui l'angolo di rotazione è inferiore a quello indicato dalla freccia.
Consiglio: se possibile, integra il testo con icone Unicode.
6. Blocchi di alto livello
Ove possibile, si dovrebbe adottare un approccio di livello superiore, anche se riduce le prestazioni o la flessibilità dell'esecuzione. Considera questa espressione di Apps Script:
SpreadsheetApp.getActiveSheet().getDataRange().getValues()
Nell'ambito di una mappatura 1:1 che preserva tutte le potenziali funzionalità, quanto riportato sopra viene creata usando quattro blocchi. Blockly punta a un livello più alto e fornire un blocco che incapsula l'intera espressione. L'obiettivo è per il 95%, anche se rende più difficile il restante 5%. Blockly non è pensato per sostituire le lingue basate su testo, ma con lo scopo di aiutare gli utenti a superare la curva di apprendimento iniziale in modo da poter utilizzare lingue basate su testo.
Consiglio: non convertire in modo cieco l'intera API in blocchi.
7. Valori restituiti facoltativi
Molte funzioni nella programmazione basata su testo eseguono un'azione, quindi restituiscono
un valore. Questo valore restituito può essere utilizzato o meno. Un esempio sono le proprietà
Funzione pop(). Potremmo chiamare Pop per recuperare e rimuovere l'ultimo elemento,
oppure potrebbe essere chiamato per rimuovere solo l'ultimo elemento con il valore restituito
vengono ignorati.
var last = stack.pop(); // Get and remove last element. stack.pop(); // Just remove last element.
Le lingue basate su blocchi in genere non sono adatte a ignorare un valore restituito. R value deve essere collegato a qualcosa che accetta il valore. Esistono diverse strategie per risolvere questo problema.
a) Cercate di risolvere il problema. La maggior parte delle lingue basate su blocchi progetta il linguaggio per evitare questi casi. Ad esempio, Scratch non ha blocchi con sia gli effetti collaterali che un valore restituito.
b) Prevedi due blocchi. Se lo spazio negli strumenti non è un problema, una semplice è quella di fornire due di ciascuno di questo tipo di blocco, uno con e uno senza un valore restituito. Lo svantaggio è che questo può generare confusione degli attrezzi con molti blocchi quasi identici.
c) Modifica di un blocco. Utilizza un menu a discesa, una casella di controllo o un altro controllo che consenta l'utente può scegliere se è presente un valore restituito o meno. Il blocco poi cambia forma in base alle opzioni. Un esempio può essere visualizzato nel blocco di accesso all'elenco di Blockly.
d) Mangia il valore. La prima versione di App Inventor creava una barra verticale speciale o un blocco che ha mangiato un valore connesso. Gli utenti non capivano il concetto e la seconda versione di App Inventor ha rimosso il blocco barra verticale, consiglia agli utenti di assegnare semplicemente il valore a una variabile usa e getta.
Consiglio: ogni strategia presenta pro e contro, scegli la soluzione più adatta i tuoi utenti.
8. Blocchi crescenti
Alcuni blocchi potrebbero richiedere un numero di input variabile. Gli esempi sono blocco di addizione che somma un insieme arbitrario di numeri o if/elseif/else blocco con un insieme arbitrario di clausole elseif o un costruttore di elenco con un numero arbitrario di elementi inizializzati. Esistono diverse strategie, ciascuna con i suoi vantaggi e svantaggi.
a) L'approccio più semplice consiste nel fare in modo che l'utente componi il blocco su isolati. Un esempio potrebbe essere l'aggiunta di tre numeri, nidificando due numeri blocchi di addizione. Un altro esempio potrebbe essere fornire solo blocchi if/else, e facendoli nidificare dall'utente per creare condizioni "otherif".
Il vantaggio di questo approccio è la sua semplicità iniziale (sia per l'utente che lo sviluppatore). Lo svantaggio è che, nel caso in cui ci sia una grande quantità di nidificazioni, il codice diventa molto complicato e difficile per l'utente per leggere e gestire.
b) Un'alternativa è espandere dinamicamente il blocco in modo che ci sia sempre un input libero alla fine. Allo stesso modo, il blocco elimina l'ultimo input se sono presenti due input liberi alla fine. Questo è l'approccio usato nella prima versione È stato utilizzato App Inventor.
Gli utenti di App Inventor non hanno apprezzato per un paio di blocchi la crescita automatica di motivi. In primo luogo, c'è sempre stato un input libero e il programma non è mai "complete". In secondo luogo, per inserire un elemento al centro della pila frustrante in quanto comportava la disconnessione di tutti gli elementi sotto la modifica e ricollegandoli. Detto questo, se l'ordine non è importante e gli utenti possono è un'opzione molto comoda.
c) Per risolvere il problema, alcuni sviluppatori aggiungono i pulsanti +/- ai blocchi che aggiungere o rimuovere manualmente gli input. Apri Roberta utilizza due pulsanti di questo tipo per aggiungere o rimuovere gli input dalla parte inferiore. Altri sviluppatori aggiungono due pulsanti riga, in modo che l'inserimento e l'eliminazione dalla parte centrale dello stack possano accolti. Altre aggiungono due pulsanti su/giù in ciascuna riga in modo che lo stack può essere adattato.
È una strategia che comprende una gamma di opzioni che vanno da soli due pulsanti per blocco, fino a quattro pulsanti per riga. Da un lato, c'è il pericolo che gli utenti non eseguire le azioni di cui hanno bisogno, dall'altro lato l'UI è piena di pulsanti che sembrano il ponte dell'astronave Enterprise.
d) L'approccio più flessibile consiste nell'aggiungere un fumetto mutatore al blocco. Questo è rappresentato da un singolo pulsante che apre una finestra di dialogo di configurazione bloccare. Gli elementi possono essere aggiunti, eliminati o riorganizzati a piacimento.
Lo svantaggio di questo approccio è che i mutatori non sono intuitivi utenti inesperti. L'introduzione dei mutatori richiede una qualche forma di istruzione. Le applicazioni basate su blocchi rivolte ai bambini più piccoli non dovrebbero utilizzare mutatori. Anche se, una volta apprese, sono preziosissime per gli utenti esperti.
Consiglio: ogni strategia presenta pro e contro, scegli la soluzione più adatta i tuoi utenti.
9. Generazione di codice pulito
Gli utenti Advanced Blockly devono essere in grado di esaminare il codice generato (JavaScript, Python, PHP, Lua, Dart e così via) e riconoscere immediatamente il programma che hanno scritto. Ciò significa che è necessario uno sforzo aggiuntivo per mantenere questo codice generato automaticamente leggibili. parentesi superflue, variabili numeriche, spazi vuoti ridotti I modelli di codice dettagliati ostacolano tutti la produzione di codice elegante. Il codice generato deve includere commenti e deve essere conforme alle Guide di stile di Google.
Consiglio: essere orgoglioso del codice generato. Mostralo all'utente.
10. Dipendenza linguistica
Un effetto collaterale del desiderio di codice pulito è che il comportamento di Blockly ampiamente definiti in termini di comportamento del linguaggio cross-compilato. Il più il linguaggio di output più comune è JavaScript, ma se Blockly effettuasse query a un'altra lingua, non si devono fare tentativi irragionevoli per preservare comportamento esatto in entrambe le lingue. Ad esempio, in JavaScript viene restituito è false, mentre in Lua è true. La definizione di un singolo pattern di comportamento del codice di Blockly da eseguire a prescindere dalla lingua di destinazione generare un codice non gestibile, che sembra provenire dal compilatore GWT.
Consiglio: Blockly non è una lingua, consenti alla lingua esistente di hanno un impatto sul comportamento.