Come creare un calcolatore di preventivi con Claude o ChatGPT

Ilya SpiridonovIlya Spiridonov
16 min di lettura

Conosci i tuoi prezzi, ma un potenziale cliente non ha un modo semplice per provarli. Non può scegliere un pacchetto, aggiungere qualche pagina e vedere il totale cambiare senza aspettare un tuo preventivo.

Claude e ChatGPT possono creare quel calcolatore da un listino. Tu fornisci prezzi e regole, l'IA scrive la pagina e restano due compiti: controllare i numeri e ottenere dalla conversazione un file funzionante. Questo articolo spiega entrambi, con un prompt da incollare e sei risultati da verificare.

Prova prima l'esempio finito. Scegli un pacchetto, cambia il numero di pagine aggiuntive e attiva o disattiva le opzioni.

Il tuo progetto

Una landing page e un ciclo di revisioni.

$150.00 a pagina, fino a 10. Sconto del 5% sulle pagine aggiuntive da 5 pagine.

Opzioni

Stima

Prezzo base
$800.00
Pagine aggiuntive0 × $150.00
$0.00
Sconto quantitàDa 5 pagine aggiuntive
$0.00
Redazione
$0.00
Totale una tantum
$800.00
Assistenza mensileAddebitata ogni mese
$0.00
Prima fattura stimataTotale una tantum più il primo mese di assistenza
$800.00

Stima illustrativa. Imposte escluse. Ambito e prezzo definitivi sono confermati nel preventivo. Importi in USD.

I prezzi sono inventati per una piccola agenzia web e le imposte sono escluse. Sostituiscili con i tuoi dopo aver capito come funziona l'insieme.

Definisci prezzi e regole

Parti dai numeri, prima del prompt. L'IA costruisce ciò che descrivi: un listino vago produce un calcolatore vago. Questo contiene sei prezzi e una sola regola di sconto.

VocePrezzoAddebito
Pacchetto Basic$800Una tantum
Pacchetto Standard$1,200Una tantum
Pacchetto Plus$1,800Una tantum
Landing page aggiuntiva$150 ciascuna, da 0 a 10Una tantum
Redazione testi$200, facoltativaUna tantum
Assistenza mensile$75, facoltativaOgni mese

A questi prezzi si aggiungono tre regole:

  • Da cinque pagine aggiuntive si applica il 5% di sconto all'intera voce delle pagine aggiuntive. Il pacchetto e la redazione non vengono mai scontati.
  • L'assistenza mensile resta fuori dal totale una tantum: un canone mensile comporta un impegno diverso dal costo di realizzazione.
  • La prima fattura stimata somma il totale una tantum e un mese di assistenza.

Il calcolatore parte da Basic, zero pagine aggiuntive ed entrambe le opzioni disattivate. Se il numero di pagine è vuoto, negativo, decimale o superiore a 10, compare un errore accanto al campo e i totali restano nascosti fino alla correzione.

Calcola tu i risultati prima di chiedere qualsiasi cosa. Ogni versione deve superare questi sei casi:

  • Minimo. Basic, 0 pagine aggiuntive, nessuna opzione. Una tantum $800.00, mensile $0.00, prima fattura $800.00.
  • Quantità. Standard, 2 pagine aggiuntive, nessuna opzione. Una tantum $1,500.00, mensile $0.00, prima fattura $1,500.00.
  • Opzione. Standard, 2 pagine aggiuntive, redazione. Una tantum $1,700.00, mensile $0.00, prima fattura $1,700.00.
  • Sotto la soglia di sconto. Standard, 4 pagine aggiuntive, redazione. Una tantum $2,000.00, mensile $0.00, prima fattura $2,000.00.
  • Alla soglia di sconto. Standard, 5 pagine aggiuntive, redazione e assistenza. Una tantum $2,112.50, mensile $75.00, prima fattura $2,187.50.
  • Massimo. Plus, 10 pagine aggiuntive, redazione e assistenza. Una tantum $3,425.00, mensile $75.00, prima fattura $3,500.00.

