Mobile Design Patterns

by Andrea Maioli on 4 luglio 2017

Negli ultimi mesi ho avuto il piacere di partecipare alla creazione di diverse app mobile con Instant Developer Cloud. È stato un periodo intenso e soddisfacente, e uno dei regali più belli è stato quello di poter comprendere come migliorare il sistema di documentazione della piattaforma.

Infatti, chi inizia a lavorare con Instant Developer Cloud subito chiede: dov’è la documentazione? Cosa posso guardare per imparare ad usarlo?

Già oggi ci sono diversi aiuti:

  1. I tutorial introduttivi basati su chatbot: utili per comprendere i concetti fondamentali dell’IDE e del framework.
  2. Alcuni esempi completi di applicazioni che mostrano delle app finite e funzionanti.
  3. Una documentazione in linea delle librerie con esempi di codice per poter conoscere le informazioni puntuali sui vari metodi a disposizione.

Cosa può mancare? Quello che ho visto è che gli esempi di applicazioni complete sono troppo complicati per essere analizzati velocemente e adattati alle proprie esigenze. È proprio per questo che ho deciso di creare una nuova serie di progetti di esempio che contengano i design patterns più comuni.

Nel mese di giugno abbiamo creato il primo, per mostrare le strutture base della user interface per app mobile responsive. Da oggi potete aprire il progetto mobile-design-patterns che contiene i casi d’uso più comuni in una forma molto semplice.

Che cosa ci troverete? Ecco alcuni esempi:

  1. Gli elementi base di una pagina.
  2. La navigazione fra pagine con passaggio di parametri bidirezionale.
  3. Come creare pagine basate su tabs.
  4. Un modello di griglia responsive.
  5. Tanti tipi di liste diverse.
  6. I widget e i popup più comuni.

Sparsi qua e là nel codice potete scovare anche esempi di utilizzo di webapi rest, come leggere un file da disco, come scaricare risorse da internet, e altro ancora.

Per utilizzare un pattern basta aprire il progetto di esempio, selezionare la videata che vi interessa, aprirla in visualizzazione HTML con il tasto F4 e poi copiare il codice nel vostro progetto usando il medesimo procedimento. Se invece volete vedere direttamente l’applicazione in funzione nel browser, basta cliccare qui.

Avrei piacere di sapere la vostra opinione su questo tipo di documentazione. E se vi piace ho in mente altri cinque o sei gruppi di design patterns da pubblicare nelle prossime settimane.

A voi la parola!

{ 1 trackback }

Compiti per le vacanze | il blog di pro gamma
25 luglio 2017 alle 16:32

{ 1 comment… read it below or add one }

1 Poidomani Giovanni 4 luglio 2017 alle 19:13

intanto l’idea dei design patterns è ottima complimenti. Avere tanti piccoli esempi che illustrano le singole funzionalità aiuta molto e sveltisce l’apprendimento. Pur essendo al momento in ferie ci guarderò.

Leave a Comment

Previous post:

Next post: