warp

Warp: personalizzazioni estreme dei widget per un’interfaccia veramente originale

Andrea Bordin -

Altra settimana, altra puntata di Warp, una delle ultime rubriche di AndroidWorld.it; nelle settimane scorse vi avevamo guidato nella creazione di homescreen dal gusto minimalista, oggi al contrario vi mostreremo come realizzarne una molto originale e “appariscente”.

Con questo preludio ci sentiremmo ingiusti a farvi leggere tutto il nostro articolo per vedere quale sarà il risultato finale, quindi bando alla ciance ed ecco cosa vogliamo realizzare:

 

Warp_5_01

Questa grafica non è una nostra idea, è stata concepita dall’utente BUTTERFLY EFFECT del sito MyColorScreen a cui va il merito di aver ideato questa soluzione e di aver personalizzato i widget come poi vedrete. L’autore non ha spiegato passo-passo come realizzarla (ha detto che lo farà la settimana prossima), ma vogliamo provarci ugualmente assieme a voi.

Grafica di Partenza

Warp_5_02

Launcher

SSLauncher the OriginalSSLauncher the Original

A differenza delle precedenti puntate, questa volta impiegheremo SSLauncher the Original, un launcher che non sarà tra i migliori nel Play Store, ma si presta bene per questa configurazione, specie per quanto riguarda il posizionamento, il ridimensionamento e la sovrapposizione dei widget.

 

 

Google Play Badge

 

Warp_5_03

Set di icone

Holler! wht Icon PackHoller! wht Icon Pack

In questo caso le icone sono la cosa meno rilevante, vuoi perché avremo il nostro bel da fare per configurare la home, vuoi perché le icone sulla stessa saranno poche; in ogni caso l’autore per questa soluzione grafica propone questo set dalle tonalità di grigio e dalle dimensioni decisamente ridotte e non invasive.

Google Play Badge

 

 

Warp_5_04

Widget

Icon Zooper WidgetIcon Zooper Widget ProZooper

Diciamolo: questa home è composta totalmente da widget, e nel caso specifico da quelli di Zooper, che avevamo già visto nel primo articolo di questa rubrica; esattamente come allora vi ricordiamo che esiste sia la versione gratuita che quella a pagamento, ma vi consigliamo quest’ultima, specie per caricare e modificare template che poi vi indicheremo.

 

 

Google Play Badge
Zooper Free

Google Play Badge
Zooper Pro

Configurazione

Prima di tutto vi rimandiamo a questo link dropbox dove troverete lo sfondo, i template di Zooper e le altre immagini da utilizzare nel launcher (che poi avrete cura di estrarre e copiare nel vostro smartphone).

Adesso comincia la personalizzazione, prima di tutto andiamo ad abilitare le voci “Schermo intero” e “Nascondi dock bar” al fine di avere tutto lo schermo a disposizione della nostra customizzazione, inoltre flagghiamo anche la voce “Nascondi etichette” per evitare di visualizzare nelle nostre pagine della home i relativi titoli.

Warp_5_05 Warp_5_06

A questo punto ci ritroveremo con una schermata completamente vuota, ma prima di procedere con l’inserimento dei widget una nota: i file con estensione “zw” dovete inserirli nella cartella \ZooperWidget\Templates\ se volete poi avere la possibilità di caricarli.

Fatto ciò tenete premuto in un punto qualsiasi dello schermo e procedete con l’inserimento dei widget di Zooper, anche qui un appunto: visto che i template che andremo poi a inserire rischiano di non essere visualizzati correttamente nell’anteprima se le dimensioni che avete selezionato (per il widget) fossero troppo ridotte vi consigliamo di “tenervi larghi”, casomai ridimensionerete poi.

Warp_5_08 Warp_5_09

Warp_5_10 Warp_5_11

