Token di movimento
Durate, curve, intensità e soglie. Esposti come variabili CSS e JSON per la massima portabilità.
- Scale di timing (100–700 ms)
- Curve personalizzate con nomi semantici
- Livelli di energia per contesto
Lumenkite Motion System
Una libreria di componenti animati, token e linee guida che rende l’interazione più chiara, affidabile e piacevole. Pensata per team che vogliono risultati misurabili senza sacrificare performance e accessibilità.
Compatibile con CSS/Canvas/Lottie e integrazione fluida in framework moderni. Ogni elemento è documentato e pronto per la produzione.
Componenti animati
Pulsanti, banner, liste, modali, onboarding steps. Stati chiari, focus visibile e transizioni coerenti.
- Stati :hover/:focus/:disabled
- Preset ingressi/uscite e transizioni
- Documentazione di utilizzo
Linee guida
Principi, esempi e checklist QA. Ogni scelta è giustificata con impatto su chiarezza e metrica.
- Esempi con code snippet
- Pattern per errori e conferme
- Indicazioni per mobile e web
Specifiche tecniche
- Performance: budget chiari, GPU-friendly, lazy mount dei layer.
- Accessibilità: rispetto “riduci movimento”, focus visibile, alternative statiche.
- Formati: CSS variables, JSON (Lottie), SVG/Canvas.
- Framework: integrazione con librerie moderne e design token pipeline.
−20%eventi di errore su task guidati
+12%completion onboarding
Incluso
- Repository con componenti e token
- Playbook PDF e pagina di riferimento
- Checklist QA e test di performance
- Supporto all’integrazione
Opzionale
- A/B test con varianti di timing
- Workshop per team design/dev
- Estensioni per piattaforme mobile
Sicurezza & compliance
Nessun tracking superfluo. Rispetto privacy e policy store. Codice versionato e auditabile.
Vuoi provarlo sul tuo prodotto?
Prenota una demo: vedrai componenti reali sul tuo flusso critico e una stima di impatto.