SlideShare a Scribd company logo
VISUAL DESIGN
     vs

 CREATIVITÀ
Ciao
Chi sono?
       Nicolò Volpato
visual designer / UX designer
    presso GNV&Partners
@nicolovolpato
BETTER SOFTWARE
     needs
 BETTER DESIGN
STARTUPS
    need
BETTER DESIGN
PEOPLE
    need
BETTER DESIGN
Lo stato delle cose

Molti assunti sbagliati sul design,
 sul visual design in particolare
Lo stato delle cose

“Ci serve della creatività!”
WTF?
Agenzia
     creativa



UX              Dev
Pitch!
     Agenzia
     creativa



UX                  Dev
Agenzia
         creativa
Mockup              Feedback


         Cliente
Agenzia
         creativa
Mockup              Feedback


         Cliente
         = 2 MESI
Conoscenza




Visual
design

         Tempo
WTF!!!
1


BETTER DESIGN
1


   BETTER DESIGN
(e miglior cultura del design)
“Abolire la parola creatività
e promuovere processi user-centered.”
— Alberto Mucignat, AgileUX Camp 2012
Il visual design non è arte.

E‘ metodologia,

è ricerca continua,

è esperienza.
La creatività è sopravvalutata.

Un buon design non è il prodotto di un’intuizione
di un secondo.

E’ frutto di un processo, è un ragionamento.
Richiede tempo, richiede pratica.

Il design è un mestiere.
Perfe o non esiste.

Il design è un processo che si svolge nel tempo.

L’esito della progettazione cambia se cambiano gli
utenti o i loro bisogni.

Il design è iterativo, non fisso.
Buono è abbastanza
Buono è abbastanza, per questa iterazione.

Lavorare per iterazioni presuppone miglioramenti
successivi e consegne a step.

L’eccellenza si raggiunge per gradi, con l’esercizio.
Pixel-perfect non esiste.

Abbandoniamo i pitch con 3 proposte.

Riduciamo il numero dei mockup in Photoshop.

Spostiamoci verso processi di visual design più agili,
device e resolution-independent.

Design in the browser.
La “coolness” non esiste.

Non proponete ad un cliente un visual design perché è
cool, di moda o perché segue i trend delle design
galleries.

E voi clienti, non chiedete un design uguale a quello
che avete visto nelle design galleries.
La “coolness” non esiste.

Un visual design non va venduto al cliente.

Va argomentato al cliente.
Il visual design non é “making things pre y”.

Come ogni linguaggio che trasmette un contenuto,
interpreta il contenuto stesso.

L’estetica non può essere slegata dal contenuto,
deve essere conseguenza del contenuto.
“Content precedes design.
Design in the absence of content is not design,
it’s decoration.”
— Jeffrey Zeldman
Il visual design non è designer-centered.
Occorre umiltà

Non avere fretta di prendere decisioni.

La conoscenza del progetto aumenta nel tempo.
“I’ve merely changed my responsibility from
making choices to asking questions.”
— Paul Soulellis
Lo stile del designer non è rilevante.

Sono il progetto, la tipologia di utenti, il contenuto a
determinare lo stile ed il tono del visual design.

Il risultato deve avere una propria personalità,
non rispecchiare la personalità del designer.
Occorre rimuovere l’ego dal processo.
“Good design should not dominate.
It should not dominate people,
it should help people.”
— Dieter Rams
Il visual design non è solo esecuzione.
“It’s not about asking How, but Why.
It’s not about execution, it’s about
the purpose of what we’re doing.”

— Frank Chimero
How   Design   Why
Making   Design   Thinking
How vs. Why
 Esecuzione vs. Obiettivi
Decorazione vs. Significati
How vs. Why
 Esecuzione vs. Obiettivi
Decorazione vs. Significati
Qualità dell’interfaccia


                      ?

                   Usabile

                   Affidabile

                   Funzionale
Qualità dell’interfaccia


                   Piacevole

                   Usabile

                   Affidabile

                   Funzionale
2


BETTER TEAMWORK
Il visual design è parte del processo di UX.

Perché esternalizzarlo?

Perché non è mansione del team di UX?
Design e sviluppo sono aspe i
dello stesso processo.


Non sono separati.
Design
                                       leads
informs


                   Dev

      — Aral Balkan, From The Front 2012
Impa o del visual design


                  Piacevole

                  Usabile

                  Affidabile

                  Funzionale
Può il visual design essere agile?
Può il visual design essere agile?

Sì.
Può il visual design essere agile?

Sì.

– disegnare per iterazioni, non tutto upfront

– “refactoring” continuo: occorre mettere in discussione
  le scelte, rivederle, migliorarle in modo continuo

– coinvolgere il cliente ed educarlo a fornire feedback
  migliore
