Essendo uno sviluppatore che vuole essere un designer, sono davvero interessato a imparare a creare un'interfaccia utente di prim'ordine per siti Web, app mobili, ecc. Tuttavia, non so nulla di PhotoShop o di qualsiasi cosa relativa alla progettazione tranne HTML e CSS.
Dove dovrei iniziare? Come imparo a creare siti Web e interfacce dal design accattivante?
C'è un libro, un tutorial, ecc. Che mi consigliate?
Grazie!
Risposte:
Per l'interfaccia utente, consiglio di utilizzare Fireworks su Photoshop. Photoshop è ottimo per opere creative e complesse (stampa o web), ma secondo me uno strumento eccessivamente complesso per l'interfaccia utente relativa al web.
Fireworks è specificamente progettato come uno strumento di authoring orientato al web dove Photoshop non lo è. Il set di strumenti di Fireworks è orientato alla creazione dell'interfaccia utente Web, non al complesso lavoro creativo offerto da Photoshop.
Fireworks utilizza uno strumento molto simile impostato su Photoshop, meno il gonfio, in modo da poter fare tutto il necessario per creare l'interfaccia utente Web.
Anche Fireworks fa parte di Adobe Creative Suite, quindi se hai Photoshop dovresti averlo anche tu.
Materiale di riferimento, non specifico di Fireworks ma dell'interfaccia utente in generale;
http://www.jankoatwarpspeed.com/
Consiglio vivamente di leggere i suoi articoli e guardare il suo lavoro come fonte d'ispirazione. Ci sono 2 lati dell'interfaccia utente che copre molto bene: l'interfaccia e l'esperienza di utilizzo dell'interfaccia. Chiamato anche UI e UX.
Imparare come usare l'applicazione può essere trovato attraverso tutorial online. Envato ha una grande rete di tutorial http://tutsplus.com/ , a condizione che il loro sito principale Tutorial per il web sia orientato a Photoshop, ma la maggior parte di ciò che fanno in Photoshop viene fatto con lo stesso metodo, o simile, in Fireworks.
Mi trovo anche abbastanza spesso nei siti di segnalibri che hanno tratti di design unici o elementi dell'interfaccia utente che in alcuni scenari futuri funzionerebbero bene per un progetto. Ad esempio una struttura tab unica, uno stile accordian o persino un cercapersone.
L'interfaccia utente di progettazione a livello base è suddivisa in aree di visualizzazione dei dati. Dato che hai un background da sviluppatore, sai come presentare i dati da una prospettiva logica (menu, fisarmoniche, tab ecc.). Ora sta davvero costruendo quell'interfaccia utente usando quei controlli o moduli da una prospettiva visiva.
Alcune letture aggiuntive su UX:
Avendo anche un background da sviluppatore, posso dirti che quando creo le mie app, il primo passo è creare l'interfaccia utente che a sua volta definisce la funzionalità delle app. La mia opera d'arte creata funge sia da valore artistico per l'app ma anche dalla definizione della funzione. Costruisco sempre la mia logica attorno all'opera completa, mai viceversa. Questo significa sempre che ho messo l'utente per primo.
Spero che questo ti dia almeno un punto di partenza.
Sei fortunato. Molte persone sono entrate nel mondo del Web Design ponendo la stessa domanda. Spesso vedrai un team di persone composto da almeno un programmatore e un graphic designer. Buona scelta con Photoshop: ecco cosa mi attacca.
Con la versione più recente di Adobe Photoshop, CS5, è diventato estremamente avanzato, in grado di eseguire attività complesse con strumenti semplici o anche attività più complesse con strumenti complessi. Ma ti avverto, l'apprendimento di tutte le fantastiche funzioni di Photoshop può portare alla mancanza di nutrienti. :)
Ecco un tutorial che copre le basi in modo da poter ottenere lo swing delle cose:
Una volta che hai capito tutto, ho trovato un sacco di siti su Google che hanno alcuni tutorial di design davvero innovativi.
Ci sono alcune tecniche che potresti dover imparare. Un suggerimento, lucido è di solito un buon passo in questi giorni. Per ottenere un design davvero unico, trova le funzionalità che ti piacciono da qualsiasi modello di sito Web, quindi usalo a modo tuo.
Spero che ciò abbia aiutato. Lascia un commento se hai bisogno di maggiori informazioni.