flat design: perche` funziona?

Transcript

flat design: perche` funziona?
Lifestyle Trend Forecast 2016
Corso in Partenza
DURATA: 6 ORE. DATE: Lun. 27/06 e Lun. 04/07 dalle 19 alle 22.
LUOGO: Terrazza del Negozio di Mosaico ANNAFIETTA, Ravenna.
Lifestyle Trend Forecast 2016
OBIETTIVI
La conoscenza dei trend come supporto per orientare il business.
Verranno indagate e analizzate le nuove tendenze nel fashion, nel web,
nella cultura, nel colore, nella cucina, nell’evoluzione degli stili, nell’
orientamento all’acquisto fino alle ultime tendenze nel campo dell’
organizzazione aziendale.
Uno studio comparato delle previsioni in questi ambiti rappresenta
un valido aiuto per chiunque abbia una relazione con un mercato,
sia che l’offerta riguardi un prodotto o un servizio.
Il corso aiuterà i partecipanti a comprendere le influenze e le dinamiche
che condizionano l’atteggiamento verso l’acquisto, permettendo così
di ottimizzare al meglio le strategie commerciali.
TEMI
●
●
●
●
●
●
Le tendenze in diversi ambiti culturali: arte, musica, video/cinema.
Le tendenze nella moda: evoluzioni stilistiche, previsione dei colori.
Gli andamenti delle ricerche sui motori di ricerca e sui social.
Le variazioni del gusto.
L’evoluzione del punto vendita: online e offline.
I nuovi modelli dell’organizzazione aziendale.
VISUAL DESIGN
EMOZIONE & FUNZIONE
IL RUOLO DEL VISUAL DESIGN
Contenuto ed Emozione
L’informazione ricevuta dal cervello
è importante tanto quanto
l’emozione ricavata dai sensi.
Il visual design ha un ruolo semantico
nella trasmissione del contenuto agli utenti.
Costruisce significati.
Arricchisce e completa il contenuto.
Fonte: Nicolò Volpato - UX Designer
FORMA / SOSTANZA
PERCEZIONE
FORMA
+
LAYOUT
VISUAL DESIGN
SOSTANZA
CONTENUTO
FUNZIONALITA’
Fonte: Nicolò Volpato - UX Designer
VISUAL DESIGN
MESSAGGIO
+
TONO
+
FORMATO
Cosa viene
comunicato
Come viene
comunicato
Come viene
trasmesso
Contenuto
Funzionalità
Visual Design
Esecuzione
Tecnologia
Fonte: Nicolò Volpato - UX Designer
CONTENUTO vs DESIGN
“Content precedes design.
Design in the absence of content is not design,
it’s decoration.”
— Jeffrey Zeldman
Fonte: Nicolò Volpato - UX Designer
ESPERIENZA ED EMOZIONE
Qual è il ruolo dell’emozione nell’esperienza?
Cosa rende un’esperienza indimenticabile?
L’atmosfera, il setting, la situazione, il contesto.
E sicuramente le emozioni provate.
Le esperienze emotive vengono ricordate
più a lungo ed hanno maggiore impatto
sulle nostre decisioni.
Fonte: Nicolò Volpato - UX Designer
EMOTIONAL DESIGN
Gli oggetti che forniscono un’esperienza estetica
migliore funzionano meglio.
O quanto meno, la nostra percezione
è che funzionino meglio.
Un atteggiamento emotivo positivo rende
le persone più tolleranti verso le piccole difficoltà
e maggiormente flessibili e creative
nel trovare soluzioni ai problemi.
Fonte: Nicolò Volpato - UX Designer
EMOTIONAL DESIGN
Per sua stessa definizione, il design è orientato alla funzionalità.
Nasce per servire uno scopo.
D'altra parte, l'arte è prevalentemente definita dall’estetica e dalla nozione di bellezza.
Hartmut Esslinger, il fondatore di Frog Design, afferma che la forma
dovrebbe seguire l’emozione piuttosto che la funzione.
Estetica e funzione dovrebbero diventare intrecciate e interdipendenti
come nel caso del simbolo Yin-Yang.
Il mondo è in lotta per i bisogni di base come cibo, alloggio,
salute e diritti umani fondamentali.
Ma vi è anche una necessità di autodeterminazione e di lusso.
Allo stesso modo, estetica e funzione sono radicati nel design.
entrambi rimangono prevalenti, e per il futuro
si può solo sperare in un equilibrio più armonioso.
Esslinger Hartmut. Advice For Designers. 2013
PIRAMIDE DI MASLOW
PIRAMIDE della QUALITA’ dell’INTERFACCIA
PIACEVOLE
USABILE
AFFIDABILE
FUNZIONALE
IL SORPASSO DEL MOBILE
TENDENZE PER DISPOSITIVI
Quote di traffico e di ordini registrati nel 1° trimestre 2016.
Fonte: Demandware Shopping Index.
FATTORI DI CRESCITA E CALO
Confronto fra siti tra il 1° trimestre 2016
e il 1° trimestre 2015.
Fonte: Demandware Shopping Index.
WEB DESIGN
GLI ULTIMI TREND:
FLAT DESIGN E MINIMALISMO.
SKEUMORPHISM vs FLAT DESIGN
RIVOLUZIONE IN MUTAZIONE
La rivoluzione del flat design è sempre più attuale.
● Nasce come risposta allo scheumorfismo.
● Rende qualsiasi interfaccia più intuitiva.
● Funziona bene nel responsive.
● Ideale per ogni tipo di device.
● E naturalmente è molto gradevole.
Nel prossimo evolverà e si adatterà
a mutevoli esigenze e nuove intuizioni creative.
Come funziona esattamente e come cambierà?
Diamo un'occhiata.
Fonte: Web Design Book of Trends 2015-16 - UXPin Inc.
FLAT DESIGN: PERCHE’ FUNZIONA?
OMBRE LUNGHE
Le lunghe ombre nel flat design:
● aggiungono profondità
● non penalizzano il minimalismo
● sono leggere e discrete
● sono un piccolo extra visivo d’interesse.
Fonte: Web Design Book of Trends 2015-16 - UXPin Inc.
FLAT DESIGN: PERCHE’ FUNZIONA?
PIÙ FANTASIA ALLE ICONE
Con solo gli elementi essenziali sullo schermo,
le icone hanno bisogno
di maggiori dettagli e più arte
per rendere le cose interessanti.
● Le icone diventano molto più grandi
● e arricchite di molti più dettagli.
Fonte: Web Design Book of Trends 2015-16 - UXPin Inc.
FLAT DESIGN: PERCHE’ FUNZIONA?
COLORI DINAMICI
L’uso dinamico dei colori e delle tinte vivaci
galvanizza l’impatto grafico del sito.
Colori a contrasto (anche se pastello)
valorizzano gli elementi della pagina,
soprattutto se pochi,
eliminando l’effetto “solitudine”.
L’uso del colore è fondamentale per l’impatto
di un sito.
Colori pastello con giochi di chiaro-scuro
e tinte forti a contrasto
fanno emergere un elemento dallo sfondo.
Fonte: Web Design Book of Trends 2015-16 - UXPin Inc.
FLAT DESIGN: PERCHE’ FUNZIONA?
FONT DISADORNI
Usare possibilmente una font unica
e senza fronzoli.
Usare una stessa font garantisce
che l’attenzione
converga di più su oggetti e contenuti.
(Type-Only-Websites).
Se sono di più, che siano simili.
Fonte: Web Design Book of Trends 2015-16 - UXPin Inc.
FLAT DESIGN: PERCHE’ FUNZIONA?
FONT ESAGERATI
Il flat design, in materia di font,
si sta evolvendo in “tipografia dalle grandi dimensioni”
soprattutto in home page
(Hero Headers - Oversized Typography).
Fonte: Web Design Book of Trends 2015-16 - UXPin Inc.
FLAT DESIGN: PERCHE’ FUNZIONA?
MINIMALISMO
Flat design e minimalismo condividono
gli stessi principi:
• semplicità e la progettazione di contenuti focalizzati.
Anche se può sembrare la via più facile
il minimalismo è in realtà più difficile da fare bene.
Minor numero di elementi significa
usare quei pochi disponibili con maggiore cura.
Fonte: Web Design Book of Trends 2015-16 - UXPin Inc.
MISCELARE GLI STILI
FLAT DESIGN + FOTOGRAFIA
Sovrapposizione di vettoriale e fotografia di alto livello
MISCELARE GLI STILI
HERO HEADERS + IMMAGINI
Immagini HD e testo molto in evidenza (senza altri elementi aggiuntivi).
MISCELARE GLI STILI
IMMAGINI IN HD
Mai più foto da cellulare o non professionali sui siti web.
MISCELARE GLI STILI
NAVIGAZIONE SEMPLIFICATA
Hamburger Menu e Ghost Buttons.
MISCELARE GLI STILI
ARMONIA VISIVA e SIMMETRIA
Simmetria speculare, radiale, asimmetria e animazione.
MISCELARE GLI STILI
CONTRASTO
Con pochi elementi si è costretti a creare una gerarchia.
Il contrasto può essere: di forma, colore, dimansione e di posizione.
MISCELARE GLI STILI
SPAZIO VUOTO
Più spazio c’è intorno a un oggetto, più l’occhio ne è attratto.
LESS IS MORE
FLAT DESIGN
+
MINIMALISMO
● Benefici reali
● Estrema eleganza
● Spazio agli spazi negativi
● Minore è il numero di elementi sullo schermo
maggiore sarà la loro forza.
NON È SEMPLICEMENTE VUOTO O CARENZA
MA IL DISFARSI INTENZIONALE
DI TUTTO CIO’ CHE DISTRAE
L’UTENTE DAI CONTENUTI.
Fonte: Web Design Book of Trends 2015-16 - UXPin Inc.
5 TREND
NELL’E-COMMERCE
PER IL 2016
5 TREND NELL’E-COMMERCE PER IL 2016 (e oltre)
1. SHOPPING MULTI-CANALE:
AUMENTARE LE POSSIBILITÅ.
La ragione per cui così tanti consumatori vanno
su siti tipo Amazon (marketplace)
è perché possono trovare una vasta gamma
di oggetti unici da venditori diversi.
E pagare con un’unica transazione.
Questa tendenza è in crescita.
Alcune aziende indicano limiti alla vendita
se non piazzano i propri prodotti anche in luoghi come
Amazon, Etsy o Farfetch.
Fonte: ecommerce-platforms.com - di Catalin Zorzini
5 TREND NELL’E-COMMERCE PER IL 2016 (e oltre)
2. SOCIAL POTENZIATI.
Fin ora il social media ha collegato gli utenti
ai contenuti pubblicati.
Questo generava interesse e al massimo indirizzava l’
utente verso le pagine di prodotto, al sito o al blog,
se previsto da un link.
Ora il panorama social e-commerce sta cambiando,
perché molti social network
hanno aperto i loro sistemi alla vendita.
Pinterest, Twitter e Facebook
hanno annunciato pulsanti in grado di vendere
prodotti direttamente attraverso il social stesso.
Fonte: ecommerce-platforms.com - di Catalin Zorzini
5 TREND NELL’E-COMMERCE PER IL 2016 (e oltre)
3. LA RIMONTA DEI POP-UP.
Ricordate quando i pop-up erano in pieno vigore?
Gli utenti li odiavano.
Avrete notato che stanno tornando?
Tuttavia, ci sono alcune differenze.
I nuovi pop-up in genere regalano qualcosa
in cambio di indirizzi e-mail.
E generalmente non ricompaiono.
Questi pop-up fanno miracoli per l'email marketing
e non hanno il sapore della vecchia
pubblicità ingannevole.
Fonte: ecommerce-platforms.com - di Catalin Zorzini
5 TREND NELL’E-COMMERCE PER IL 2016 (e oltre)
4. GRANDI IMMAGINI,
GRANDE PULIZIA.
Le immagini a tutto schermo (o i video)
sono il miglior biglietto da visita
per i siti di e-commerce.
L’azienda riesce a spiegare rapidamente
lo scopo del sito in un video breve,
o con un’immagine mozzafiato.
I moduli multimediali enormi tendono quindi una mano
al consumatore, e la maggior parte del disordine
è lasciato in pagine secondarie.
Fonte: ecommerce-platforms.com - di Catalin Zorzini
5 TREND NELL’E-COMMERCE PER IL 2016 (e oltre)
5. L’ESPLOSIONE DELLE
FLASH COLLECTIONS.
Groupon è ancora vitale,
ma la vera novità in questo senso
è arrivata da altri siti di e-commerce.
Le collezioni flash registrano un crescente successo.
Hanno il fascino dei prodotti fatti su misura.
E il carattere d'urgenza, unicità e irripetibilità
è spesso troppo intrigante
per non rimanerne affascinati.
Fonte: ecommerce-platforms.com - di Catalin Zorzini
FONTI
VISUAL DESIGN: EMOZIONE E FUNZIONE.
• Nicolò Volpato - UX Designer
IL SORPASSO DEL MOBILE
• Google
FLAT DESIGN E MINIMALISMO: GLI ULTIMI TREND.
• Web Design Book of Trends 2015-16 - UXPin Inc.
5 TREND NELL’E-COMMERCE PER IL 2016
• www.e-commerce.platform.com
GRAZIE