Design vision

      UX              UX              UX

Dev    Visual   Dev    Visual   Dev    Visual
Brand            Personas       Strategy


  Design vision
                                  Coerenza


       UX               UX                 UX

 Dev    Visual    Dev    Visual     Dev      Visual



        Miglioramenti        Miglioramenti
          continui             continui
3


BETTER FEEDBACK
Occorre andare oltre il gusto personale.
Sogge ività.
Arbitrarietà.
Sogge ività.
Arbitrarietà.



Ogge ività.
“Il «bello» è conseguenza del «giusto».”
— Bruno Munari
Discutere le motivazioni (Why).

– designer: argomentare le scelte e le decisioni

– cliente: chiedere e comprendere le ragioni alla
  base del design
Due parametri da valutare con a enzione:
1

Adeguatezza
1

           Adeguatezza




Tono   {
       Metafore       Storie   Emozioni
1

                 Adeguatezza




 Tono
 Registro
   Stile
Linguaggio
             {
             Metafore       Storie   Emozioni




Contesto
1

                    Adeguatezza




 Tono
 Registro
   Stile
Linguaggio
             {
             Metafore
             Skeumorfismo
               Texture
                               Storie   Emozioni




Contesto
1

                    Adeguatezza




 Tono
 Registro
   Stile
Linguaggio
             {
             Metafore
             Skeumorfismo
               Texture
                               Storie
                               Narrazione
                           Immagini/Foto
                               Personaggi
                                             Emozioni




Contesto                       Animazioni
                               Transizioni
1

                    Adeguatezza




 Tono
 Registro
   Stile
Linguaggio
             {
             Metafore
             Skeumorfismo
               Texture
                               Storie
                               Narrazione
                           Immagini/Foto
                               Personaggi
                                             Emozioni
                                              Personalità
                                             Anticipazione
                                               Sorpresa
Contesto                       Animazioni      Reward
                               Transizioni
2

Coerenza
2

    Coerenza



{   Design vision
Miglioramenti continui
  Controlli a ritroso
       Umiltà
“Not extraordinary design.
Be er design.”
— Dieter Rams
Grazie
Feedback?
Twitter
@nicolovolpato

Email
nicolo@gnvpartners.com

Web
www.gnvpartners.com

More Related Content

PDF
Visual design, emozione ed esperienza
PPT
Lez1 agopuntura urbanaweb
PPT
Lez1 agopuntura urbanaweb
PDF
exhibition design 1_ambiti/pianificazione
PPTX
Energy efficient manufacturing plant
PDF
Tesi di Laurea - Politecnico di Torino - Architettura I - Merchandising per i...
PDF
Elementary Workshop2Stampa3d
PDF
Progetto d'identità per il brand turistico della città di Bari
Visual design, emozione ed esperienza
Lez1 agopuntura urbanaweb
Lez1 agopuntura urbanaweb
exhibition design 1_ambiti/pianificazione
Energy efficient manufacturing plant
Tesi di Laurea - Politecnico di Torino - Architettura I - Merchandising per i...
Elementary Workshop2Stampa3d
Progetto d'identità per il brand turistico della città di Bari

Viewers also liked (20)

PPTX
Mars
PPTX
Decustruzione progetto e mood board
PPTX
Iot@fablabpisa
PPTX
Planet Mercury
PPTX
Landing on the Moon
PDF
Tutorial per 3D printing
PPT
23 novembre
PPS
Social Media Integration: Case history e Sguardi sul Futuro - Giuliano Ambros...
ODP
Liberta Digitali
PDF
Mobile Streaming Live + Brand Case Study #Periscope #Meerkat #FacebookMention
PDF
Le geometrie nascoste
PPTX
Instagram Assets Presentation
PDF
Digital Fabrication, IoT e Agile Business - Be@ctive - Provincia di Lodi
PDF
IBM Watson Analytics, Big Data & Internet of Things
PPT
The Art Of Colors
PPT
View in 3_d_asper_syllabus
PPT
Sfruttare il Potenziale Nativo di WordPress - WordCamp Bologna 2013
PDF
Workshop lezione_3_stand
PPTX
Brand Fan Page ABC
PDF
Internet of Things for Dummies
Mars
Decustruzione progetto e mood board
Iot@fablabpisa
Planet Mercury
Landing on the Moon
Tutorial per 3D printing
23 novembre
Social Media Integration: Case history e Sguardi sul Futuro - Giuliano Ambros...
Liberta Digitali
Mobile Streaming Live + Brand Case Study #Periscope #Meerkat #FacebookMention
Le geometrie nascoste
Instagram Assets Presentation
Digital Fabrication, IoT e Agile Business - Be@ctive - Provincia di Lodi
IBM Watson Analytics, Big Data & Internet of Things
The Art Of Colors
View in 3_d_asper_syllabus
Sfruttare il Potenziale Nativo di WordPress - WordCamp Bologna 2013
Workshop lezione_3_stand
Brand Fan Page ABC
Internet of Things for Dummies
Ad

Similar to Visual Design vs. Creatività (20)

PDF
USER EXPERIENCE & DINTORNI - Francesco Terzini
PDF
L'esperienza di progettare esperienze utente
PDF
Francesco Terzini - BTO Educational - User Experience Design - 31 maggio 2013
PDF
Dove l’utente è re
PPT
Arti e Culture Digitali, Lezione 2, Luca Simeone
PDF
User experience matters
PDF
lezione interaction design 18 marzo 2009
PDF
Dall'idea all'analisi: le fasi che precedono la progettazione esecutiva
PDF
HCI to UX to HCI - Parte A
PDF
Corso WebApp iOS - Lezione 03: Cognitive User Interface Design
PDF
Laboratori di Web Marketing e Interattività
PDF
UX design agile
PDF
Introduzione ux
PDF
Rapid Prototyping - Arte e artigianato
PDF
Be Wizard Academy - Usabilità per i siti web [Confcommercio Sede Nazionale]
PDF
Experience Matters!
PDF
Web Design ottimizzato per Contao CMS
PDF
Abitudinicreative designer
PDF
Editoria del design
PDF
Governare l'evoluzione del software analizzandone l'esperienza d'uso
USER EXPERIENCE & DINTORNI - Francesco Terzini
L'esperienza di progettare esperienze utente
Francesco Terzini - BTO Educational - User Experience Design - 31 maggio 2013
Dove l’utente è re
Arti e Culture Digitali, Lezione 2, Luca Simeone
User experience matters
lezione interaction design 18 marzo 2009
Dall'idea all'analisi: le fasi che precedono la progettazione esecutiva
HCI to UX to HCI - Parte A
Corso WebApp iOS - Lezione 03: Cognitive User Interface Design
Laboratori di Web Marketing e Interattività
UX design agile
Introduzione ux
Rapid Prototyping - Arte e artigianato
Be Wizard Academy - Usabilità per i siti web [Confcommercio Sede Nazionale]
Experience Matters!
Web Design ottimizzato per Contao CMS
Abitudinicreative designer
Editoria del design
Governare l'evoluzione del software analizzandone l'esperienza d'uso
Ad

More from Nicolò Volpato (7)

PDF
Una bussola per guidare un'innovazione responsabile
PDF
Design e futuro
PDF
Design Leadership Basics
PDF
Validating business ideas through design
PDF
TAG Master UI - Late Night Talk - September 20th, 2019
PDF
TAG Master UI - Late Night Talk - May 31st, 2019
PDF
TAG Innovation School Late Night Talk - March 1st, 2019
Una bussola per guidare un'innovazione responsabile
Design e futuro
Design Leadership Basics
Validating business ideas through design
TAG Master UI - Late Night Talk - September 20th, 2019
TAG Master UI - Late Night Talk - May 31st, 2019
TAG Innovation School Late Night Talk - March 1st, 2019

Visual Design vs. Creatività

  • 1. VISUAL DESIGN vs CREATIVITÀ
  • 3. Chi sono? Nicolò Volpato visual designer / UX designer presso GNV&Partners
  • 5. BETTER SOFTWARE needs BETTER DESIGN
  • 6. STARTUPS need BETTER DESIGN
  • 7. PEOPLE need BETTER DESIGN
  • 8. Lo stato delle cose Molti assunti sbagliati sul design, sul visual design in particolare
  • 9. Lo stato delle cose “Ci serve della creatività!”
  • 10. WTF?
  • 11. Agenzia creativa UX Dev
  • 12. Pitch! Agenzia creativa UX Dev
  • 13. Agenzia creativa Mockup Feedback Cliente
  • 14. Agenzia creativa Mockup Feedback Cliente = 2 MESI
  • 18. 1 BETTER DESIGN (e miglior cultura del design)
  • 19. “Abolire la parola creatività e promuovere processi user-centered.” — Alberto Mucignat, AgileUX Camp 2012
  • 20. Il visual design non è arte. E‘ metodologia, è ricerca continua, è esperienza.
  • 21. La creatività è sopravvalutata. Un buon design non è il prodotto di un’intuizione di un secondo. E’ frutto di un processo, è un ragionamento. Richiede tempo, richiede pratica. Il design è un mestiere.
  • 22. Perfe o non esiste. Il design è un processo che si svolge nel tempo. L’esito della progettazione cambia se cambiano gli utenti o i loro bisogni. Il design è iterativo, non fisso.
  • 24. Buono è abbastanza, per questa iterazione. Lavorare per iterazioni presuppone miglioramenti successivi e consegne a step. L’eccellenza si raggiunge per gradi, con l’esercizio.
  • 25. Pixel-perfect non esiste. Abbandoniamo i pitch con 3 proposte. Riduciamo il numero dei mockup in Photoshop. Spostiamoci verso processi di visual design più agili, device e resolution-independent. Design in the browser.
  • 26. La “coolness” non esiste. Non proponete ad un cliente un visual design perché è cool, di moda o perché segue i trend delle design galleries. E voi clienti, non chiedete un design uguale a quello che avete visto nelle design galleries.
  • 27. La “coolness” non esiste. Un visual design non va venduto al cliente. Va argomentato al cliente.
  • 28. Il visual design non é “making things pre y”. Come ogni linguaggio che trasmette un contenuto, interpreta il contenuto stesso. L’estetica non può essere slegata dal contenuto, deve essere conseguenza del contenuto.
  • 29. “Content precedes design. Design in the absence of content is not design, it’s decoration.” — Jeffrey Zeldman
  • 30. Il visual design non è designer-centered.
  • 31. Occorre umiltà Non avere fretta di prendere decisioni. La conoscenza del progetto aumenta nel tempo.
  • 32. “I’ve merely changed my responsibility from making choices to asking questions.” — Paul Soulellis
  • 33. Lo stile del designer non è rilevante. Sono il progetto, la tipologia di utenti, il contenuto a determinare lo stile ed il tono del visual design. Il risultato deve avere una propria personalità, non rispecchiare la personalità del designer.
  • 34. Occorre rimuovere l’ego dal processo.
  • 35. “Good design should not dominate. It should not dominate people, it should help people.” — Dieter Rams
  • 36. Il visual design non è solo esecuzione.
  • 37. “It’s not about asking How, but Why. It’s not about execution, it’s about the purpose of what we’re doing.” — Frank Chimero
  • 38. How Design Why
  • 39. Making Design Thinking
  • 40. How vs. Why Esecuzione vs. Obiettivi Decorazione vs. Significati
  • 41. How vs. Why Esecuzione vs. Obiettivi Decorazione vs. Significati
  • 42. Qualità dell’interfaccia ? Usabile Affidabile Funzionale
  • 43. Qualità dell’interfaccia Piacevole Usabile Affidabile Funzionale
  • 45. Il visual design è parte del processo di UX. Perché esternalizzarlo? Perché non è mansione del team di UX?
  • 46. Design e sviluppo sono aspe i dello stesso processo. Non sono separati.
  • 47. Design leads informs Dev — Aral Balkan, From The Front 2012
  • 48. Impa o del visual design Piacevole Usabile Affidabile Funzionale
  • 49. Può il visual design essere agile?
  • 50. Può il visual design essere agile? Sì.
  • 51. Può il visual design essere agile? Sì. – disegnare per iterazioni, non tutto upfront – “refactoring” continuo: occorre mettere in discussione le scelte, rivederle, migliorarle in modo continuo – coinvolgere il cliente ed educarlo a fornire feedback migliore
  • 52. Design vision UX UX UX Dev Visual Dev Visual Dev Visual
  • 53. Brand Personas Strategy Design vision Coerenza UX UX UX Dev Visual Dev Visual Dev Visual Miglioramenti Miglioramenti continui continui
  • 55. Occorre andare oltre il gusto personale.
  • 58. “Il «bello» è conseguenza del «giusto».” — Bruno Munari
  • 59. Discutere le motivazioni (Why). – designer: argomentare le scelte e le decisioni – cliente: chiedere e comprendere le ragioni alla base del design
  • 60. Due parametri da valutare con a enzione:
  • 62. 1 Adeguatezza Tono { Metafore Storie Emozioni
  • 63. 1 Adeguatezza Tono Registro Stile Linguaggio { Metafore Storie Emozioni Contesto
  • 64. 1 Adeguatezza Tono Registro Stile Linguaggio { Metafore Skeumorfismo Texture Storie Emozioni Contesto
  • 65. 1 Adeguatezza Tono Registro Stile Linguaggio { Metafore Skeumorfismo Texture Storie Narrazione Immagini/Foto Personaggi Emozioni Contesto Animazioni Transizioni
  • 66. 1 Adeguatezza Tono Registro Stile Linguaggio { Metafore Skeumorfismo Texture Storie Narrazione Immagini/Foto Personaggi Emozioni Personalità Anticipazione Sorpresa Contesto Animazioni Reward Transizioni
  • 68. 2 Coerenza { Design vision Miglioramenti continui Controlli a ritroso Umiltà
  • 69. “Not extraordinary design. Be er design.” — Dieter Rams