World Information Architecture Day WIAD Trento, 24 febbraio 2018

1. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD | @extrasmallit
Università di Milano-Bicocca

2. Architettura dell’Informazione

3. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 3 44
Beyond Graphics:
the Architecture of Information
—Richard S. Wurman, 1976

4. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 4 44
Analisi ()
> Incontri di brief tecnico, strategico, di business/marketing, di
branding con il cliente e raccolta materiali
> Analisi delle strategie di web marketing e obiettivi di progetto
> Analisi della concorrenza o benchmarking
> Analisi del target e dell’utenza
> Analisi delle piattafome tecnologiche

5. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 5 44
Location
Alphabet
Time
Category
Hierarchy
5 criteri per organizzare
il mondo

6. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 6 44
Analisi ()
> Incontri di brief tecnico, strategico, di business/marketing, di
branding con il cliente e raccolta materiali
> Analisi delle strategie di web marketing e obiettivi di progetto
> Analisi della concorrenza o benchmarking
> Analisi del target e dell’utenza
> Analisi delle piattafome tecnologiche

7. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 7 44
Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca
Ordine alfabetico?
Catalogo IKEA, 2016

8. Architettura dell’informazione
per il web

9. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 9 44
Learn how to merge aesthetics
and mechanics to design Web
sites that “work”[...] building
complex sites, hierarchy design
and organization, and techniques
to make your site easier to search.
—P. Morville & L. Rosenfeld, 1998

10. Architettura dell’Interfaccia

11. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 11 44
The Skeleton The elements of User Experience (book)
Jessy James Garrett, 2000

12. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 12 44
Architettura dell’interfaccia
The elements of User Experience (slide)
Jessy James Garrett, 2000

13. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 13 44
Look & feel

14. La griglia

15. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 15 44
La griglia
La griglia è il sistema che posiziona e dispone gli elementi
– immagini, testi, titoli, paratesti, marginature – nella
pagina cioè definisce l’organizzazione logico-spaziale delle
informazioni garantendo il senso semiotico e narrativo:
> Ordine, coerenza e differenza
> Ritmo, armonia equilibrio
> Modularità e flessibilità
> Riconoscibile e memorizzabile

16. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 16 44
The Vignelli
Canon
Massimo Vignelli
2009

17. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 17 44
The Vignelli
Canon
Massimo Vignelli
2009

18. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 18 44

19. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 19 44
Griglia digitale a 12 colonne
Bootstrap

20. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 20 44
Responsive lay-out

21. I principi della
Gestal Psychologie

22. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 22 44
Der Zusammenschluss erfolgt
derart, dass die entstehenden
Ganzen in irgendeiner Weise vor
anderen denkbaren Einteilungen
gestaltlich ausgezeichnet sind.
—K. Koffka, 1935

23. Principi visivi
23 30
Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca
Il triangolo
di Kanizsa
Gaetano Kanizsa
1955

24. Basic design

25. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 25 44
IA e linguaggio visivo
> Forma
> Colore
> Tratto e texture
> Dimensione
> Spazio
> Contrasto
> Tipografia
> Immagini
> Relazioni
> Contesto

26. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 26 44
Prossimità
> Unitarietà di elementi separati
> Raggruppamento e relazione
> Progressione logica
> Organizzare

27. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 27 44
Analisi ()
> Incontri di brief tecnico, strategico, di business/marketing, di
branding con il cliente e raccolta materiali
> Analisi delle strategie di web marketing e obiettivi di progetto
> Analisi della concorrenza o benchmarking
> Analisi del target e dell’utenza
> Analisi delle piattafome tecnologiche

28. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 28 44
Allineamento
> Connessione visiva tra elementi distanti
> Interrelazione
> Organizzazione logica
> Unificare

29. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 29 44

30. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 30 44

31. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 31 44
Ripetizione
> Coerenza
> Gerarchia
> Ritmo
> Rafforzare

32. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 32 44

33. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 33 44
Teatro del Falcone
A G Fronzoni, 1979

34. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 34 44
Contrasto
> Differenza
> Focus
> Enfasi e forza
> Diversificare

35. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 35 44
Analisi ()
> Incontri di brief tecnico, strategico, di business/marketing, di
branding con il cliente e raccolta materiali
> Analisi delle strategie di web marketing e obiettivi di progetto
> Analisi della concorrenza o benchmarking
> Analisi del target e dell’utenza
> Analisi delle piattafome tecnologiche
35 30
Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca

36. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 36 44
Analisi ()
> Incontri di brief tecnico, strategico, di business/marketing, di
branding con il cliente e raccolta materiali
> Analisi delle strategie di web marketing e obiettivi di progetto
> Analisi della concorrenza o benchmarking
> Analisi del target e dell’utenza
> Analisi delle piattafome tecnologiche
La Rinascente
Max Huber, 1950

37. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 37 44
Lo spazio negativo
> Rapporto gestaltico tra figura e sfondo
> Looking o Lead room fotografico: rapporto tra posizione del
soggeto e lo spazio/direzione dello sguardo/movimento

38. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 38 44
Analisi ()
> Incontri di brief tecnico, strategico, di business/marketing, di
branding con il cliente e raccolta materiali
> Analisi delle strategie di web marketing e obiettivi di progetto
> Analisi della concorrenza o benchmarking
> Analisi del target e dell’utenza
> Analisi delle piattafome tecnologiche

39. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 39 44
Looking-room

40. Micro-architettura

41. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 41 44
Spazio orizzontale

42. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 42 44

43. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 43 44

44. Senza le basi, dimenticatevi le altezze
Letizia Bollini, PhD - Department of Psychology, University of Milano Bicocca 44 44
Darkpattern

45. v
?

47. Letizia Bollini, PhD
Department of Psychology, University of Milano-Bicocca
letizia.bollini@unimib.it
www.lbollini.it
@extrasmallit
Coming soon: www.progetto-amnesia.it