Questi totali sono stati calcolati separatamente dal calcolatore, e l'esempio sopra li restituisce tutti correttamente. Incolla nel prompt il listino, le tre regole e i sei risultati; conserva questi ultimi per le verifiche successive.

Crea il calcolatore in Claude

Claude è il percorso principale perché può creare il calcolatore come artefatto interattivo, uno strumento funzionante accanto alla conversazione. Anthropic include gli artefatti nei piani Free, Pro, Max, Team ed Enterprise; occorre attivare l'esecuzione del codice e la creazione di file.

Incolla il prompt

Apri una nuova conversazione su claude.ai o nell'app desktop. Inizia con Crealo come artefatto interattivo autonomo, completo e senza risorse esterne. per ricevere un artefatto duraturo invece di una visualizzazione temporanea nella chat. Poi incolla il prompt seguente e aggiungi in fondo listino, tre regole e sei risultati attesi nel punto indicato.

Crea un calcolatore di preventivi interattivo e funzionante per una piccola agenzia web.
Fornirò sotto il listino e le regole di prezzo. Usa esattamente quei valori.
Se manca una regola o ci sono contraddizioni, chiedimi prima di scegliere un valore.

Il risultato è un artefatto autonomo e completo: un'anteprima e un unico file
integrale scaricabile chiamato quote-calculator.html. Inserisci HTML, CSS e
JavaScript nel file, senza caricare font, immagini o script esterni. Deve
funzionare aprendo il file nel browser, senza installazioni, librerie esterne,
chiamate all'IA o server.

Inserisci un selettore di pacchetti, un campo numerico per le pagine aggiuntive
e caselle per redazione e assistenza mensile. Aggiorna la stima quando cambiano
i dati. Mostra separatamente, con etichette, prezzo base, pagine aggiuntive,
sconto, redazione, totale una tantum, assistenza mensile e prima fattura stimata.
Formatta i valori in USD con due decimali.

Aggiungi: «Stima illustrativa. Imposte escluse. Ambito e prezzo definitivi sono
confermati nel preventivo». Inserisci un pulsante Reimposta.

Le pagine aggiuntive devono essere un numero intero da 0 a 10. Se il campo è
vuoto o non valido, mostra un errore accanto e nascondi i totali fino alla
correzione. Parti con Basic, zero pagine e opzioni disattivate.

Usa etichette chiare, focus da tastiera visibile e controlli leggibili sul telefono.
Usa ID stabili: package, extra-pages, copywriting, monthly-support, reset.
Raggruppa i prezzi in un blocco di configurazione etichettato.
Non raccogliere contatti, inviare ordini, salvare selezioni né accettare pagamenti.
Non includere codice di tracciamento: hosting e tracciamento sono separati.

Prima della consegna, controlla la tabella dei risultati attesi fornita.
Segnala le correzioni e dammi il file HTML definitivo.

Listino, formule e risultati attesi:
[Incolla qui le tabelle fornite.]

Tre parti del prompt vanno conservate nelle tue versioni. Chiedere chiarimenti quando manca una regola fa emergere lacune prima che le trovi il cliente. Un solo file autonomo senza risorse esterne rende il calcolatore portabile. Il confronto finale con la tabella offre una prima verifica, senza sostituire la tua.

Preferisci allegare un file? Aggiungi rate-card.csv con il pulsante + e Add files or photos, oppure trascinalo nella chat. Anthropic include CSV tra i documenti supportati.

Il file contiene prezzi, regole e formule dei totali. Sostituisci le ultime due righe del prompt con l'istruzione seguente e incolla sotto solo i sei risultati attesi.

Tariffe e regole sono nell'allegato rate-card.csv. Conferma quelle che hai letto,
poi crea il calcolatore come file autonomo e completo, senza risorse esterne.

Esamina la prima versione

Dovresti vedere un menu dei pacchetti, un campo per le pagine aggiuntive, due caselle per le opzioni, un pulsante Reimposta e sette importi separati: prezzo base, pagine aggiuntive, sconto, redazione, totale una tantum, assistenza mensile e prima fattura stimata. Cambiando un dato, la stima deve aggiornarsi senza premere pulsanti.

