Crea con l’IA un prototipo di app funzionante e mettilo in mano a persone vere

Perché un prototipo funzionante ti dice più di un mockup

Le schermate statiche verificano se alle persone piace l’aspetto di qualcosa. Raramente verificano se lo sanno usare, perché chi prova deve immaginare cosa succede dopo ogni tocco e chi conduce la sessione finisce per raccontare il prodotto a voce. Un prototipo interattivo che risponde davvero elimina quel racconto. Chi prova scrive in un campo vero, vede cambiare un totale vero, arriva a uno stato vuoto vero quando elimina l’ultimo elemento. La sua confusione riguarda il tuo design, non i buchi del prototipo.

Cambia anche le domande che puoi fare. Con un mockup chiedi “lo useresti?”, e la gente risponde per cortesia. Con qualcosa che funziona puoi assegnare un compito (“aggiungi il turno di martedì prossimo e guarda come cambiano le tue ore settimanali”) e osservare dove esita.

Decidi cosa deve dimostrare il prototipo

Prima di descrivere qualsiasi cosa, scrivi le una o due domande a cui il test deve rispondere. Così il progetto resta piccolo e le sessioni restano mirate. Le più comuni:

• Comprensione: le persone capiscono a cosa serve la schermata principale in pochi secondi?
• Il compito principale: riescono a portare a termine da sole l’unica cosa per cui il prodotto esiste?
• Il momento delicato: cosa succede nel caso limite su cui hai dubbi: una lista vuota, un errore da annullare, un nome lungo che va a capo?
• Disponibilità: dopo averlo usato, sostituirebbero con questo il foglio di calcolo, il quaderno o l’app che usano oggi?

Tutto ciò che non serve a quelle domande può essere lasciato fuori o simulato. Una pagina delle impostazioni che nessuno aprirà in una sessione di venti minuti è fatica sprecata, per quanto sia facile generarla.

Come descriverlo ad Anticode

Descrivi la persona, il compito e le schermate in poche frasi, e di’ come devono essere i dati di esempio. Per esempio: “Un prototipo di app per scambiarsi i turni nel team di un bar. Schermate: i turni di questa settimana, una richiesta di scambio turno e un elenco delle richieste di scambio aperte. Usa otto dipendenti di esempio e una settimana realistica. Indica tutto come dati demo.” L’Architect risponde con un piano breve (nome, schermate, stile, funzioni) e può fare fino a tre domande quando la risposta cambia il risultato, ognuna con risposte suggerite che puoi toccare.

Quando scegli Build it, il modello scrive l’intera app come un unico documento HTML, e puoi vedere il codice arrivare in tempo reale. Le nuove app possono anche essere aperte in un browser headless a larghezza di telefono e di portatile, fotografate con screenshot e cliccate in prova, con gli errori rimandati indietro per correggerli, quando quel servizio di revisione è disponibile.

Rendi oneste le parti simulate

Le app di Anticode girano in una sandbox senza rete, quindi tutto ciò che normalmente richiederebbe un server viene simulato dentro la pagina: gli altri utenti sono persone di esempio, i messaggi “inviati” finiscono in un elenco locale e una schermata di accesso accetta qualsiasi cosa. L’app li indica come dati demo dove conta. Tieni visibili quelle etichette durante i test. Chi pensa di usare un sistema reale fa scelte diverse e più rischiose di chi sa che è un modello, e in questa fase ti serve il secondo tipo di feedback.

Quello che invece resta è tutto ciò che l’app salva nel browser di chi la prova. Se qualcuno aggiunge tre elementi, chiude la scheda e torna domani, gli elementi sono ancora lì su quel dispositivo. Basta per uno studio a diario di una settimana, purché ogni partecipante usi sempre lo stesso telefono o portatile.

Condurre le sessioni e modificare il prototipo

1. Pubblica il prototipo al suo indirizzo anticode.dev e manda il link a chi deve provarlo. Non c’è niente da installare.
2. Agli stakeholder manda invece un link di revisione per il cliente: possono aprire l’anteprima attuale senza account e lasciare commenti legati a una sezione. I link scadono dopo 14 giorni per impostazione predefinita e puoi revocarli.
3. Dopo ogni round, chiedi le modifiche a parole semplici (“sposta il pulsante di scambio su ogni scheda del turno”). I salvataggi recenti restano nella cronologia delle versioni (fino a un numero stabilito dal tuo piano), così puoi mostrare il primo e il terzo round uno accanto all’altro, o tornare indietro.

Cosa non può testare un prototipo in un solo browser

Sii onesto con te stesso sul confine. Un prototipo in sandbox funziona su un dispositivo alla volta, quindi non può testare:

• Nulla che avvenga tra persone: notifiche reali, liste condivise, due partecipanti che vedono le modifiche l’uno dell’altro.
• Accesso reale, permessi o recupero dell’account.
• Dati esterni in tempo reale, pagamenti o funzioni di IA dentro l’app (si possono solo imitare con risposte di esempio fisse).
• Le prestazioni con volumi di dati reali o reti lente.

Quando l’idea supera i test, l’esportazione in Next.js è il passo verso un prodotto vero. Riguarda le app e ti dà un progetto App Router standard in TypeScript con Postgres tramite Prisma, accesso via email, ruoli cliente e staff e un’area di amministrazione. È un punto di partenza che uno sviluppatore estenderà, non un’app multiutente finita, e puoi inviarlo a un repository GitHub a tua scelta. La guida all’esportazione in Next.js spiega cosa contiene. Se ti servono funzioni multiutente pronte per la produzione senza scrivere codice, uno strumento no-code con un proprio backend potrebbe fare più al caso tuo di entrambe le soluzioni.

Domande frequenti

È un generatore di prototipi di app con IA o uno strumento di design?

Produce codice funzionante, non frame su una tela. Ottieni un’app vera nel browser, adatta ai test di usabilità; se ti servono file di design precisi al pixel per un team di design, usa uno strumento di design accanto.

Chi lo prova può usarlo dal telefono?

Sì. L’app pubblicata è una pagina web che funziona nel browser del telefono, e ciò che salva resta su quel telefono.

Posso vedere cosa hanno inserito i partecipanti?

Non ciò che hanno salvato dentro l’app, che resta sul loro dispositivo. Se aggiungi un modulo di feedback o di contatto, quegli invii ti arrivano per email e nella dashboard.

Il prototipo diventa l’app vera?

Può diventarne il punto di partenza. L’esportazione in Next.js lo trasforma in un progetto con database e accesso su cui uno sviluppatore può lavorare.