Progettazione web e semplicità: dieci regole per una creatività ragionata

Milano, 19-21 ottobre 2011 - Fieramilanocity

Progettazione web e semplicità
Dieci regole per una creatività ragionata
Può sembrare démodé impostare un ragionamento su una serie di regole o punti da rispettare. In 1
controtendenza questo workshop intende riproporre in chiave web, tra design e tecnologie, i 10 punti trattati
dal graphic designer John Maeda nel suo volume del 2006 "Le leggi della semplicità". Una progettazione
web di successo non può prescindere da strategie rigorose e allo stesso tempo creative, tali da condurre lo
sviluppatore in un percorso logico e ragionato. L'attuale abbondanza di risorse online scaricabili
gratuitamente o a bassissimo costo (come i temi di Wordpress) se da una parte ha favorito lo sviluppo di
progetti web meno caotici e più professionali rispetto al fai da te, ha contribuito dall'altra a rovesciare le fasi
del ragionamento: gli sviluppatori invece di mettere al centro le esigenze del cliente piegano queste ultime
alle caratteristiche del prodotto disponibile. Vedremo come nel mondo dell'abbondanza delle risorse
tecnologiche la sempliﬁcazione e la riduzione ragionata possano essere vincenti rispetto alla quantità.

Fabrizio Caccavello - International Webmasters Association (IWA/HWG) www.iwa.it
fabrizio@akebia.it - http://fabriziocaccavello.akebia.it
giovedì 27 ottobre 11

Progettazione web e semplicità.

About me
Fabrizio Caccavello
Web Project Manager e User Experience Designer.
Mi occupo di strategie di comunicazione online, e di sviluppo di
applicazioni web con particolare riferimento ai temi dell'accessibilità.

Cerco di applicare ai miei progetti processi di sempliﬁcazione e
riduzione in modo da renderli più efﬁcienti e semplici. 2

Sono amministratore e fondatore di Akebia
società di servizi per il web.

Sono membro del Consiglio Direttivo di IWA Italy.
Sono relatore di IWA/HWG ai workshop formativi di
SMAU.



Partecipazioni internazionali

IWA/HWG è un’Associazione professionale no profit riconosciuta
leader mondiale nella fornitura dei principi e delle certificazioni di
formazione per i professionisti della Rete Internet; è presente in 100
paesi, con 130 sedi ufficiali in rappresentanza di più di 165.000
associati.
La sua missione:
• Fornire programmi formativi di qualità;
• Fornire agli associati supporto e collaborazione a livello 3
Partecipazioni nazionali regionale, nazionale e internazionale, nonché un marchio di
affiliazione riconosciuto a livello mondiale;
• Promuovere i principi universali di etica e di pratica
professionale per tutti i professionisti della Rete Internet;
• Fornire supporto per la definizione e lo studio di normative
nei Paesi in cui è presente

Network:
http://www.iwa.it http://www.itlists.org http://
blog.iwa.it http://webaccessibile.org http://
skillprofiles.eu



Perché IWA?
• Fare rete tra professionisti
– Scambiarsi informazioni / esperienze
– Condividere buone pratiche di lavoro
• Apprendere
– Consultare documentazione condivisa 4

– Discutere con gli altri soci
– Partecipare ad eventi formativi / informativi
• Divulgare
– Effetto “ebola”: condividere la conoscenza
– Proporsi come discenti per seminari e corsi



5

Fabrizio Caccavello
fabrizio.caccavello@akebia.it
http://fabriziocaccavello.akebia.it


la semplicità non è banale



Il web in
una forma
complessa

7

Yahoo nel 2001



8

Il web in una forma complessa

il motore di ricerca Arianna nel 2001



Semplificazione:
aumento
dell’efficienza e
della complessità
“invisibile”
9

Google nel 2001



creativo
VS
10
tecnico

E’ uno scontro che non ha senso



11

IWA Italy Web Skills Proﬁles



The Laws of Simplicity
http://lawsofsimplicity.com/
John Maeda

12
Le Leggi della Semplicità
2006 Bruno Mondadori

Ripercorriamo le dieci considerazioni del libro (leggi)
in chiave internet (siti e web application)


Laws of Simplicity

1
John Maeda

RIDURRE
Il modo più semplice per conseguire la semplicità è attraverso una riduzione ragionata

‣ nr. di menù
‣ colonne di layout Cerchiamo di partire bene: ridurre non
‣ funzionalità non necessarie significa diminuire le dimensioni del testo

‣ animazioni

13

NON SI DIMOSTRANO EFFICIENZA E POTENZIALITA’ METTENDO TUTTO IN HOMEPAGE
se possibile preferire il layout di destra a quello di sinistra


Laws of Simplicity

2
John Maeda

ORGANIZZA
L’organizzazione fa si che un sistema composto da molti elementi appaia costituito da pochi

Da tempo si usano menù a tendina, accordion, menù su più livelli

14


Laws of Simplicity

2
John Maeda

ORGANIZZA

Organizzare il contenuto

‣ L’origine dell’universo ma non sempre una
‣ Le galassie corretta
‣ Galassie a spirale organizzazione
corrisponde a una
‣ Andromeda semplificazione del
15

‣ La Via Lattea contenuto
‣ Il sistema solare
‣ I pianeti non gassosi
‣ Mercurio, Venere, Terra, Marte in questo esempio
‣ Pianeti gassosi quasi si perde il livello
‣ Galassie a sombrero di annidamento dei
contenuti
‣ Lo spazio intergalattico
‣ L’evoluzione


Laws of Simplicity

2
John Maeda

ORGANIZZA

Organizzare il contenuto è complicato, aiutiamoci con le tag (etichette)

