Il barattolo delle biglie

Cosa fa

Come funziona

Valori da cambiare

Quando usarla

Per contare qualcosa che si accumula e fa piacere vedere crescere: i kudos o i ringraziamenti in un team, le stelle date a un progetto, i punti di una raccolta, le mance, i giorni di fila di un’abitudine, i voti di una piccola classifica. Sta bene nella scheda di una persona, in una bacheca interna, in un’app per le squadre o per la scuola, dovunque un numero che sale debba sembrare un premio e non una statistica.

Sul telefono

A 390 pixel il barattolo prende tutta la larghezza e i pulsanti restano alti 58; niente sfora di lato e la tela usa la densità dello schermo, quindi le biglie restano nitide. Il dito fa come il mouse: un tocco dà una biglia, tenuto premuto versa, il barattolo si trascina di lato col dito (lo scorrimento in verticale della pagina resta libero) e un tocco sul vetro è un colpetto. Il tocco lungo non apre menu e due tocchi veloci non ingrandiscono la pagina.

Con il movimento ridotto

Niente cadute, rimbalzi, rotolamenti o scosse: la biglia nuova compare già posata dove sarebbe arrivata (il mondo fa i suoi passi tutti insieme, senza disegnarli) e sfuma dentro; quella tolta sfuma dove stava e le altre sono già al loro posto. Il numero cambia con una dissolvenza invece di scorrere, il cartellino non oscilla e il barattolo non si trascina.

Trappole

• Il mucchio pieno non si addormentava mai: le biglie in fondo avevano velocità fra 50 e 110 unità al secondo pur restando ferme, e si ridisegnava per sempre. Le spinte riusate dal passo prima (warm starting) si applicavano mentre i contatti venivano ancora creati, e i contatti creati dopo misuravano il rimbalzo su velocità già cambiate da quelle spinte: biglie ferme in fondo al mucchio rimbalzavano. Ora prima si creano tutti i contatti e si decide chi rimbalza, poi si applicano le spinte: il barattolo pieno si ferma mezzo secondo dopo l’ultima biglia.
• Scuotendo forte il barattolo le biglie volavano sopra l’orlo: dentro le pareti le tengono in fila anche più su (salgono all’infinito), ma sopra il barattolo sembravano galleggiare fuori. La velocità verso l’alto di una biglia ha un tetto, quella che le basta per arrivare appena sotto l’orlo.
• A quaranta biglie il mucchio superava l’orlo: un mucchio di cerchi buttati alla rinfusa riempie circa sette decimi dello spazio, non i nove di quelli ordinati. Il barattolo è più alto, le biglie appena più piccole, e il numero massimo si ricava dalla misura delle biglie, così nel Playground le biglie grandi non traboccano.
• Nel Playground, con rimbalzo e gravità al massimo insieme, il mucchio non si fermava più: in fondo a una pila alta il risolutore lascia velocità di avvicinamento che crescono con la gravità, e sopra la soglia diventavano rimbalzi che ridavano energia. Ora rimbalza solo un contatto nuovo; uno che c’era già al passo prima è un appoggio.
• Senza attrito e senza perdita di giro, una biglia che girava girava per sempre (il giro non era legato a niente) e il mondo non si addormentava: il giro perde sempre un poco, nell’aria, e la soglia sotto cui una biglia è ferma cresce con la gravità.
• Con biglie più grandi degli angoli arrotondati del fondo il raggio dell’angolo veniva negativo e le biglie uscivano dal vetro: l’angolo ha un raggio minimo e le biglie un raggio massimo di 21.
• Una biglia che compariva in cima alla tela, sul bianco, nasceva dal nulla: la parte alta della tela sfuma con una maschera, e le biglie ci entrano da fuori.
• Il cartellino girava al clic, mentre la biglia era ancora in aria: ora conta le biglie arrivate, al primo contatto. Il pulsante pieno, il meno e la frase letta seguono invece il conteggio vero, subito.
• Un clic dopo la pressione contava due biglie (pointerdown versa, poi arriva click): la pressione segna che il clic è già stato contato e il segno si cancella al fotogramma dopo; il clic dell’anteprima automatica e dei lettori di schermo, che arriva senza pressione, dà una biglia.
• L’anello di focus del barattolo non si vedeva: un’ombra interna si disegna sotto i figli, e gli strati del vetro la coprivano. È uno pseudo-elemento sopra tutto.
• Le due metà dell’orlo, con sfumature diverse, si incontravano ai lati in due cunei bianchi: dove si toccano hanno lo stesso vetro, e i capi sono due mezzi tondi.

Librerie

Collaudo

Licenza d’uso

Puoi usarla nei tuoi progetti e in quelli dei tuoi clienti. Non puoi rivenderla né ridistribuirla così com’è. GSAP resta sotto la sua licenza Standard. Licenza completa.