Passa ai contenuti principali

Anteprime delle proprie UI su iPhone, iPad e mobile

Grafica e ui su mobile iphone ipad android

Quando si realizzano UI per il mobile una delle cose fondamentali è vedere come sarà il nostro lavoro sul dispositivo interessato o meglio ancora poterlo vedere volta per volta ed avere la possibilità di cambiare in tempo reale, dimensioni, effetti o colori.

Ci sono alcuni programmi che ci aiutano a fare questo (io vi illustrerò quelli per mac perchè è la piattaforma che utilizzo) vediamo quelli più conosciuti e più usati nel settore.

anteprima su ios iphone ipad

LiveView - Free (iPhone free)
Semplice ed essenziale, gratuito sia per iPhone sia per Mac, permette velocemente di vedere una porzione dello schermo sul nostro iPhone/iPad. Una volta avviato sia il programma su mac sia il client su iphone vedremo un selettore sullo schermo del computer e tutto quello che è "selezionato" sarà visibile sul nostro cellulare. Putroppo quando si realizzano UI per iPhone 5 c'è il problema della risoluzione dello schermo (1136px) che non entra tutta nella selezione visto che uno schermo full HD ha una risoluzione massima di 1080px, problema che non c'è nel caso di schermi da 24"(con risoluzione 1920x1200) o da 27"(con risoluzione 2560x1440px).

PRO:
- Gratuito sia per Mac che per iPhone
- Visualizzazione real time di ciò che stiamo facendo

CONTRO:
- Se non si ha uno schermo generoso su iphone5/ipad(retina) l'anteprima è tagliata
- un pò di lag nell'aggiornamento dell'immagine

xScope anteprima su ios iphone ipad

xScope - €26,99 (iPhone €1,79)
Questo è quello che risulta essere il più completo e con più funzioni rispetto agli altri, infatti una volta lanciate le due app come per LiveView avremo un selettore sul desktop che ci permetterà di vedere sullo schermo del nostro device mobile il lavoro che stiamo eseguendo. In più avremo a disposizione righelli, guide e vari settaggi per rendere più precisa la nostra UI. C'è la possibilità di utilizzare porzioni di schermo o le finestre attive oltre ad impostare navbar, topbar ecc ecc, tutte queste funzioni possono tornare utili per bypassare il problema della risoluzione dello schermo. C'è una versione demo gratuita ma purtroppo è a pagamento anche l'app per iPhone quindi anche per provarlo dovremo comprare l'app mobile.

PRO:
- settaggi e funzioni extra

CONTRO
- prezzo, il più alto fra quelli visti e si paga anche l'app per iphone
- ogni tanto ha qualche piccolo lag di refresh dell'immagine

Skala antepriam su ios ipad iphone

Skala - €4,49 FREE (iPhone free)
Questo software ha un costo veramente basso e permette due modalità di visualizzazione o meglio ne ha una principale e poi è usabile con Photoshop. La prima mostra una finestra sullo schermo nella quale noi possiamo droppare i nostri file e vederli in anteprima sul nostro device mobile e questo permette di bypassare il problema della risoluzione del monitor. Mentre con Photoshop è possibile avere in realtime tutto quello che facciamo, questo però esclude tutti gli altri programmi come illustrator, fireworks o sketch. Fra quelli visti è l'unico che supporta anche android e l'app mobile non è un semplice visualizzatore infatti è possibile eseguire alcune operazioni, come zoom, cambio colore ecc ecc.

PRO:
- compatibile con android
- bypassa il problema della risoluzione dello schermo

CONTRO:
- anteprima in real time solo se si utilizza photoshop

Alternativa...

Dropbox - Free (iPhone free)
A volte i programmi nascono per fare altro ma possono essere sfruttati per far ciò che ci serve, come nel caso di dropbox il quale potrebbe svolgere una funzione simile a quella dei programmi sopra citati, infatti, grazie al suo client per mobile che supporta immagini ed anche i .PSD è possibile mettere il file a cui stiamo lavorando su dropbox e aprirlo dal nostro device, così ad ogni salvataggio avremo l'anteprima aggiornata, certo non è veloce come il realtime ma può andare bene e poi non ha problemi di risoluzione dello schermo.

Dulcis in fundo...
Io fra questi uso principalmente LiveView sia perchè è gratis sia perchè mi risulta più veloce da utilizzare, molte volte lo alterno con Dropbox in questo modo riesco a vedere sia le anteprime in realtime sia vedere l'intera ui sullo schermo del mio device.

Per la foto di apertura: Pixeden

Commenti

Post popolari in questo blog

Caffetteria, piccole regole da seguire

Succede che arrivando in caffetteria trovi un po' troppa gente, di conseguenza i tavoli sono pieni e trovare il tuo angolino diventa un po' complicato. Proprio quello che è successo oggi, ma si è rilevato un ottimo spunto per scrivere due righe su come ci si comporta in un coffee shop.

Sketch, The designer's toolbox

Da sempre, quando si parla di ui, ux, web, design, ecc si fa riferimento alla suite Adobe: Photoshop, Illustartor, Firework, inDesign e via discorrendo. Ultimamente, però, sono sempre di più le applicazioni che stanno venendo fuori, per aiutare i designer nel loro lavoro, sia online che non. Oggi vorrei mostrarvi Sketch , app sviluppata dai ragazzi di  bohemiancoding  e purtroppo disponibile solo per mac, la quale si propone come toolbox completo per i grafici. Appena avviata, se abituati ad usare i programmi adobe, ci troveremmo un attimo spaesati questo perchè Sketch risulta più semplice e con meno strumenti, rispetto ad esempio a Photoshop (vedi tutta la parte di Photo Editing) ma noteremo subito la semplicità di utilizzo che ci porterà ad utilizzarla senza troppi problemi, una volta capito il funzionamento andremo veloci come la luce! Avremo così a disposizione un tool che ci permetterà di lavorare su una grafica vettoriale, facilitandone le esportazioni per vari

Travel Preset Lightroom Mobile

Utilizzo Lightroom da tantissimo tempo e dopo aver fatto mille edit e mille modifiche ho comiciato a salvare i miei preset,  questi che vi propongo sono una selezione dedicati alla fotografia di viaggio e street...