Tag clouds
per organizzare i
contenuti 16

avete mai cliccato?
raramente, immagino

tag clouds di Punto Informatico


Laws of Simplicity

2
John Maeda

ORGANIZZA

Organizzare il contenuto è complicato, aiutiamoci con le tag (etichette)

Tag clouds
per organizzare i 17
contenuti

LE TAG SONO
UTILIZZATE PER
COSTRUIRE IL MENU
PRINCIPALE


Laws of Simplicity

3
John Maeda

TEMPO
i risparmi di tempo somigliano alla semplicità

Tutti i browser
puntano sulla
velocità.

Aiutiamoli !

18

Analizzare con Firebug il
caricamento della pagina


Laws of Simplicity

4
John Maeda

IMPARA
la conoscenza rende tutto più semplice

Esigenze ed
attese del
Normative e linee guida cliente

Risorse disponibili 19

Esperienze

mushup consapevole

TUTTO CIÒ CHE C’È, C’È GIÀ


Laws of Simplicity

5
John Maeda

DIFFERENZE
la semplicità e la complessità sono necessarie l’una all’altra

20

semplicità e complessità non hanno confini netti
è evidente che Google appare più semplice di Yahoo
ma visto nelle sue specificità Yahoo non è complesso

Laws of Simplicity

6
John Maeda

CONTESTO
ciò che sta alla periferia della semplicità non è assolutamente periferico

punti di riferimento e spazi

l’utente
saprà capire siete qui: percorso > contenuto
21
dove si
trova? è un menù
contenuto contenuto contenuto contenuto
contenuto contenuto contenuto contenuto ❖ menu 1 contestuale,
contenuto contenuto contenuto contenuto ❖ menu 2 riferito alla
contenuto contenuto contenuto
❖ menu 3 pagina?


Laws of Simplicity

6
John Maeda

CONTESTO
ciò che sta alla periferia della semplicità non è assolutamente periferico

punti di riferimento e spazi

Questa versione
di lightbox ha
una indicazione
per chiudere
l’effetto, 22
comandi da
tastiera, chiare
indicazioni per
sfogliare.


Laws of Simplicity

7
John Maeda

EMOZIONI
meglio emozioni in più piuttosto che in meno

X
la solita
visione,
emozionante
ma prevedibile

23

ok
se fossi un
pittore vorrei
starci in questo
posto


Laws of Simplicity

8
John Maeda

FIDUCIA
noi crediamo nella semplicità

la fiducia è una filiera

utente si fida progetto online
24

committente del progetto si fida web agency

web agency si fida tecnologie utilizzate


Laws of Simplicity

8
John Maeda

FIDUCIA

basta pochissimo per perdere la fiducia

jquery funziona!
web agency fiducia garantisce massimo “progressive enancement”
un menù si apre sempre, anche con browser vecchissimi 25

basterebbe una sola incompatibilità
per far perdere la fiducia


Laws of Simplicity

8
John Maeda

FIDUCIA

basta pochissimo per perdere la fiducia

è un messaggio chiaro 26
che dà fiducia?

fiducia utente


Laws of Simplicity

9
John Maeda

FALLIMENTO
ci sono cose che non è possibile semplificare

ci sono cose che non si possono semplificare
e che non conviene semplificare

27

vi siete mai chiesti perché i layout dei giornali online si assomigliano tutti?


Laws of Simplicity

10
John Maeda

L’UNICA

semplificare significa
sottrarre l’ovvio e aggiungere il significativo

Il progetto che state presentando al cliente è 28
web agency
veramente adattato alle sue esigenze?

azienda
Il progetto che state valutando è veramente
adattato alle vostre esigenze?


Laws of Simplicity

10
John Maeda

L’UNICA

semplificare significa
sottrarre l’ovvio e aggiungere il significativo

IL CODICE E’ POESIA
29



Il bello del mostro

30



Il bello del mostro

WordPress è forse il migliore e 31
più diffuso CMS

Esistono migliaia di temi
(template) che si possono
utilizzare



Il bello del mostro

Bellissimo tema
ma siamo sicuri
che è adatto alle
esigenze del
progetto che
stiamo studiando? 32

E’ stata fatta
un’analisi simile al
percorso che
abbiamo fatto fino
a qui?



Il bello del mostro

per le aziende

se vi stanno
proponendo un
progetto che vi
sembra 33
sottocosto, siete
sicuri che non vi
stiano
prospettando
una soluzione
quasi casuale?



Dieci cose a cui pensare per non progettare a caso

1 RIDURRE
non abbiamo solo la homepage 6 ORIENTAMENTO
le briciole di pane sono essenziali

EMOZIONI
2 ORGANIZZA
archivia i contenuti seguendo una logica 7 gli utenti vogliono vivere il web

34
3 VELOCITÀ
avete mai navigato in mobilità? 8 FIDUCIA
è una filiera che non si può spezzare

RIUTILIZZA GLI ALTRI
4 copia e incolla responsabilmente 9 raramente sbagliano

5 DIFFERENZE
sottrarsi dal paragone 10 IL CODICE È POESIA



GRAZIE
35

join the conversation
http://twitter.com/cfabry


Progettazione web e semplicità: dieci regole per una creatività ragionata

Recommended

Recommended

More Related Content

Viewers also liked

Viewers also liked (12)

Similar to Progettazione web e semplicità: dieci regole per una creatività ragionata

Similar to Progettazione web e semplicità: dieci regole per una creatività ragionata (20)

More from Fabrizio Caccavello

More from Fabrizio Caccavello (18)

Progettazione web e semplicità: dieci regole per una creatività ragionata