L'interfaccia è divisa in 3 colonne principali.
Sulla sinistra troverai i link per le impostazioni generali, la gestione dei menu, l'invio delle notifiche e la creazione delle sezioni.
Al centro il sistema di anteprima che mostrerà in tempo reale la tua App.
Sulla destra infine potrai gestire i componenti della sezione che hai creato, aggiungendone del tipo desiderato e configurandone sia gli aspetti di layout che di contenuto.
La prima cosa da fare è impostare un'icona per l'app e compilare una descrizione. Queste informazioni saranno utilizzate per presentare la tua applicazione agli store e nella landing page creata per la progressive web application (pwa).
In una prima fase si può saltare la compilazione dei campi nella sezione "Pubblicazione": questa sarà da gestire successivamente, come indicato nella sezione Guida alla pubblicazione.
Da questa sezione si possono definire i colori generici desiderati per le varie componenti dell'app, come ad esempio il colore della barra superiore, il colore di sfondo generico, il colore dei testi, l'eventuale immagine di sfondo per il menù laterale.
È possibile scegliere un font che sarà genericamente utilizzato per i titoli, per i testi e per i bottoni.
Gestite le volute personalizzazioni nella sezione Impostazioni, è possibile creare la prima sezione cliccando su "+ NUOVA SEZIONE" nella colonna sinistra dell'editor. Scelto il nome desiderato per la sezione, l'editor ci mostra l'anteprima in tempo reale posizionandoci nella sezione appena creata.
È possibile a questo punto decidere se impostare la sezione come Home, ovvero fare in modo che l'app visualizzi sempre questa come videata iniziale.
Si può procedere quindi all'aggiunta dei componenti nella sezione.
Cliccando su "+ AGGIUNGI COMPONENTE" nella colonna destra, si visualizza una finestra dove si potrà scegliere il componente desiderato e procedere all'inserimento del materiale grafico o testuale a seconda dei casi. Per ogni componente, cliccando sul simbolo , viene mostrata una breve guida che ne indica le caratteristiche e le modalità di impiego.
Quando si aggiungono i componenti, questi vengono mostrati sia nell'anteprima in tempo reale che in alto nella colonna a destra.
Ogni componente mostra due tasti funzione laterali: e .
Cliccando su si visualizza una tendina che riporta le seguenti funzioni:
Cliccando e trascinando verso l'alto o il basso il simbolo è possibile ordinare la sequenza dei componenti.
Le modifiche sono visualizzate in tempo reale nell'anteprima.