Perfeziona il risultato

Se un totale è errato, spiega il problema come a una persona: indica il caso e il risultato che aspettavi.

Ogni totale sbagliato rimanda a una regola. Standard con cinque pagine aggiuntive, redazione e assistenza deve mostrare $2,112.50. Un totale una tantum di $2,042.50 indica che lo sconto è stato applicato a tutto invece che alle sole pagine aggiuntive; $2,150.00 indica che lo sconto è stato saltato.

Se svuotando il campo resta un vecchio totale o appare NaN, chiedi direttamente: «Quando il numero di pagine aggiuntive è vuoto, mostra un errore accanto al campo e nascondi i totali. Mantieni un solo file autonomo senza risorse esterne». Cambia una cosa per messaggio e ripeti il caso fallito.

Esporta il file

Quando i numeri coincidono, recupera il file dalla conversazione. Se Claude ha usato il modello Design, premi Export e scegli HTML autonomo. La pagina degli artefatti di Anthropic indica Export come comando per gli artefatti da modello, e la guida a Claude Design include HTML autonomo tra i formati di esportazione.

Se non c'è un'opzione HTML, chiedi a Claude l'intero calcolatore in un unico file autonomo e completo chiamato quote-calculator.html, senza risorse esterne e scaricabile.

Usa Claude Cowork con un listino esistente

Cowork aggiunge un flusso basato sulle cartelle all'allegato CSV: Claude legge il file da una cartella del computer e vi salva il calcolatore finito, senza caricamenti o download. Anthropic spiega che può leggere e scrivere file locali nelle cartelle collegate.

Metti rate-card.csv in una cartella e collegala nell'app desktop Claude. Cowork è disponibile nei piani a pagamento, cioè Pro, Max, Team ed Enterprise.

Usa lo stesso prompt e la stessa prima riga, ma sostituisci le ultime due righe sul listino da incollare con l'istruzione seguente. Il file contiene prezzi e regole: sotto incolla solo i sei risultati attesi.

Leggi rate-card.csv dalla cartella collegata. Conferma le tariffe e le regole lette.
Crea il calcolatore come file HTML autonomo e completo, senza risorse esterne,
e salvalo come quote-calculator.html in quella cartella. Non modificare il
listino originale e dimmi dove hai salvato il risultato.

Cowork esegue le attività nel cloud e accede alla cartella attraverso l'app desktop: lasciala aperta mentre lavora.

Alcuni account mostrano ancora Chat e Cowork separati: scegli Cowork. Anthropic li sta unendo in una sola conversazione, gradualmente e iniziando da Pro e Max. Se il tuo account è già aggiornato, fai la stessa richiesta in una normale conversazione e collega la cartella dall'app desktop come prima.

Usa ChatGPT come alternativa

Listino, prompt e sei verifiche restano gli stessi: cambiano solo creazione e download. Incolla in ChatGPT lo stesso prompt con tariffe, regole e risultati attesi. Il risultato deve essere lo stesso quote-calculator.html autonomo e completo, senza risorse esterne, scaricabile.

La documentazione OpenAI spiega che i file HTML generati possono aprirsi come anteprime interattive dove la funzione è disponibile, e che gli strumenti di anteprima e revisione dipendono dall'interfaccia. Per ChatGPT Work sul web indica di esaminare il file nella chat e scaricarlo quando serve.

ChatGPT può anche presentare una pagina come Site, Canvas o anteprima HTML invece di un file. La guida alla condivisione di siti HTML generati con ChatGPT tratta ogni caso. Senza anteprima, scarica il file e aprilo nel browser.

In ogni caso, verifica il file scaricato: è la versione che condividerai.

Verifica il calcolatore esportato

