Oggi voglio presentarvi uno strumento interessante, che vi permetterà di creare prototipi delle vostre applicazioni direttamente dai vostri iPhone (o iPad). Così finalmente potrete lavorare anche mentre siete a zonzo durante un pomeriggio di sano relax ^^ In effetti visto da questo punto di vista forse non è il massimo, ma nella realtà siamo di fronte ad uno strumento davvero molto utile e interessante. Infatti non solo potrete studiare e “disegnare” le interfacce grafiche utente, ma potrete anche testare (e mostrare a eventuali vostri clienti) il lavoro direttamente sul dispositivo.

Insomma, quale prova migliore se non quella di far vedere (o vedere) il risultato finale, ancora prima di partire con lo sviluppo, e soprattutto: direttamente sui nostri iPhone?

Interface, di Less Code Limited, ci aiuterà proprio in questo! Semplicissimo da usare, forse solo un po’ macchinoso all’inizio (a parer mio personale), ma una volta presa la mano, diventerete velocissimi a creare, modificare ed eliminare le vostre schermate. Molto utile, quindi, in fase di progettazione delle nostre applicazioni.

Come funziona?

Vediamo come funziona Interface per iPhone. Le applicazioni che andremo a progettare vengono gestite in cartelle. All’avvio del programma, quindi, verranno visualizzate le cartelle (all’interno di un’ UITalbleView) dei programmi su cui state lavorando. Potrete editare queste cartelle rinominandole o modificandone l’ordine di visualizzazione.

Entrando in una cartella si entrerà nel vivo del programma. Da qui potrete infatti creare i vostri Mockup, semplicemente premendo sul tasto “+” che trovate in basso a sinistra. Anche qui potrete effettuare alcune modifiche rinominando le schermate, cambiando l’ordine di visualizzazione o impostare il supporto per la visualizzazione in landscape per ogni elemento. Per quest’ultima funzione troviamo un avviso che indica che si tratta di una funzione sperimentale e che le viste non verranno ridimensionate automaticamente.

Tramite un semplice tap su un Mockup, potremo decidere se Editare, Clonare o visualizzare un’anteprima.

Entrando in modalità di modifica ci ritroveremo davanti una view completamente vuota (e bianca). Tramite un doppio-tap in un punto qualsiasi si aprirà un menù dove potremo scegliere una delle seguenti voci:

• Aggiungi controllo (Add Control)
• Organizza controlli (Organize Controls)
• Disabilita Auto-allineamento (Disable Auto-alignment)
• Condividi & Esporta (Share & Export)
• Anteprima (Preview)
• Salva e torna indietro (Save & Bak)

Diverse funzioni tutte molto semplici ed intuitive. Interessante la possibilità di condividere ed esportare, che ci permetterà anche di esportare in Xcode i nostri progetti (in questo caso verrà generato un codice che si potrà inviare a chiunque via mail con le istruzioni per l’uso)

Controlli disponibili

Provando ad aggiungere un controllo, noteremo subito che ci sono 2 categorie di oggetti: “Basic Control” e “Advanced Control”.

Nel primo gruppo troviamo:
Rounded Rect Button, Image Button, Detail Disclosure Button, Light Info Button, Dark Info Button, Add Contact Button, Label, Text Field, Text View, Image View, Switch, Slider, Progress Bar e Activity Indicator.

Nel secondo, invece:
Rectangle View, Plain Table View, Grouped Table View, Navigation Bar, toolbar, Search Bar, Tab Bar, Segmented Tab, Picker, Date Picker, Web View, Map View.

Insomma parecchi controlli per essere all’inizio e sicuramente non mancano gli essenziali, che ci permetteranno di fare pressochè tutto quello che ci interessa, ovvio, anche se con qualche limite.

Ogni controllo da accesso alle sue proprietà completamente personalizzabili (basta un doppio tap sul controllo scelto per accedere), potremo quindi modificare posizione, dimensione, colore, etichette e quant’altro: ogni controllo ha le sue specifiche proprietà. Ovviamente molto lavoro potremmo farlo senza settare manualmente tutti i parametri e agendo quindo tramite touch sul display nella schermata di lavoro.

Come dicevo poco fa, per far apparire il menù principale (quello con la voce “Aggiungi controlo” per intenderci), dovremo fare un doppio tap su un punto vuoto dello schermo, ma cosa succede se lo schermo è completamente pieno di controlli? Niente di preoccupante, ci basterà infatti “shakerare” il nostro device e vedremo comparire il solito menù.

Simulazione

Vediamo ora un aspetto ancora più interessante: le azioni! Avete capito bene, tramite questo programma, davvero molto completo per essere studiato per un dispositivo mobile, potremo associare delle azioni ai nostri controlli (oltre che gli attributi di personalizzazione) e far si, quindi, che durante una simulazione dell’interfaccia, alla pressione di un tasti si apra un’altra view o una vista dettaglio di una tabella.

Insomma, dopo una prima prova su strada devo dire che questo programma non è niente male e devo dire che parte davvero molto bene, un buon tool che può far comodo ad ogni sviluppatore iPhone OS.

Quanto ci costa?

Il prezzo, forse per alcuni unica nota dolente, anche se sinceramente non è poi questa grossa cifra rispetto a quello che realmente offre il programma: 7,99 € e potete scaricarlo direttamente dai vostri iPhone (o tramite iTunes via Mac o PC) visitando il seguente indirizzo. Segnaliamo anche la versione per iPad, sempre al costo di 7,99 € raggiungibile da quest’altro indirizzo. Precisiamo che non si tratta di un’universal app, ma di un diverso programma a cui deve seguire quindi eventuale nuovo acquisto (scelta che personalmente non condivido, ma che a quanto pare va parecchio di moda).

Video e Screenshot:

Vi lascio con il video dimostrativo degli sviluppatori e qualche screenshot aggiuntivo, che sicuramente vi chiariranno meglio le idee: