Gira la Ruota
Scrivi le tue opzioni, gira la ruota
Ogni riga nel campo diventa uno spicchio. Premi gira, la ruota ruota e rallenta, e lo spicchio sotto la freccia vince.
Niente viene caricato da nessuna parte. Le tue voci vivono nella scheda del browser e svaniscono quando la chiudi.
Il vincitore viene scelto prima che la ruota si muova
Questo conta più di quanto sembri.
Il modo ovvio di costruire una ruota è darle una spinta casuale, lasciare che l’attrito la rallenti, e leggere qualsiasi cosa finisca sotto la freccia. Questo approccio fa dipendere il risultato dall’arrotondamento dell’angolo finale e da quanti fotogrammi di animazione il tuo dispositivo è riuscito a disegnare — un telefono lento e un desktop veloce non sarebbero ugualmente equi.
Questa ruota fa il contrario. Estrae prima un vincitore da crypto.getRandomValues(),
poi calcola la rotazione esatta che porta quello spicchio sotto la freccia e anima
fino a quel punto. Il giro è la presentazione; l’estrazione è già decisa e
dimostrabilmente uniforme.
Ogni spicchio ha quindi esattamente la stessa probabilità, a prescindere da quanti spicchi ci sono, da quanto sono lunghe le loro etichette o dal dispositivo che usi.
Rimuovi il vincitore, o continua a girare la ruota intera
Con rimuovi il vincitore attivo, ogni giro toglie la voce vincente dalla ruota. Gira più volte e ottieni un ordine: primo, secondo, terzo. Utile per estrarre più premi, o per decidere l’ordine di presentazione davanti a una sala.
Con l’opzione disattivata, la ruota resta intera e la stessa opzione può vincere due volte — che è ciò che vuoi per “dove mangiamo stasera”.
Ponderare la ruota ripetendo una voce
La ruota dà a ogni spicchio la stessa probabilità, quindi il modo per favorire un’opzione è darle più spicchi. Elencarla due volte raddoppia la sua quota.
| Voci | Spicchi | Probabilità per Pizza |
|---|---|---|
| Pizza, Sushi, Tacos | 3 | 33% |
| Pizza, Pizza, Sushi, Tacos | 4 | 50% |
| Pizza ×3, Sushi, Tacos | 5 | 60% |
Le etichette duplicate compaiono sulla ruota più di una volta, il che è onesto — chiunque osservi può contare gli spicchi e vedere la ponderazione invece di doverti credere sulla parola. Questa visibilità è proprio il punto di una ruota; un peso nascosto la vanificherebbe.
Per pesi più fini che non rientrano bene negli spicchi, il generatore di numeri
casuali accetta invece coppie esplicite numero:peso.
Quanti spicchi restano leggibili
Gli spicchi si restringono man mano che le voci crescono, e le etichette sono disegnate lungo il raggio, quindi c’è un limite pratico ben al di sotto di qualsiasi limite tecnico.
- Fino a 12 — comodo, le etichette si leggono a colpo d’occhio
- Da 12 a 20 — leggibile, ma i nomi lunghi iniziano ad affollarsi
- Da 20 a 30 — utilizzabile solo per etichette brevi
- Oltre 30 — la ruota funziona ancora e l’estrazione resta equa, ma nessuno riesce a leggerla mentre gira
Le etichette più lunghe di 18 caratteri vengono tagliate con un’ellissi così restano dentro il loro spicchio. Se la tua lista è abbastanza lunga da rendere la ruota illeggibile, il selettore di nomi fa lo stesso lavoro senza la messa in scena.
Accessibilità e movimento
La ruota rispetta prefers-reduced-motion. Se il tuo sistema richiede un movimento
ridotto, l’animazione del giro viene saltata e il vincitore appare immediatamente.
Il risultato è identico in entrambi i casi, perché l’estrazione non è mai dipesa
dall’animazione.
Il vincitore viene anche annunciato in una regione live, così i lettori di schermo lo leggono ad alta voce senza che l’utente debba cercarlo.
Dove si usa una ruota selettrice
- Decidere — pranzo, film, quale faccenda fare
- Live streaming e classi — il giro è il punto centrale; le persone lo guardano
- Concorsi a premi — un’estrazione visibile sembra più equa a un pubblico rispetto a un numero che compare
- Rompighiaccio — chi risponde alla prossima domanda