Un calcolatore può sembrare corretto e sbagliare i conti. Un totale errato davanti a un cliente costa denaro o credibilità. Chiudi la conversazione con l'IA ed esegui queste verifiche sul file scaricato.

  1. Aprilo con un doppio clic. Deve funzionare nel browser senza accesso a un account, connessione internet o Claude aperto.
  2. Scegli Standard, inserisci 2 pagine aggiuntive e attiva redazione. Il totale una tantum deve essere $1,700.00.
  3. Passa a 4 pagine: $2,000.00 senza sconto. Passa a 5 e attiva assistenza mensile: $2,112.50 una tantum, $75.00 mensili e $2,187.50 alla prima fattura, con una riga sconto di -$37.50.
  4. Svuota il campo e prova -1, 2.5 e 11. Ogni caso deve mostrare un errore accanto al campo e nascondere i totali fino alla correzione.
  5. Premi Reimposta. Deve tornare a Basic, 0 pagine, entrambe le opzioni disattivate e $800.00.
  6. Esegui gli altri casi della lista di sei. Plus con 10 pagine ed entrambe le opzioni è un buon ultimo controllo: $3,425.00, $75.00 e $3,500.00.
  7. Riduci la finestra alla larghezza di un telefono o apri il file sul telefono. Non deve esserci scorrimento orizzontale e i controlli devono essere facili da toccare.
  8. Metti da parte il mouse e usa la tastiera. Tab deve attraversare ogni controllo con un bordo di focus visibile; Spazio deve attivare le caselle. In Safari su Mac, Tab raggiunge pulsanti e altri controlli solo con Navigazione da tastiera attiva nelle impostazioni Tastiera.

Poi apri il file in un editor di testo. I prezzi devono comparire una sola volta, insieme, in un blocco etichettato. Più avanti modificherai quel blocco tu o con l'IA.

Tieni i numeri riservati fuori dal file

Chi apre il file può leggerne il codice: costi interni, margini e soglie di approvazione non devono esserci. I calcoli nel browser non impongono neppure i prezzi approvati, perché il destinatario può modificare la propria copia.

Condividi il calcolatore con un cliente

Invia un link invece del file. Email e archiviazione cloud tendono a mostrare l'HTML come codice o a bloccarlo, come spiega la guida alla condivisione di HTML con i clienti.

Claude permette di condividere l'artefatto, con opzioni che dipendono dal piano e dalle impostazioni dell'organizzazione. Secondo la documentazione Anthropic, serve un account Claude per aprire un artefatto appena condiviso, salvo quelli precedenti pubblicati da una chat. È adatto a un collega che usa Claude e aggiunge un passaggio per un cliente senza account.

Per un link apribile da qualsiasi cliente, carica il file esportato su un host che serva HTML. Il nostro prodotto HummingDeck lo fa; la pagina di condivisione HTML spiega i dettagli.

Un singolo HTML funziona nel piano gratuito. Ecco i passaggi:

  1. In Libreria documenti, scegli Aggiungi documento e quote-calculator.html. Il file deve rispettare i requisiti di caricamento HTML.
  2. Finita l'elaborazione, scegli Nuovo link, seleziona un link personale e creane prima uno per te, chiamandolo come test.
  3. Aprilo in una finestra privata come farà il cliente e ripeti le verifiche. Il visualizzatore esegue il file in un frame isolato: funzionare sul tuo computer non prova che funzioni il link del destinatario.
  4. Crea allo stesso modo il link personale del cliente e invialo. La visita di prova resta sul link di test e quello del cliente parte senza attività. Dopo l'apertura, consulta Link nel documento per trovare la visita associata a quel link.

Se la trattativa comprende più documenti, inserisci il calcolatore in una Room con un preventivo fisso e un caso studio: il cliente apre un solo link. Il piano gratuito permette una Room con fino a tre documenti; il modello di preventivo per web design funziona come preventivo fisso.

Cosa indicano stima e attività

Calcolatore e preventivo hanno compiti diversi. Il primo consente di esplorare opzioni e vedere una stima; la cifra a cui ti impegni va in un preventivo fisso che emetti tu.

