Lezione gratuita dal corso UI Design
Ok, abbiamo visto un po' di cose, abbiamo visto come trattare il colore, come trattare la tipografia, ovviamente legata al nostro brand di partenza.
Abbiamo visto tanti spunti, ma adesso dobbiamo mettere le mani in pasta.
Quindi che cosa dobbiamo fare? Una cosa che vi consiglio anche qua forse diciamo, non è fondamentale per tutti.
Per me invece lo è quella di creare una mood board proprio l'altro giorno parlavamo con un docente del master e lui diceva che quando parte per ogni progetto dedica almeno il venti trenta percento del tempo alla ricerca visuale da condividere con gli altri e quindi la mood board.
Io direi che secondo me è un asset fondamentale, perché appunto come designer abbiamo bisogno di allenare costantemente la nostra, la nostra mente no.
Anche Munari diceva che per diciamo foraggiare la nostra creatività, abbiamo bisogno di vedere costantemente cose e quindi fa un mood board.
Innanzitutto ampliare i nostri orizzonti da design, ma soprattutto cercare un territorio comune con chi sta parlando e progettando insieme a noi.
Infatti la cosa che vi consiglio di fare, che sembra una pratica, un po' strana, è di fare delle mood board condivise insieme ai vostri clienti o chiunque debba fare con voi questo lavoro, non mettetevi a fare una mood board dove siete voi che producete materiale in maniera, diciamo totalmente autonoma e scollegata dagli altri.
Cercate sempre di fare una multa guarda la vostra o del vostro team di design, ma fate fare una mood board anche al vostro cliente, perché così capirete se le vostre aspettative stanno incontrando una direzione comune.
Quindi, mi raccomando, partite sempre da un mood board.
Una mood board è, diciamo, come dire, una direzione di alto livello di tutti gli elementi visivi che vogliamo comunicare.
Vogliamo mettere all'interno del nostro prodotto è cosa ci possa essere dentro un mood board dentro un motore possono essere fotografie, trattamenti fotografici, possono essere riferimenti benchmark di altri siti, di altre applicazioni, illustrazioni, trattamenti tipografici.
Addirittura, appunto, anche animazioni micro interaction che ci sono piaciute e che vogliamo mutuare, magari qualcosa che mette insieme la gerarchia, il ritmo della pagina che noi vogliamo comunicare.
Un mood board, tutto questo, una serie di ispirazioni.
Poi vediamo come potremmo.
Potrò provare a procedere a fare una mood board.
Possiamo farla in tantissimi modi, è esistono tantissimi tool che ci aiutano a farla.
Possiamo anche utilizzare più interest.
Se ci va, poi vedremo come farla anche dentro film o dentro Fig.
Ma più o meno una mood board deve avere questo Luca infila una serie di spunti di altri è city o prodotti che ci piacciono, una serie di altri elementi tipografici che vogliamo veicolare.
O anche, appunto, un mood board legata alla palette colonna.
Per esempio, se io vi facessi vedere adesso questa mood board qui sto comunicando una serie di scelte cromatiche, molto quelle che in gergo vengono chiamati i colori Newt Newt no ai colori muti, i colori pastello.
Mettere insieme una serie di immagini lo racconta meglio, ovviamente di mille parole.
Quindi partite sempre da questo.
Una volta che avete fatto questo, che cosa potete fare? Potete ovviamente abbiamo detto utilizzare i tour che volete per realizzarla, ma dopodiché definiamo quella che in gergo viene chiamata una style.
Attenzione chi fa questo lavoro magari ha sentito un termine simile che si chiama Stig, ma quella viene fatta a posteriori, si definisce lo stile di un sito di un'applicazione e poi vengono parametri zato gli elementi grafici.
Questo invece no.
La stabilità e non è questo no, la standardizzazione degli elementi grafici, ma è anche qui è un mood board più rifinita verticale sul prodotto digitale.
Noi abbiamo fatto questa mood board, abbiamo scelto una direzione comune con gli altri designer, con gli altri stakeholder.
Abbiamo deciso dove in che direzione andare.
Prepariamo queste piccole tavole.
Uno salta in una tavola veramente molto limitata, dove mettiamo insieme una serie di elementi che possano far capire il look finale che vogliamo dare.
La nostra interfaccia.
Sì, si tratta di pallet di trattamento, appunto delle fotografie di trattamento degli elementi di interfaccia, come per esempio i pulsanti di elementi grafici generali.
Per esempio vi faccio vedere questa stai qui è un esempio, ma se volete approfondire l'argomento, vi consiglio di andare su Street a Il punto è che le racconta.
Insomma, fa una disamina molto più attenta su questo strumento, ma vi faccio vedere, per esempio, appunto la differenza tra una realtà e l'altra quale puoi.
Per esempio questa è una style tai, una proposta per un giornale che deve appunto creare un nuovo prodotto digitale.
A breve potrei andare al mio cliente e dirgli più o meno il look filo è questo uno dice sì, ma qui non c' è il sito no, cioè l'applicazione si' pero' Io ti sto trasmettendo bene o male un look Phil generale e questo potrebbe essere una prova, la seconda style che potremmo vedere invece magari di questo tipo qua vedete che gli elementi sono gli stessi.
Abbiamo sempre la tipografia, sempre la palette colore.
Abbiamo trattamento di immagini e il trattamento, per esempio, di un bottone.
Ma come vedete è diversa rispetto all'altra mi sta comunicando un altro look film magari piu' appunto.
Anche le parole chiave aiutano a comunicare in una saltai qui mi dice che appunto più autoritario, più solido, più conservativo.
Oppure potremmo fare un esempio di questo tipo qui il terzo, sempre lo stesso sito internet finale di riferimento, lo stesso verde cliente.
Tre stili diversi da proporgli prima di andare avanti.
Questo stile, per esempio, è più accessibile piu' ehmm, più affidabile, più friendly, più moderno.
Ovviamente tutte queste cose noi lo possiamo trasmettere con gli elementi grafici.
Quindi sarà nostra cura creare una tavola di questo tipo, uno o più tavole, perché se per esempio vediamo che dalle mood board escono delle constatazioni divergenti, quindi magari si vuole andare in due o tre direzioni diverse si tirano fuori due o tre.
Salta il diverse si fanno vedere.
Ovviamente si fa vedere il nostro cliente o chiunque debba proseguire con noi la strada del design e da qui si inizia a progettare il sito internet finale.
Questo passaggio diventa fondamentale, come vi dicevo, perché noi non stiamo progettando un poster o un biglietto da visita.
Stiamo progettando qualcosa che poi a cascata si rifletterà su n pagine su tanti elementi della navigazione.
Se doppiamo come per dire, lo stile diventa un bel casino all'inizio della mia carriera e io facevo sempre così partivo random con i miei clienti, dicevo Ok brief andavo, progettavo, iniziamo a progettare l'home page la pagina di dettaglio se erano in commercio, la pagina di carriera iniziò a fare tutte le pagine e poi arriva il cliente, mi diceva Sì, ma questo stile non mi piace e io avevo già prodotto ore e ore e ore di lavoro, poi con il tempo invece apparato eh, un po' studiato anche.
Insomma, meglio, diciamo il flusso.
E ho capito che invece facendo prima il passaggio dei dem, poi il passaggio della stabilità nel momento in cui andiamo a consegnare al nostro cliente il primo out finale, siamo sicuri che bene o male.
Insomma, variazioni sullo stile non ci saranno perché abbiamo costruito tassello dopo tassello, il percorso per arrivare, diciamo, mano nella mano e al al output visivo desiderato.
Learnn è la piattaforma online che ti aiuta a 360 gradi a crescere nel digitale. Sviluppa competenze con oltre 220 corsi, condividi i tuoi risultati, fai networking con otre 120.000 professionisti/e e oltre 300 aziende.
Vogliamo cambiare l’Italia, una persona alla volta.
Per farlo ci proponiamo di democratizzare l’apprendimento e accelerare la crescita di persone, idee e aziende attraverso strumenti tecnologici a supporto di qualsiasi professionista.
Learnn prevede un piano totalmente gratuito (Free) che ti permette di iniziare qualsiasi corso che abbiamo su Learnn.
Per chi volesse finire i corsi, ottenere certificazioni e connettersi con professionisti e aziende, Learnn Pro permette di avere accesso illimitato a tutto questo. Il corso di Learnn Pro è 9.99 euro / mese e puoi disdire quando vuoi.
Per i team di aziende abbiamo anche un Piano Team con oltre 300 clienti aziendali.
Potrai seguire i contenuti da computer, tablet e smartphone.
Scarica l’App iOS/Android Learnn e segui i contenuti in modalità video, audio e testo.
Learnn ha un piano gratuito che ti permette di accedere all 40% di ogni corso in maniera gratuita e solo con la tua email.
Learnn offre sia un piano gratuito con accesso limitato ai contenuti, sia un piano PRO del costo di soli 9.99 euro al mese con cui potrai avere accesso a tutti i nostri contenuti senza limiti o sorprese.
Una volta completata l’iscrizione sarà possibile gestire i propri dati e disdire in qualsiasi momento e in completa autonomia.
No, non offriamo certificazioni, facciamo di meglio.
Man mano che completi corsi potrai verificare le tue competenze e condividerle sul tuo profilo LinkedIn o CV.
Inoltre abbiamo sviluppato una feature chiamata Profile attraverso il quale otterrai un link personale per mostrare in tempo reale tutti i contenuti da te completati e molto altro.
Immagine personale, username, badge, link esterni e molto altro.
Crea una vera e propria sales page dove il prodotto in vendita sono le tue competenze.
Se avessi altre domande puoi usare la live chat qui di fianco.
Per partnership compila questo form
La nostra vision è rendere l'Italia famosa nel mondo per l'esecuzione.
La missione di Learnn
è accelerare la crescita di ogni individuo rendendo accessibili conoscenza, opportunità e tecnologia per avere un impatto positivo sul mondo e sugli altri.
Tutto incluso (come Netflix), IVA inclusa, nessuna sorpresa o addebito indesiderato.
Disdici quando vuoi, in 1 click.
Scegli di migliorare ogni giorno per 12 mesi senza interruzioni scegliendo il piano annuale.
In un unico pagamento annuale
Disdici quando vuoi, in 1 click.
Con l’abbonamento otterrai:
Consuma i +200 corsi e webinar di Learnn da webapp o app iOS e Android, in formato video, audio o testo.
Con l'abbonamento a Learnn hai accesso a tutto (proprio tutto) ciò che contiene la piattaforma.
Ogni mese registriamo nuovi corsi su tutto cio di cui potresti avere bisogno nel mondo digitale.
Con l'app Learnn trasformi ogni momento di vuoto in un'occasione di apprendimento.
Scarica tutto il materiale che ti serve e utilizza i moduli riassuntivi per fissare i concetti.
Ogni settimana nuove offerte di lavoro da parte di tantissime aziende che operano nel mondo digitale.