Esempi di prompt per una web app: 10 prompt per SaaS, strumenti interni e portali clienti
Dieci prompt completi per una web app, un paragrafo ciascuno, pronti da incollare in un creatore di app con IA. Ognuno indica i ruoli e chi vede cosa, il login, la vista elenco principale, gli stati, le email e i pagamenti, con i prompt di follow-up da inviare dopo.
Ecco 10 esempi di prompt per una web app da copiare in un creatore di app con IA: tre prodotti SaaS, tre strumenti interni, due portali clienti e due dashboard. Ognuno sta in un paragrafo ed è pronto da inviare come primo messaggio. Sostituite le parti tra [parentesi quadre] e tenete il resto. Un prompt per una web app si distingue da un prompt per un sito soprattutto per una cosa: dice chi accede, cosa può vedere e modificare ogni ruolo, e cosa succede quando un record cambia stato.
I prompt seguono i sette blocchi (contesto, obiettivo, utenti, schermate, dati, vincoli, tono) dei nostri esempi di prompt per creare un'app, e aggiungono le cinque righe che servono a una web app con utenti reali. Per un'app che vive su un telefono, usate invece i nostri esempi di prompt per un'app mobile.
Cosa deve dire un prompt per una web app che un prompt per un sito non dice
Un sito mostra le stesse pagine a tutti. Una web app mostra a ogni utente i suoi dati, lascia che alcuni li modifichino e altri solo li leggano, e fa passare i record da uno stato al successivo. Cinque righe coprono la differenza:
Riga
Cosa scrivere
Perché conta
Ruoli e permessi
Ogni ruolo, e cosa può vedere e modificare: «un cliente vede solo le proprie fatture»
Senza questa frase, l'IA costruisce una sola schermata che mostra ogni record a ogni utente
Login
Chi si registra, come, e chi viene invitato: «email e Google, i clienti solo su invito»
Registrazione aperta e solo su invito sono due app diverse
Vista elenco principale
Le colonne, i filtri e la ricerca della schermata che si usa tutto il giorno
In un'app aziendale, la maggior parte del tempo si passa in una sola tabella
Stati
I passaggi di un record, in ordine: «nuovo, in corso, in attesa, completato»
Gli stati guidano i filtri, la dashboard e le email
Email e pagamenti
Quale evento invia quale email, e cosa si paga, con quale frequenza
Un'email senza un evento che la fa partire diventa spam; un prezzo senza una regola diventa un bug
La prima riga è quella che si salta, ed è quella che conta di più. Il controllo degli accessi errato, in cui un utente può leggere o modificare dati che non sono suoi, è in cima alla OWASP Top 10 dei rischi per le applicazioni web. In un'app costruita su Supabase, quelle regole diventano policy di row level security nel database, come descritto nella documentazione di Supabase. Una frase chiara nel prompt è ciò che permette all'IA di scriverle.
Prompt per SaaS
Un SaaS ha clienti che si registrano da soli, pagano un abbonamento e lavorano ciascuno nel proprio spazio. Il prompt deve dire cosa contiene un account, cosa è gratuito e cosa è a pagamento, e cosa mostra la parte pubblica prima della registrazione.
Bacheca di feedback dei clienti
SaaS · Prodotto
Crea una web app SaaS in cui [le software house] raccolgono le richieste di funzionalità dei propri utenti. Ruoli: titolare dello spazio di lavoro, membro del team, utente finale (vota e commenta, nessun accesso alla parte admin). Login: titolari e membri si registrano con email o Google; gli utenti finali accedono con email dalla bacheca pubblica. Schermate: bacheca pubblica con le richieste ordinate per voti, dettaglio della richiesta con i commenti, roadmap pubblica in tre colonne, elenco admin di tutte le richieste con filtri per stato e tag, impostazioni dello spazio con logo e colore della bacheca. Dati: uno spazio ha molte bacheche; una richiesta ha un titolo, una descrizione, dei tag, un numero di voti e uno stato (in valutazione, pianificata, in corso, rilasciata). Vincoli: un voto per utente finale per richiesta, un'email ai votanti quando una richiesta passa a rilasciata, un piano gratuito con [1 bacheca] e un piano a pagamento a [$19 al mese] tramite Stripe con bacheche illimitate. Stile pulito: bianco, indaco, tabelle compatte.
Gestione candidati per una piccola agenzia
SaaS · Selezione del personale
Crea una web app per [un'agenzia di selezione del personale con 8 recruiter] per seguire i candidati. Ruoli: admin, recruiter, cliente (vede solo la rosa dei candidati per le proprie posizioni aperte). Login: il personale con email, i clienti con un link di invito. Schermate: elenco delle posizioni aperte, pipeline di una posizione come bacheca Kanban (individuato, screening, colloquio, offerta, assunto, scartato), scheda candidato con caricamento del CV, note e cronologia, vista del cliente con la rosa dei candidati e i pulsanti approva o rifiuta. Dati: un'azienda cliente ha molte posizioni; una posizione ha molte candidature; una candidatura collega un candidato a una posizione e ha una fase. Vincoli: file dei CV salvati in privato e visibili solo al personale e al cliente interessato, un'email al recruiter quando un cliente approva un candidato, ricerca per nome e competenza, importazione dei candidati esistenti da un file CSV. Stile professionale: bianco, verde scuro, elenchi fitti.
Appunti di riunione con IA
SaaS · Strumento IA
Crea una web app per [team di consulenza] che trasforma la trascrizione di una riunione in un riassunto e in un elenco di attività. Ruoli: admin del team, membro. Login: email o Google; l'admin invita i membri. Schermate: incolla o carica una trascrizione (testo o file .vtt), risultato dell'IA (riassunto, decisioni, attività con responsabile e scadenza) che l'utente modifica prima di salvare, elenco delle riunioni con ricerca, elenco delle attività di tutte le riunioni filtrato per responsabile e stato. Passaggio IA: la trascrizione va a un modello linguistico tramite una funzione lato server; la chiave API non arriva mai al browser; l'utente rivede sempre prima di salvare. Dati: un team ha molte riunioni; una riunione ha un riassunto e molte attività; un'attività ha un responsabile, una scadenza e uno stato (aperta, completata). Vincoli: i membri vedono solo le riunioni del proprio team, un'email settimanale a ogni membro con le sue attività aperte, [50 riunioni al mese] nel piano a pagamento. Stile calmo: bianco sporco, grafite, un solo accento verde acqua.
Prompt per strumenti interni
Uno strumento interno sostituisce un foglio di calcolo diventato troppo grande. Nessuno si registra da solo: l'admin invita il team. Il prompt spende le sue parole sulla tabella principale, sugli stati e su chi può modificare cosa. Il nostro creatore di strumenti interni mostra il metodo nel dettaglio.
Tracciamento di magazzino e scorte
Strumento interno · Operazioni
Crea una web app interna per [un negozio di ricambi con 2 magazzini] per tenere traccia delle scorte. Ruoli: admin, addetto al magazzino (registra i movimenti, non può cambiare i prezzi), commerciale (sola lettura). Login: email, solo su invito. Schermate: elenco prodotti con la giacenza per magazzino, filtri per categoria e fornitore e un filtro «sotto il minimo», dettaglio prodotto con la cronologia dei movimenti, modulo per registrare un movimento (entrata, uscita, trasferimento tra magazzini), elenco fornitori, bozza di ordine d'acquisto costruita con i prodotti sotto il minimo. Dati: un prodotto ha un codice, un fornitore, un livello minimo e una giacenza per magazzino; un movimento ha un tipo, una quantità, una data e la persona che lo ha registrato. Vincoli: la giacenza non scende mai sotto zero, ogni modifica è registrata con il suo autore, importazione CSV del catalogo attuale, un'email giornaliera all'admin con i prodotti sotto il minimo. Stile pratico: bianco, blu navy, tabelle grandi.
CRM per la pipeline commerciale
Strumento interno · Vendite
Crea una web app CRM semplice per [un team B2B di 5 commerciali] che vende [corsi di formazione]. Ruoli: responsabile vendite, commerciale. Login: email, solo su invito. Schermate: pipeline come bacheca Kanban (contatto, contattato, incontro, proposta, vinto, perso) con trascinamento, dettaglio dell'opportunità con contatti, note, prossima azione e importo, elenco aziende, le mie attività di oggi, dashboard del responsabile con il valore della pipeline per fase e per commerciale. Dati: un'azienda ha molti contatti e opportunità; un'opportunità ha un titolare, un importo, una fase e una data della prossima azione. Vincoli: i commerciali vedono tutte le opportunità ma modificano solo le proprie, il responsabile modifica tutto, un'email di promemoria al mattino per le prossime azioni scadute, importazione CSV dei contatti esistenti, un motivo obbligatorio quando un'opportunità passa a perso. Stile deciso: bianco, nero, un solo accento arancione.
Checklist di inserimento dei nuovi assunti
Strumento interno · Risorse umane
Crea una web app interna per [un'azienda di 60 persone] per gestire l'inserimento dei nuovi assunti. Ruoli: admin HR, responsabile, nuovo assunto. Login: email; l'admin HR crea gli account. Schermate: modelli di inserimento (un elenco di attività con il team responsabile: HR, IT, responsabile), inserimenti attivi con una barra di avanzamento, dettaglio dell'inserimento con le attività raggruppate per settimana, la pagina del nuovo assunto con le sue attività, i documenti da firmare e i contatti. Dati: un modello ha molte attività con un team responsabile e uno scarto in giorni dalla data di inizio; un inserimento copia un modello per una persona e una data di inizio; un'attività ha uno stato (da fare, fatta) e una data di completamento. Vincoli: un nuovo assunto vede solo il proprio inserimento, i responsabili vedono gli inserimenti del loro team, un'email a ogni team responsabile quando un'attività è in scadenza, documenti caricati salvati in privato. Stile caldo: crema, blu profondo, schede arrotondate.
Prompt per portali clienti
Un portale clienti è uno strumento interno con una porta verso l'esterno: il team lavora da un lato, ogni cliente vede solo i propri record dall'altro. Qui la frase sui permessi è l'intero prodotto. Altri esempi nella nostra guida al portale clienti.
Portale di uno studio commercialista
Portale clienti · Contabilità
Crea una web app di portale clienti per [uno studio commercialista con 4 commercialisti e 150 piccole imprese clienti]. Ruoli: admin dello studio, commercialista, cliente. Login: il personale con email; i clienti su invito del proprio commercialista. Schermate per i clienti: documenti da fornire questo mese con un pulsante di caricamento, i documenti caricati per anno, i messaggi con il proprio commercialista, le fatture dello studio. Schermate per il personale: elenco clienti con il numero di documenti mancanti, dettaglio cliente, richiesta di un documento (titolo, scadenza), conversazioni. Dati: un'azienda cliente ha un commercialista e molte richieste di documenti; una richiesta ha una scadenza e uno stato (richiesto, ricevuto, validato); un documento appartiene a una richiesta. Vincoli: un cliente vede solo la propria azienda, file salvati in privato, un'email al cliente quando viene creata una richiesta e un promemoria [3 giorni] prima della scadenza. Stile affidabile: bianco, blu scuro, nessuna decorazione.
Portale di progetti e approvazioni per un'agenzia
Portale clienti · Agenzia
Crea una web app di portale per [un'agenzia di design] per condividere il lavoro con i clienti e raccogliere le approvazioni. Ruoli: admin dell'agenzia, designer, cliente. Login: il personale con email; i clienti con un link di invito per progetto. Schermate per i clienti: i loro progetti, i consegnabili in attesa di approvazione con un'anteprima, approva o richiedi modifiche con un commento, cronologia del progetto. Schermate per il personale: bacheca dei progetti, caricamento di una versione di un consegnabile, conversazione di commenti per consegnabile, ore registrate per progetto. Dati: un progetto appartiene a un cliente e ha molti consegnabili; un consegnabile ha molte versioni e uno stato (bozza, inviato, modifiche richieste, approvato). Vincoli: i clienti vedono solo i propri progetti e solo le versioni segnate come inviate, un'email al cliente quando viene inviata una versione e al designer quando il cliente risponde, data di approvazione e approvatore salvati per ogni versione. Stile editoriale: bianco, nero, spaziatura generosa.
Prompt per dashboard e back office
Una dashboard legge i dati più di quanto li scriva. Dite da dove vengono i numeri, quali contano, su quale periodo e chi può vederli.
Dashboard vendite per una piccola catena
Dashboard · Commercio
Crea una dashboard web app per [una catena di 6 caffetterie]. Ruoli: titolare (tutti i locali), responsabile di locale (solo il proprio). Login: email, solo su invito. Fonte dei dati: un CSV giornaliero delle vendite per locale caricato da ogni responsabile, con data, prodotto, quantità e importo. Schermate: panoramica con incasso, numero di vendite e scontrino medio per il periodo selezionato, confrontati con il periodo precedente; incasso per locale e per giorno in grafici; i 10 prodotti più venduti; pagina di caricamento con la cronologia dei file importati; impostazioni con gli orari di apertura di ogni locale. Vincoli: un responsabile vede solo il proprio locale, un file per una data già importata sostituisce i vecchi dati dopo una conferma, filtro per periodo (questa settimana, questo mese, personalizzato), esportazione CSV di ogni tabella. Stile chiaro: bianco, marrone caffè, grafici leggibili senza 3D.
Back office admin per un marketplace
Back office · Marketplace
Crea una web app di back office admin per [un marketplace di mobili usati]. Ruoli: admin, moderatore (controlla annunci e segnalazioni, non può emettere rimborsi). Login: email, solo account del personale, creati dall'admin. Schermate: annunci in attesa di revisione con approva e rifiuta (motivo obbligatorio), segnalazioni degli utenti con l'annuncio o il membro segnalato, dettaglio del membro con i suoi annunci, ordini e avvertimenti, elenco ordini con filtri per stato, modulo di rimborso per gli admin. Dati: un membro ha molti annunci e ordini; un annuncio ha uno stato (in attesa, online, rifiutato, venduto); una segnalazione collega chi segnala, un bersaglio e un motivo; ogni azione admin è salvata con autore e data. Vincoli: un annuncio rifiutato invia un'email al venditore con il motivo, un membro con [3 avvertimenti] viene sospeso automaticamente, tutte le tabelle ricercabili e ordinabili. Stile funzionale: grigio chiaro, pannelli bianchi, rosso per le azioni distruttive.
Prompt di follow-up per una web app
Il primo prompt costruisce lo scheletro. Poi accedete con ogni ruolo e controllate cosa vede prima di aggiungere altro. Ogni messaggio successivo deve cambiare una sola cosa: un ruolo, una colonna, uno stato, un'email, un bug. Dite cosa costruire, dove va, e cosa deve restare intatto.
Quando
Prompt di follow-up da adattare
Aggiungere un ruolo
Aggiungi un ruolo [osservatore] che vede [tutti i progetti] in sola lettura, senza pulsanti di modifica e senza accesso a [impostazioni]. Gli altri ruoli restano invariati.
Correggere un permesso
Un [cliente] può ora aprire la [fattura] di un altro cliente cambiando l'URL. Limita le [fatture] al loro proprietario nel database, non solo nell'interfaccia.
Aggiungere una colonna o un filtro
Nell'elenco delle [opportunità], aggiungi una colonna [data della prossima azione], ordinabile, e un filtro [solo scadute]. Non cambiare le altre colonne.
Aggiungere pagamenti
Aggiungi un piano [Pro] a [$19 al mese] con Stripe Checkout. Gli account gratuiti mantengono [1 bacheca]; Pro sblocca bacheche illimitate. Tieni la chiave segreta di Stripe sul server.
Correggere un bug
Nel [modulo dei movimenti di magazzino], un trasferimento toglie la quantità dal primo magazzino ma non la aggiunge al secondo. Atteso: entrambi aggiornati insieme. Correggi solo questo.
Con il creatore di app web con IA di Cadrant, questi prompt producono una web app React con il suo backend Supabase: database, login, storage dei file e funzioni lato server, collegati a un account Supabase aperto a vostro nome, così i dati restano vostri. Provate ogni ruolo nell'anteprima dal vivo, iterate in conversazione, poi pubblicate su un URL Cadrant o sul vostro dominio. Se state confrontando gli strumenti, la nostra guida alle alternative a Lovable mette i principali builder uno accanto all'altro. Il prompt funziona in tutti: cinque righe per il web, un paragrafo e le parentesi riempite con il vostro progetto.
Esempi di prompt per web app: 10 per SaaS e tool interni | Cadrant