Per far rispondere il cliente al preventivo, un link di preventivo registra accettazione, richiesta di modifiche o rifiuto nei piani Pro e Business. La risposta è un evento del flusso di lavoro collegato al documento: non acquisisce una firma né ciò che mostrava il calcolatore.

Nel piano gratuito la pagina del documento mostra aperture totali, visitatori unici, tempo trascorso e completamento medio. Starter e superiori aggiungono analisi per pagina e clic supportati. La guida alle analisi su una pagina HTML confronta questa soluzione con gli script analitici. Un clic su pulsanti, caselle, menu o campo numerico del calcolatore conta come clic su link; vedi il conteggio per visitatore e sessione.

Cosa mostra l'attività

  • Una visualizzazione indica che il link è stato richiesto e una sessione è iniziata. Non verifica chi l'ha aperto e il link può essere inoltrato.
  • Il numero di clic riflette l'uso dei controlli. HummingDeck non mostra le opzioni scelte né il totale sullo schermo; digitare un numero o cambiare il menu con la tastiera non conta come clic.
  • Nessuno dei due segnali prova l'intenzione di acquisto. Usali per decidere quando un ricontatto sarebbe utile.

CPQ, abbreviazione di configure, price, quote, è uno strumento diverso. Salesforce lo descrive come software che aiuta a configurare prodotti, applicare regole di prezzo, gestire sconti e approvazioni e generare preventivi, integrandosi con CRM ed ERP.

Questo calcolatore gestisce configurazione e prezzi di un listino semplice. Per salvare preventivi, mantenere un catalogo privato o approvare sconti serve un sistema di preventivazione.

Domande frequenti

Serve Claude Cowork per creare un calcolatore di preventivi?

Basta una conversazione normale con Claude: incolla il listino o allega rate-card.csv. Cowork aggiunge un flusso a cartelle: Claude legge il file da una cartella collegata e vi salva il calcolatore. Per accedere alla cartella servono un piano Claude a pagamento e l'app desktop aperta.

Posso partire da un listino Excel o Google Sheets?

Esporta il listino in CSV e allegalo alla conversazione, oppure incolla la tabella nel prompt. Prima di creare qualcosa, chiedi all'IA di ripetere ogni prezzo e regola letti. Confrontali con il foglio e verifica il calcolatore con totali calcolati nel foglio stesso.

Come invio un calcolatore interattivo a un cliente?

Invia un link invece del file. Carica l'HTML su un host che lo serva, per esempio un link HummingDeck nel piano gratuito, oppure condividi l'artefatto da Claude se il cliente ha un account. Prova prima con un tuo link separato, così la visita non compare su quello del cliente.

Un calcolatore di preventivi equivale a un software CPQ?

Un calcolatore mostra una stima da un listino fisso. Il software CPQ applica anche regole di prezzo e approvazioni di sconti, genera preventivi e si integra con CRM ed ERP. Lascia esplorare le opzioni nel calcolatore, poi invia un preventivo fisso con il prezzo a cui ti impegni.

Come cambio i prezzi in seguito?

Modifica i numeri nel blocco tariffe etichettato oppure chiedi all'IA di cambiarli nello stesso file autonomo e ripeti le sei verifiche. Poi usa Sostituisci sul documento HummingDeck, mantenendo attivi i link esistenti. Sostituisci non è disponibile con un link di preventivo attivo: revocalo prima.

Il calcolatore può inviarmi il preventivo o salvare le scelte del cliente?

La versione di questo articolo calcola soltanto nel browser. Inviare preventivi, salvare selezioni o accettare pagamenti richiede un servizio di moduli, un database o un sistema di preventivazione dietro la pagina. Tieni queste funzioni fuori dal calcolatore e invia un preventivo fisso al prezzo a cui ti impegni.

Informazioni sull'autore

Ilya Spiridonov è il fondatore di HummingDeck, una piattaforma di condivisione documenti che serve file HTML autonomi a destinatari esterni tramite link tracciabili.

Fonti

Condividi il tuo calcolatore di preventivi con un link

Articoli correlati: