AuroraForma · design system Lume — scelto il 25/09/2026. Bianco come materiale, mint per l'offerta, ambra solo per la normativa, righe da 1px invece di ombreAnteprime prodotti →
0
Come leggere questo file
Un solo design system, Lume, scelto il 25/09/2026. Le fasce scure come questa non fanno parte del sistema: sono solo segnaletica per separare le aree. Le note in grigio spiegano le scelte.
A
Fondamenta
Colori, tipografia, componenti primitivi. È il contratto: nessun componente deve contenere un valore scritto a mano.
00
Logo
Principale — su bianco. «aurora» inchiostro, «forma» e simbolo in verde. auroraforma.svgNegativo — su inchiostro e foto scure. auroraforma-negativo.svgMonocromo — stampa a un colore, timbri, attestati. auroraforma-mono.svgSimbolo — favicon, avatar social, dove il nome non ci sta. È il simbolo di Aurora Digital, invariato. auroraforma-simbolo.svg
40px
30px · header
22px · minimo
Misure — il tratto di Curvy è sottile: sotto i 22px di altezza «aurora» si impasta. Più piccolo di così si usa il simbolo.
Area di rispetto — su ogni lato almeno l'altezza della «o». Nessun testo, bordo o altro logo dentro l'area tratteggiata.
Un solo file per variante, tutto in tracciati: il font Curvy non viene mai caricato sul sito, quindi il logo pesa ~10 KB e appare identico ovunque. Unico ritocco al lettering: la «m» senza il ricciolo in alto a sinistra, con la gamba che sale dritta e si raccorda all'arco con la stessa curva degli altri; il file del font non è toccato. Il simbolo è quello di Aurora Digital preso da Grafiche/only_logo.svg, ripulito e senza modifiche alla forma. Nel sito il logo è il componente Logo, con due proprietà: la variante (principale, negativo, mono, simbolo) e l'altezza.
01
Token
Paper#FFFFFF
Paper alt#F7F8F7
Ink#14171A
Ink soft#55595E
Mint#6CC5A4
Mint deep#3E8E72
Mint wash#EEF8F4
Mint text#2E6B56
Ambra#F0C673
Ambra wash#FDF6E7
Ambra deep#8A5B08
Mint per l'offerta: il segno sotto i comandi, i numeri, i dettagli. Per il testo piccolo si usa mint text (6,3:1), mai il mint pieno. Ambra solo per la normativa — scadenze, AI Act, «aggiornato al» — e mai per vendere. Il bottone primario è inchiostro: il mint con testo bianco non passa il contrasto.
Tipografia
Sora per i titoli, Inter per il testo, IBM Plex Mono per i comandi e i nomi dei file. Il logo è in Curvy, ma solo come tracciati: il font non si carica.
Raggi
pill
8
4
0
Pill solo sui bottoni. Le superfici non hanno raggio: sono campi delimitati da righe.
Profondità
Zero ombre. La gerarchia nasce da righe a 1px, dal cambio di fondo e dallo spazio vuoto. È la scelta che tiene il sito lontano dal look «AI slop».
Movimento
Un solo gesto di marca: il tratto mint che entra da sinistra, 0,6s, cubic-bezier(.16,1,.3,1), una volta sola. Per il resto fade in ingresso. Con prefers-reduced-motion tutto è già nello stato finale.
02
Scala tipografica
Display 1
Titolo in due righe
Display 2
Titolo di sezione
Display 3
Titolo di scheda
Lead
Paragrafo di apertura, leggero, che regge due o tre righe senza affaticare e prepara il resto della pagina.
Corpo
Testo corrente. Placeholder, nessuna copy definitiva in questa fase: qui si guarda solo il ritmo della lettura e la lunghezza di riga.
Tre giornate sul vostro codebase, non su esercizi di laboratorio. Nell'ultima si costruisce un tool interno che resta vostro — insieme alla specifica, ai task e alla documentazione che lo hanno prodotto.
Un componente fatto per questo sito, non una barra di navigazione generica. Un solo gesto grafico, lo stesso del resto del marchio: la sottolineatura a pennarello mint che entra da sinistra sotto la voce attiva. A sinistra il logo AuroraForma a 30px (22px sotto i 420px di larghezza).
Corsi apre un pannello con i quattro corsi affiancati e alla pari: nome italiano, comando come etichetta, per chi e quanto dura. Nessun ordine consigliato e nessun rimando fra corsi, perché sono prodotti indipendenti. Obblighi porta l'unica etichetta ambra, riservata alla normativa. La CTA ha il volto di chi risponde alla call: è l'elemento che converte, quindi ha il contrasto più alto della barra (bianco su inchiostro).
Comportamento. In cima alla pagina è trasparente; appena si scorre diventa bianca, sfocata, con una riga da 1px. Scendendo si ritira per lasciare spazio alla lettura, risalendo torna subito. Una barra mint da 2px sul bordo inferiore segna quanto si è letto. Sotto i 900px diventa marchio + «Call» + menu, e il menu apre un foglio con i corsi in cima. Tastiera: Esc chiude e riporta il focus sul pulsante. Con prefers-reduced-motion niente animazioni, solo cambi di stato.
Il footer
Chiude con una domanda, non con un elenco. In cima la frase di chiusura con «vi serve.» in GradientText, lo stesso effetto dell'hero, la call con il volto di Elia e l'email che si copia con un clic. Sotto, quattro colonne: corsi (comando + nome, alla pari), sito, contatti (solo email e call), altrove. In fondo «Powered by Aurora Digital» accanto alla riga legale.
Il logo gigante è vivo. Quando il footer entra in vista le lettere salgono e le barre del simbolo si alzano una dopo l'altra; poi le barre seguono il puntatore come un equalizzatore. È l'unico punto del sito in cui il logo rompe l'area di rispetto: qui fa da superficie grafica, non da firma. Con prefers-reduced-motion è fermo e già completo.
C
I quattro prodotti
La carrellata dei corsi, in cinque proposte da scegliere. Ognuna è una pagina completa: aprila, scorri, provala anche dal telefono.
Dalla fase 2 del business plan: trainer selezionati fra sviluppatori praticanti. Il componente nasce già plurale, così quando arrivano non si rifà la pagina — e nel frattempo non si finge di essere in tanti.
Un solo volto, in grande, è più credibile di quattro riquadri anonimi: il differenziale dichiarato è «lo fa chi sviluppa davvero». La foto va sostituita con uno scatto pensato per questo sito — questa arriva dal tuo sito personale e ha un'inquadratura diversa.
Clienti già formati
Brand di lussotop-10 fashion house
Macchine agricoleagritech
Software housegruppo industriale
17persone nella stessa aula
14giornate erogate nel 2026
4 su 4richieste arrivate senza marketing
«Spazio per una frase del cliente. Placeholder: una riga vera vale più di tre paragrafi di copy.»
⚠️ Questi sono segnaposto presi da auroradigital.it, e servono solo a far vedere come respira il componente: Ermanno e Builtdifferent sono clienti di sviluppo, non di formazione. I clienti formati davvero (le aziende del vault) sono sotto NDA — quindi il componente nasce con tre modalità e nessuna riscrittura fra l'una e l'altra: loghi quando autorizzi, descrizioni anonime come le tre schede qui sopra, solo numeri. I tre numeri vengono dal tuo business plan e non identificano nessuno: sono già pubblicabili oggi. Una sola frase firmata, però, vale più di tutti e tre.
Powered by
Powered by
Un marchio di
Serve a due cose. Per chi compra è rassicurazione: il marchio è nato ieri, ma l'attività dietro esiste dal 2022, con P.IVA, clienti e progetti verificabili — e conta, quando devi firmare un ordine da qualche migliaio di euro a un nome che non conoscevi. Per Google è la relazione parentOrganization nello schema, che porta sul dominio nuovo l'autorità già accumulata da auroradigital.it. Va in footer su tutte le pagine, non nell'hero: è una firma, non un argomento di vendita.
Forma giuridica — da non sbagliare mai. Aurora Digital non è una società: è l'attività individuale di Elia Tolin in regime forfettario. In pagina si scrive sempre «Aurora Digital di Elia Tolin», mai «Srl» e mai «la società»; nello schema Organization va bene, Corporation no. Vale anche per contratti, preventivi e attestati.
E
Metodo e normativa
Due componenti per le pagine di approfondimento: le fasi dello SDD e la banda di scadenza del cluster AI Act.
06
Metodo e normativa
Le fasi del metodo
FASE 01
Costituzione
Descrizione della fase. Placeholder.
› constitution.md
FASE 02
Specifica
Descrizione della fase. Placeholder.
› spec.md
FASE 03
Chiarimento
Descrizione della fase. Placeholder.
› clarify.md
FASE 04
Piano tecnico
Descrizione della fase. Placeholder.
› plan.md
Serve su /metodo/ per le 7 fasi di Spec Kit, e sulla scheda /sdd. La terza colonna con il nome del file è il pezzo che convince un CTO: rende visibile che ogni fase produce un artefatto, che è l'argomento centrale dello SDD.
Banda scadenza
Legge 132/2025 · decreto attuativo
La delega scade il 10 ottobre 2026
Lo schema prevede formazione obbligatoria sui rischi dell'AI dentro il DVR. Il testo definitivo non è ancora pubblicato.
15giorni
Ambra perché è normativa, non offerta. Il componente gestisce tre stati: in attesa (conto alla rovescia), scaduta senza testo pubblicato (e questo è lo stato più probabile l'11 ottobre), testo pubblicato — con il messaggio che cambia. Un contatore fermo a zero è peggio che non averlo mai messo.
Foto presa da eliatolin.com