Una volta che vi si presenta l’ultima immagine tappateci sopra per definire il tipo di widget, selezionate la voce SD card (Template su SD) e vi ritroverete un elenco: widget 13, 47, 33, 49, 15, 16, 17, 18; l’ordine non progressivo è per via delle dimensioni dei widget. Una volta selezionato uno vedrete una piccola anteprima e un elenco di impostazioni, tappate sopra la voce aspetto, ora scrollando sul lato a destra (se lo fate su quello a sinistra sposterete l’ordine di visualizzazione dei vari componenti costituenti il widget) tappate sopra ognuno dei file bitmap, al che vi si aprirà un ulteriore sottomenu, dove andrete di nuovo a cliccare su bitmap per scegliere infine l’immagine.

Se vi siete persi e vi state domandando che immagine vi spieghiamo un attimo meglio: fate finta che l’immagine iniziale (il risultato che vogliamo ottenere, per capirci) sia diviso in vari “blocchi”, in questo caso ogni blocco è un widget e raggruppa diversi di quei “cerchi” con all’interno le immagini. Con la procedura che vi abbiamo descritto sopra andiamo a definire quale immagine debba apparire dentro ad ogni singolo cerchio, il widget è già “costruito” per puntare ad una determinata applicazione, per cui seguite la denominazione proposta per evitare di trovarvi l’icona di Whatsapp che tappando vi apra Facebook; i file non sono chiamati esattamente come vi viene proposto dentro “bitmap” ma vedrete che sarà facile intuire a cosa debbano essere associati.

Warp_5_12 Warp_5_13

Warp_5_14 Warp_5_15

Warp_5_16 Warp_5_17

Ora, anche se avete seguito pedissequamente queste istruzioni, potreste ritrovarvi con le immagini che popolano queste circonferenze, più grandi delle stesse, e quindi con un antipatico effetto di “sbordo”; niente paura, dipende sempre dalle dimensioni del widget, evidentemente più piccole del necessario, in questo caso potete regolare il tutto grazie al parametro “Scaling”, vi basterà aumentarlo e diminuirlo fino a ottenere la giusta proporzione, se vedete i bordi azzurri del cerchio e le linee siete sulla buona strada, altrimenti rimodificateli.

Warp_5_18 Warp_5_19

Warp_5_20 Warp_5_21

Bene, ora resta solo il lavoro di “fino”, tenendo premuto sul widget potrete comodamente spostarne il posizionamento e ridimensionarlo (non troppo da qui, rischiate sgradevoli effetti), per cercare di emulare il risultato che vi avevamo palesato all’inizio.

Warp_5_22 Warp_5_25

Warp_5_26 Warp_5_30

Warp_5_31 Warp_5_36

Risultato finale

Una volta dimensionati correttamente i vari widget il problema resta solo nel posizionarli correttamente nella home, così come ci siamo prefissati; qui non vi postiamo tutti i passaggi (che potete comunque trovare nella galley a fine articolo) e vi mostriamo quindi cosa abbiamo concluso noi:

Warp_5_38

Un po’ per patriottismo, un po’ per mostrarvi che potete spaziare come volete abbiamo inserito il nostro logo di AndroidWorld nel cerchio centrale e tappandolo parte…la nostra app ovviamente; la configurazione postata su MyColorScreen era ancora più articolata, perché come avrete notato c’erano delle icone sulla home, una seconda pagina e venivano utilizzate anche altre app, ma pensiamo che per stavolta ne avrete già abbastanza, nel caso vogliate provare a realizzarla anche sul vostro dispositivo.

Come vi abbiamo già detto in questa rubrica, siamo sempre aperti alle vostre osservazioni e ai vostri suggerimenti; la prossima volta parleremo di personalizzazioni che necessitano dei permessi di root, volete quindi candidare qualche idea? Fatelo scrivendo nei commenti e se avete rivisitato questa grafica in una maniera che vi rende orgogliosi, postateci qualche immagine o scriveteci dal form contatti.