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

Visual Design vs. Creatività

  • 1.
    VISUAL DESIGN vs CREATIVITÀ
  • 2.
  • 3.
    Chi sono? Nicolò Volpato visual designer / UX designer presso GNV&Partners
  • 4.
  • 5.
    BETTER SOFTWARE needs BETTER DESIGN
  • 6.
    STARTUPS need BETTER DESIGN
  • 7.
    PEOPLE need BETTER DESIGN
  • 8.
    Lo stato dellecose Molti assunti sbagliati sul design, sul visual design in particolare
  • 9.
    Lo stato dellecose “Ci serve della creatività!”
  • 10.
  • 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
  • 15.
  • 16.
  • 17.
  • 18.
    1 BETTER DESIGN (e miglior cultura del design)
  • 19.
    “Abolire la parolacreatività e promuovere processi user-centered.” — Alberto Mucignat, AgileUX Camp 2012
  • 20.
    Il visual designnon è 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 nonesiste. 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.
  • 23.
  • 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. Abbandoniamoi 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” nonesiste. 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” nonesiste. Un visual design non va venduto al cliente. Va argomentato al cliente.
  • 28.
    Il visual designnon é “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. Designin the absence of content is not design, it’s decoration.” — Jeffrey Zeldman
  • 30.
    Il visual designnon è designer-centered.
  • 31.
    Occorre umiltà Non averefretta di prendere decisioni. La conoscenza del progetto aumenta nel tempo.
  • 32.
    “I’ve merely changedmy responsibility from making choices to asking questions.” — Paul Soulellis
  • 33.
    Lo stile deldesigner 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.
  • 35.
    “Good design shouldnot dominate. It should not dominate people, it should help people.” — Dieter Rams
  • 36.
    Il visual designnon è solo esecuzione.
  • 37.
    “It’s not aboutasking 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
  • 44.
  • 45.
    Il visual designè parte del processo di UX. Perché esternalizzarlo? Perché non è mansione del team di UX?
  • 46.
    Design e svilupposono aspe i dello stesso processo. Non sono separati.
  • 47.
    Design leads informs Dev — Aral Balkan, From The Front 2012
  • 48.
    Impa o delvisual design Piacevole Usabile Affidabile Funzionale
  • 49.
    Può il visualdesign essere agile?
  • 50.
    Può il visualdesign essere agile? Sì.
  • 51.
    Può il visualdesign 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
  • 54.
  • 55.
    Occorre andare oltreil gusto personale.
  • 56.
  • 57.
  • 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 davalutare con a enzione:
  • 61.
  • 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
  • 67.
  • 68.
    2 Coerenza { Design vision Miglioramenti continui Controlli a ritroso Umiltà
  • 69.
    “Not extraordinary design. Beer design.” — Dieter Rams
  • 70.
  • 71.