Configuratore
Vernici
Il cliente scrive a parole cosa deve fare; il tool compone in pochi secondi un carrello con prodotti e quantità, spiegando il perché di ogni riga.
In una frase, e a chi serve
Cos’è. Una demo web (HTML/JS, nessun build) che interpreta una richiesta a parole e calcola un carrello di vernici con quantità e motivazione.
Il problema che risolve. Il cliente non sa quali e quanti prodotti servono. Qui descrive il lavoro («bagno, 3x4, termosifoni») e ottiene una proposta chiara.
Perché è fatto così. Motore deterministico e offline per la demo (prevedibile e testabile). L’upsell verso il prodotto vero: sostituire l’interprete con Claude API che ritorna lo stesso JSON, senza toccare UI e catalogo.
- TomasMostra al cliente una demo che vende: dal linguaggio naturale al carrello pronto.
- Collaboratore tecnicoEstende catalogo e motore, o collega Claude API per capire qualsiasi frase.
- Cliente rivenditoreFa provare ai suoi clienti un configuratore che riduce gli errori d’ordine.
Stack e strumenti
| Strumento | Ruolo nel progetto | Perché scelto |
|---|---|---|
| HTML/JS classico frontend | La UI del configuratore, gira anche da GitHub Pages. | Semplice, nessuna toolchain. |
src/motore.js logica | Interpreta il testo e calcola. Niente DOM qui. | Deterministico, testabile a parte. |
src/catalogo.js dati | Prodotti, prezzi e rese (di esempio). | Separato dalla logica. |
src/app.js collante | Aggancia UI e motore, disegna il carrello. | Un solo punto per la UI. |
node --test test | 18 test su catalogo + motore. | Regressioni sotto controllo. |
| Claude API futuro | Rimpiazzerebbe l’interprete per capire QUALSIASI frase. | Stesso JSON in uscita, UI invariata. |
Il contratto JSON (non cambia mai)
| Output di motore o API | Perché conta |
|---|---|
{ righe:[{prodotto, qty, perché}], totale, note:[] } | Formato fisso: cambiare il motore non rompe la UI né il catalogo. |
Come funziona - il flusso
Dalla frase del cliente al carrello, in pochi secondi e offline.
Scrivi
Il cliente descrive a parole il lavoro da fare.
testoInterpreta
motore.js estrae misure, usi e prodotti nominati.
Calcola
Quantita e rese in base al catalogo.
catalogo.jsCarrello
app.js mostra le righe con il perché di ognuna.
Ordine
Il carrello va rivisto e confermato da una persona.
manualeDove finiscono le cose
| Cartella | Contenuto |
|---|---|
src/ | catalogo, motore, app. |
test/ | 18 test (node --test). |
docs/ · mockups/ · assets/ | documentazione, mockup, risorse. |
Onboarding collaboratore + spiegazione cliente
Da zero a produttivo
cd tool-vernici; python3 -m http.server 8770, poi aprilocalhost:8770.node --test test/*.test.jsper la logica.- Leggi
src/motore.js: è lì la logica, senza DOM. - Per il prodotto vero: sostituisci
interpretaRichiesta()con Claude API (stesso JSON).
Le competenze minime
JavaScript di base e saper leggere i test Node. Per l’upsell: chiamare Claude API e mappare l’output nel JSON del contratto.
Regola d'oro: prezzi e rese nel catalogo sono di ESEMPIO: prima del prodotto vero vanno sostituiti con quelli reali.
«Il tuo cliente scrive cosa deve verniciare e ottiene subito una lista di prodotti e quantità, con la spiegazione del perché. Meno errori d’ordine, più fiducia.»
È una demo: la versione completa capisce qualsiasi frase, con la stessa interfaccia.
- Dati di esempio. Prezzi e rese non sono reali finché non li sostituisci.
- Serve un mini-server. I browser bloccano
file://: aprila viahttp.server. - È una demo. L’interprete capisce i casi comuni, non ancora qualsiasi frase.
Paletti, limiti e stato
Da fare più avanti
| Claude API | Interprete che capisce qualsiasi richiesta. |
| Catalogo reale | Sostituire prezzi e rese di esempio. |
| Checkout | Collegare a un vero flusso d’ordine. |