React: 1. Progettare lo sviluppo di una web app

Cosa è una web app

Prima di capire come progettare lo sviluppo di una web app, è importare avere chiaro cosa sia concretamente una web app.
Una web app è un’applicazione che funziona tramite la tecnologia web. In pratica un sito web più complesso di un semplice sito vetrina. Il sito di Facebook, per esempio, è una web app, cioè un sito web dove gli utenti possono interagire con il database ed utilizzare diverse funzionalità.

Il sito di un ristorante dove vedere foto e testi, è un semplice sito vetrina. Il sito di Booing.com, dove è possibile prenotare, pagare e chattare, è una vera e propria web app.

 

Fase iniziale del progetto di sviluppo

E’ chiaro che lo sviluppo di una web app, rispetto ad un semplice sito, richiede uno sforzo molto maggiore, sia in termini di risorse economiche che di organizzazione.

Sia nel caso in cui sia una azienda strutturata, sia nel caso in cui si tratti di una startup, dove non esiste ancora una struttura aziendale, è fondamentale che ci sia organizzazione, conoscenze tecniche e metodo, nella progettazione della web app.

Stabilire gli step e programmarne lo sviluppo, è forse la fase più importante nella fase di vita di una web app, perché essa consiste nella gettata delle fondamenta dell’intero progetto.

 

Primo step (MVP)

Vediamo adesso più concretamente come progettare lo sviluppo di una web app. La prima cosa da fare, ancora prima di decidere qualsiasi cosa, compresa la tecnologia da utilizzare, consiste nello stabilire l’MVP.
L’MVP (Minimum Viable Product) è il prodotto minimo funzionante, cioè la web app con le sue pochissime funzioni base essenziali.

La suddivisione dello sviluppo a step è fondamentale, perché consente sia all’investitore di testare la validità del progetto prima di procedere a passo spedito, sia agli sviluppatori, di impostare il progetto in modo ordinato e modulare.

Come si progetta un MVP

Approntare l’MVP è molto più complesso di quello che possa sembrare. Generalmente le aziende e le startup tendono a commissionare web app ipertrofiche, piene di funzionalità anche nella loro prima versione MVP.
Eppure il primo step di sviluppo dovrebbe consistere solo nella creazione delle pochissime funzionalità di base della web app.

Un esempio chiarificatore è dato da Whatsapp. La prima versione dell’app di messaggistica permetteva solo di chattare con stringhe di testo, perché questo era il core dell’app. Solo nelle versioni successive dell’app sono state introdotte le possibilità di inviarsi immagini, di creare gruppi e così a seguire.

Quindi la domanda da porsi è “quali sono quelle due massimo tre, funzionalità che la mia web app dovrebbe avere”?
Perché una web app sia innovativa non è necessario che quella funzionalità non esista su altre web app. Facebook stesso quando è nato, aveva concorrenti che erano più avanti nello sviluppo. Ma è importante che la web app abbia una o due funzionalità di base fondamentali e che siano realmente utili all’utente.

 

Step successivi

Dopo aver scritto un documento, anche non tecnico, che contiene le funzionalità di base dell’MVP, si può procedere ad approntare un secondo documento, contenente i futuri step di sviluppo che si ipotizzano. Sarebbe anche utile che questi step siano scritti in modo schematico e nell’ordine cronologico ipotizzato.

 

Come scrivere i documenti di specifiche tecniche

Sia l’MVP che il documento degli step di sviluppo successivi, possono essere scritti su un semplice file pdf. Non è necessario che siano presenti chissà quali caratteristiche tecniche. E’ sufficiente scrivere un flusso che descrivere l’esperienza utente, dal suo arrivo sulla prima pagina della web app, fino alla sua uscita da essa.
É molto importante, inoltre, specificare se si desiderano funzionalità particolari, sempre immaginandone il loro flusso di utilizzo.

Esempio di flusso di funzionalità di una web app

• L’utente accede alla homepage
• Clicca sul pulsante “scarica documenti riservati”.
• Viene reindirizzato ad una pagina di login/registrazione.
• Dopo il login/registrazione viene reindirizzato alla pagina per scaricare i documenti.
• Tale pagina permette di visionare l’elenco di tutti i documenti scaricabili (circa 100).
• Cliccando su ogni link, si scarica il pdf relativo.

In questo caso sarebbe utile ad esempio, specificare anche il flusso della registrazione. Se ad esempio si riceve un’e-mail, se l’utente è immediatamente registrato senza bisogno di convalida da parte dell’admin e così via.

Un aiuto su come scrivere il documento di specifiche tecniche da dover dare agli sviluppatori, può venire anche dalla lettura di questo articolo che spiega cosa chiedere in un preventivo.