Introduzione
Una volta che avete un'idea per un'applicazione Web, è necessario pianificare con attenzione prima di iniziare a fare qualsiasi codifica o progettazione. Questo sarà incredibilmente ovvio per la maggior parte di voi, ma è un punto che non può essere sottovalutata, se si sta creando una nuova applicazione, o riproporre un'applicazione esistente. Questo articolo riguarda i concetti principali da tenere a mente, come si prevede un'applicazione e prepararsi per l'attuazione.
Si noti che questo è un semplice flusso di lavoro di uso generale, progettato per aiutare le persone a iniziare; se sei uno sviluppatore di impresa esperto allora probabilmente avete un flusso di lavoro e le pratiche della propria applicazione per aprire lo sviluppo di applicazioni Web, che va bene.
Una dichiarazione di intenti
Per cominciare, si dovrebbe scrivere pubblico di funzionalità e bersaglio dell'app modo più conciso possibile, e si dovrebbe pensare al contesto / situazione in cui il target di riferimento potrebbe utilizzare l'applicazione. Per il mio semplice Location Finder app, ho scritto due liste, come segue:
Funzionalità
- Ottenere la posizione del dispositivo nel modo più accurato possibile
- Trama che posizione su una mappa di Google
gruppi di utenti
- Gli sviluppatori che vogliono conoscere aperto app web e lo sviluppo del sistema operativo Firefox, probabilmente in un ufficio o su un treno
- Chiunque voglia scoprire dove sono, per lo più come all'aperto / lontano da casa
Si dovrebbe rendere l'applicazione più semplice possibile; concentrarsi su come ottenere che faccia una cosa, o un paio di cose strettamente correlati pozzetti. Se si dispone di un sacco di diversi casi di utilizzo che si vuole raggiungere, si potrebbe desiderare di dividere tra loro diverse applicazioni. La vostra applicazione che può richiedere una diversa esperienza su piattaforme diverse, quindi si può avere liste separate per desktop e mobile (o anche tablet, TV, ecc)
Avanti, provate a scrivere una sintesi di facile utilizzo della vostra applicazione, che invogliare la gente a scaricarlo e provarlo. Se si può riassumere in una frase, allora la vostra idea è probabilmente una buona misura per un app! Per cercatore di posizione, ho scritto:
Location Finder utilizza la geolocalizzazione per scoprire dove sei, e traccia una mappa dei dintorni utilizzando l'API di Google Maps.
OK, per un'applicazione puramente rivolto agli utenti finali, che normalmente non includere i nomi delle tecnologie; sarebbe rivelarsi più simile a questo:
Location Finder scopre dove siete, poi traccia una mappa dell'area circostante.
Ma dal momento che questa applicazione è in gran parte rivolto a sviluppatori di insegnamento, ho deciso questa informazione sarebbe utile.
Delineare la vostra applicazione
Una volta che avete deciso su intenti e target di riferimento della vostra applicazione, è sempre una buona idea per iniziare con carta schizzi-provare tirando fuori diversi schermi grezzi per mostrare ciò che l'applicazione potrebbe sembrare, e ciò che il flusso di lavoro sarà come l'utente usa i tuoi app. Probabilmente si vorrà fare una serie separata di schizzi per desktop, cellulari, tablet, TV, ecc, se le vostre liste di funzionalità da sopra lo richiedono.
In ogni caso gli appunti su ciò che sono necessarie risorse grafiche, funzioni, ecc, in ogni fase, in modo da informare i vostri scelte quando si arriva alle fasi di progettazione e sviluppo, e in modo che si hanno meno probabilità di perdere qualcosa. Per cercatore di posizione, la funzionalità è molto semplice, così ho deciso che mi serviva solo un abbozzo:
Per una applicazione più complicato, si consiglia di includere più schizzi schermo per mostrare la vista principale, e poi diversi punti di vista che rappresentano i flussi di lavoro diversi, come l'utente utilizza l'applicazione.
Può qualsiasi programma (essere convertito) lavoro come Web App aperta?
Quasi ogni pagina, un programma o un sito in grado di lavorare come web app aperta, fino a quando si tiene a mente i consigli che abbiamo già dato in precedenza; mantenere le cose semplici di ogni altra cosa. Se un'applicazione è particolarmente complicato (come ad esempio un elaboratore di testi o di una grande piattaforma di e-commerce), allora non funzionerà come un app in tutti i contesti, pertanto, è necessario pensare di creare un'esperienza diversa per esempio, dispositivi mobili o tablet . Ad esempio, il sito desktop di eBay ha pubblicità, diversi meccanismi di ricerca, e tutta una serie di altre caratteristiche. La versione mobile del sito, in confronto, nasconde la maggior parte delle caratteristiche e pubblicità, presentando solo le funzioni più popolari nella parte superiore dell'interfaccia, e minimizzando la quantità di interazione con la tastiera necessario.
Google Docs è un altro esempio interessante da considerare. Il sito desktop è un word processor completamente funzionale con un sacco di controlli disponibili, ma questo sarebbe un incubo da utilizzare su un sito mobile, quindi la versione mobile permette semplicemente di leggere i documenti, con una semplice interfaccia.
In questa fase, avere un pensare a come si presentano le diverse versioni. Nella maggior parte dei casi si sarà in grado di utilizzare le media query per ottimizzare il layout e le funzionalità del vostro progetto per diversi browser. Tuttavia, se ti è stato dato il compito di creare una versione mobile app di un pesante, eredità, Desktop Enterprise Web sito, o se le esperienze desktop e mobile dimostrano troppo radicalmente diverso, tenere a mente che si potrebbe essere meglio la creazione di un separato mobile site / tablet o app.
Nota: Se si sta fornendo un desktop radicalmente diversa e esperienza mobile, è necessario fornire agli utenti un modo per passare tra i due-non assumere si sa cosa è meglio per tutti loro, per tutto il tempo.
Pensate alle tecnologie necessari
Alcune persone piegare questa fase nella "Dichiarazione di intenti" stadio sopra, ma senza dubbio spesso è meglio prendere in considerazione la funzionalità / il layout completamente separata dalla vostra tecnologia. Si dovrebbe pensare la funzionalità puramente in termini di ciò che è meglio per gli utenti in primo luogo, piuttosto che cercare di calzascarpe una tecnologia in un progetto, perché è l'ultima, più cool, più brillante giocattolo. Solitamente l'approccio più semplice è il migliore.
Si parlerà di tali considerazioni in modo molto più dettagliato nel nostro sviluppo di Applicazioni Web sezione, ma in generale si dovrebbe pensare le principali funzionalità / requisiti vostra applicazione ha, e le tecnologie che possono essere meglio per la loro attuazione. Esempi di domande si dovrebbe chiedere includono:
- Avete bisogno di storage offline? Se l'applicazione ha bisogno di persistere dei dati, che normalmente si utilizza un linguaggio server-side e database. Se si desidera continuare ad usarlo quando si è offline / installato su un dispositivo, si potrebbe avere per memorizzare i dati in un meccanismo di archiviazione lato client, come ad esempio IndexedDB o localStorage.
- Vuoi giocare o manipolare i media? Probabilmente avrete bisogno di funzionalità HTML5 come {{HTMLElement ( "tela")}}, {{HTMLElement ( "video")}}, o {{HTMLElement ( "audio")}}.
- Non si desidera ottenere informazioni dal dispositivo e dei suoi dintorni? Avrete bisogno di usare uno dei tanti API dispositivi disponibili, come ad esempio l' API stato della batteria , di prossimità API , o l'orientamento del dispositivo API .
piano di test
Un'altra cosa che di solito è considerato ovvio, ma spesso viene trascurato è la prova. Si consiglia di verificare quanto prima e quanto più spesso possibile, come errori fondamentali scoperte nella fase iniziale possono risparmiare un sacco di tempo e denaro più avanti nel progetto, quando un sacco di sviluppo sono stati fatti. Un piano di test generale è la seguente:
- Dopo aver scritto la dichiarazione di vostra applicazione di funzionalità e target di riferimento, condividerlo con un certo numero di colleghi, amici e familiari. Suona come una buona idea sin dall'inizio, o lo fa sembrare ridicolo? Ha solo bisogno di ritocco o rescoping moderata?
- Condividi i tuoi schizzi per il feedback pure. C'è qualcosa ovvio manca? Sarebbe qualsiasi altra cosa aggiungere in modo significativo l'esperienza?
- Avanti, è spesso una buona idea per creare un prototipo funzionale che permette alle persone di testare le funzionalità chiave e le interazioni. Ottenere una selezione di utenti reali al di fuori del team di sviluppo di testare queste interazioni e vedere quanto bene cavata. Se non può permettersi un setup test utente professionale, allora non importa, una selezione di amici e parenti è spesso quasi buono, a patto di amministrare le domande e le prove giuste.
- Come si lavora attraverso lo sviluppo l'applicazione, ripetere la procedura di test utente tutte le volte che è ragionevole. Ora si sta lavorando con l'applicazione reale, testare sul maggior numero di browser e dispositivi vari, come si può, a partire con gli obiettivi di assistenza primaria e di lavoro verso l'esterno. Considerate ciò che è un'esperienza accettabile ogni browser e dispositivi, e non solo testare il normale utilizzo, vedere come l'applicazione esegue in condizioni di stress, e con casi limite come ad esempio l'inserimento dei dati dannoso e molto vecchi browser.
- Verso la fine del progetto, mettere un rigoroso giro di controllo di qualità per estirpare alcun last minute insetti malvagi; quelli che sempre si morso sul collo quando meno te lo aspetti.
Conclusione: punti da considerare
Speriamo che questo articolo vi avrà dato la maggior parte di ciò che è necessario prendere in considerazione prima di creare un successo Open Web App. L'elenco che segue offre una sintesi.
Qual è lo scopo della vostra applicazione?
Creare un elenco di attività, un'idea per la vostra applicazione e il tipo di utente si prendono di mira, e poi scrivere una dichiarazione obiettivo: Definire lo scopo della tua app e l'utente più importante in una frase, se possibile. Esempio: Uno strumento di creazione lista dei desideri per le persone che non hanno mai fare acquisti d'impulso.
Focus su un caso d'uso principale
E 'possibile che non si può includere tutte le attività sulla vostra lista nella sua dichiarazione obiettivo. Questo è OK, perché impressionanti applicazioni - in particolare quelli per la telefonia mobile - fanno bene una cosa. Se la vostra applicazione sta cercando di fare troppe cose, poi pensare di suddividere la funzionalità su più applicazioni. Anche se, se l'applicazione ha bisogno di un sacco di funzioni per offrire il suo valore, ricordare che si potrebbe prendere in considerazione la consegna di una web app per PC desktop solo.
Come farà la gente usare la app?
A questo punto, che hai identificato il tuo caso principale utilizzo, target di utenti, caratteristiche principali. Lo scenario principale dovrebbe anche prendere in considerazione l'ambiente utente in cui si utilizza l'applicazione. Ad esempio, una giovane mamma con il suo bambino al nido potrebbe usare la vostra applicazione notare un bel passeggino (potenziale multi-tasking, fermandosi e continuando il compito più avanti). Un altro utente potrebbe programmare il suo prossimo acquisto computer portatile a casa, in poltrona, senza interruzioni.
Concentrati su alcune caratteristiche chiave
Guarda l'elenco delle attività di nuovo. Filtrare l'elenco tramite l'istruzione obiettivo. Se le attività non si allineano con la sua dichiarazione obiettivo, escluderli dalla vostra applicazione. Descrivere ogni compito fondamentale come una caratteristica e poi chiedetevi: è questa caratteristica essenziale? O è bello da avere, ma non richiesto dall'utente di destinazione per completare l'operazione definita? Sii onesto con te stesso. Se si finisce con un breve elenco di caratteristiche, siete sulla strada giusta. Ricordate, le migliori applicazioni di solito fanno bene una cosa. Le applicazioni spesso non fallire perché hanno troppo poche funzioni, ma troppi.
Tuttavia, se avete semplicemente per fornire un ampio set di funzionalità per raggiungere il tuo obiettivo, considerare la possibilità di un tavolo Web App vostra applicazione primaria e quindi offrire un app mobile complementare con solo le caratteristiche e le funzioni che un utente può avere bisogno anche lontano dalla propria scrivania.
Delineare la vostra applicazione
Una volta che avete un paio di interazioni chiave in mente, è possibile tradurre quei passi in schermi. È possibile delineare il flusso di utenti, vale a dire, che cosa gli utenti passano da uno schermo all'altro per completare un compito. Pensate alla funzionalità della vostra applicazione, e mettere gli elementi dell'interfaccia utente che corrispondono alle interazioni più importanti nei luoghi più importanti. Pensate a come gli schermi appariranno sul desktop rispetto a tablet / cellulare.
tecnologie necessarie
Guardate il vostro elenco di funzionalità, e fare alcune note su quali tecnologie si dovrà probabilmente utilizzare per costruire tali requisiti.
piano di test
Costruire un piano di test ragionevole nel vostro piano di progetto, per ridurre la probabilità di essere colpiti da costose sorprese inaspettate in seguito nelle fasi di implementazione.