← Tutti i progettiAll projects
🦺
Case study · Mercato italianoItalian market

ScadenzaSicura

Lo scadenzario della formazione sulla sicurezza e delle visite mediche per le micro-imprese: calcola quando scade ogni adempimento e mostra a semaforo cosa rinnovare.A tracker for workplace safety training and medical check-ups for micro businesses: it works out when each obligation expires and shows what to renew with a traffic light.

Interfaccia in italianoItalian interfaceHTML · CSS · JavaScriptCostruita con ClaudeBuilt with ClaudeDati solo nel browserData stays in the browser
Prova l'appTry the app → Gratuita, senza account, con dati di esempio.Free, no sign-up, with sample data.
10tipi di corso e visitatraining and check-up types
4stati a semaforotraffic-light states
6 mesidi timelinetimeline
0server e accountservers and accounts

Cosa faWhat it does

Come l'ho costruitaHow I built it

L'ho costruita in vibecoding con Claude: ho descritto il problema, le regole e l'aspetto che volevo, Claude ha scritto il codice, io l'ho provata, ho chiesto correzioni e ho deciso cosa tenere. Il risultato è una sola pagina HTML con stile e script dentro, senza framework e senza server: i dati restano nel browser di chi la usa, che può esportarli o cancellarli.I built it through vibe coding with Claude: I described the problem, the rules and the look I wanted, Claude wrote the code, I tested it, asked for fixes and decided what to keep. The result is a single HTML page with styles and scripts inside, no framework and no server: data stays in the user's browser, where it can be exported or deleted.

Scelte tecnicheTechnical choices

Un motore di date sempliceA simple date engine

Ogni scadenza è la data dell'ultimo corso più la sua periodicità in mesi; lo stato dipende dai giorni che mancano. Pochi calcoli, ma applicati ovunque in modo coerente.Each expiry is the last course date plus its renewal period in months; the state depends on the days left. A few calculations, applied consistently everywhere.

Timeline in SVGSVG timeline

La timeline dei sei mesi è un SVG costruito dal codice, con i punti colorati per stato e un'etichetta al passaggio del mouse.The six-month timeline is an SVG built by the code, with dots colored by state and a label on hover.

Registro con la stampa del browserRegister via browser print

Il registro è una pagina con uno stile di stampa dedicato: si salva in PDF dalla finestra di stampa, senza generatori di PDF.The register is a page with a dedicated print style: it is saved as PDF from the print dialog, with no PDF generator.

Dati di esempio relativi a oggiSample data relative to today

I dati dimostrativi sono generati rispetto alla data di oggi, così il semaforo mostra sempre tutti gli stati. Si possono azzerare per partire da zero.The demo data is generated relative to today's date, so the traffic light always shows every state. It can be reset to start from scratch.

Cosa ho verificatoWhat I tested