1. Web design for kids
Principi di web design applicati
all’universo bambino
[<a href=“#”>]

2. [1]
Per cominciare

3. progettare web per bambini…
Disegnare e progettare web per i bambini rappresenta una sfida complessa e delicata, perché è
necessario confrontarsi con un’utenza che cambia in modo radicale nell’arco dei primi anni di vita,
attraverso una crescita fisica e una maturazione cognitiva e sociale
Lo sviluppo infatti, è determinato da queste tre
dimensioni che maturando contemporaneamente
portano alla crescita completa del
soggetto e a loro volta mutano anche il rapporto che
essi hanno con il web
*Cosa accade quando i bambini usano il web?
*Perché alcune scelte risultano più efficaci di
altre in fatto di progettazione di ambienti
ipermediali usabili ed ergonomici a misura di
bambino?

4. progettare web per bambini…
la creazione di ambienti in cui è possibile
apprendere facendo la visualizzare e
l’apprendimento di concetti complessi.
I bambini hanno grande capacità di cogliere i significati attraverso
codici sonori e iconici pur non padroneggiando ancora il
linguaggio e avendo un minimo bagaglio di esperienze.
Ascoltare e interagire in un ambiente caratterizzato da una molteplicità di sistemi di simboli e codici
comunicativi, rappresenta la modalità per eccellenza dell’immersione: il bambino si muove in una
logica di contaminazioni, rimandi, incroci.
La preferenza che i bambini hanno verso la
dimensione multimediale, rispetto al
monomediale, può dipendere dal maggiore
coinvolgimento sensoriale possibile. Questi
ambienti infatti, operano per immersione
determinando un rapporto di complicità

5. Molte delle scelte compiute nella
realizzazione di ambienti rivolti a minori
non ancora in grado di leggere,
rappresentano un utile suggerimento
per la progettazione di ambienti
basati su stimoli alternativi a quelli
offerti dal testo.
Fattori umani quali la percezione, l’attenzione, la memoria e lo sviluppo
mentale, intervengono nell’interpretazione degli ambienti e più
specificatamente delle interfacce con cui i bambini interagiscono
Fattori tecnologici (disegno dell’interfaccia, uso di immagini chiare e
comprensibili, colori e modalità di interazione) possono, invece, influenzare
positivamente o negativamente, questa comprensione.

6. [2]
Bambini si, ma quanti anni hanno?

7. Per compiere questa distinzione è
possibile prendere spunto dal lavoro già
compiuto da Piaget individuando quattro
momenti importanti ai quali si rifanno
diverse fasce d’età e dunque competenze
differenti :
0 – 2 anni
3 – 5 anni
6 – 10 anni
11 – 14 anni
Le conoscenze sullo sviluppo mentale del bambino e le
ricerche in merito al rapporto tra minori e uso delle tecnologie
possono aiutare a comprendere le potenzialità degli strumenti
multimediali.

8. 0-2
anni
un’intelligenza pratica,
manipolazione degli oggetti e sulla prima
conoscenza del mondo esterno.
Raccolta stimoli esterni
3-5
anni
Consapevolezza del il linguaggio,
memorizzazione delle esperienze.
Il gioco diventa la modalità principale di
divertimento prima capacità di astrazione
L’utente web comincia a prendere forma.
Possibile cliccare su obiettivi specifici,
L’uso della tastiera resta ancora limitato
6-10
anni
Si compie completamente la distinzione
tra realtà e fantasia.
Le attività devono presentare un certo grado di
complessità, lasciando spazio allo sviluppo e
all’espansione dell’attività e del pensiero.
La preferenza che i bambini hanno verso la dimensione è
legata maggiore coinvolgimento sensoriale possibile. Questi
ambienti infatti, operano per immersione determinando un
rapporto di complicità

9. L’apprendimento dipende dalla
capacità percettiva dei sensi.
Avviene la conquista di tutto
l’universo pratico
I bambini sviluppano fino ai due
anni un’intelligenza pratica, basata
sulla manipolazione degli oggetti e
sulla prima conoscenza del mondo
esterno.
È evidente come sia difficile pensare ad un soggetto in grado di manipolare gli strumenti che
appartengono al web non solo da un punto di vista cognitivo ma anche fisico;
Eppure…
Esistono dei sistemi off-line sviluppati per bambini di età compresa tra i 9 e i 36 mesi concepiti
affinché il bambino possa semplicemente cliccare su degli oggetti a caso attivando animazioni e
meccanismi prefissati.
Non si interagisce ancora secondo obiettivi specifici
www.knowledgeadventure.com
0-2
anni
un’intelligenza pratica
manipolazione degli oggetti e sulla prima
conoscenza del mondo esterno.
Raccolta stimoli esterni

10. da dove cominciare…
Si tratta perlopiù di ambienti in cui vengono riprodotti mondi
animati che funzionano in modo semi-autonomo, dove il
movimento del mouse è accentuato da un cursore animato che
diventa ancora più evidente sulle parti attive della scena.
Le animazioni sono semi-autonome, i bambini aggiungono suoni
supplementari e lievi variazioni,
Tutto correlato da audio che fornisce istruzioni
Molti di questi dispositivi sono sviluppati secondo intuizioni e stereotipi
adulti in assenza di una verbalizzazione efficace
e il pensiero in senso stretto, è impossibile intraprendere una
discussione e un’interrogazione dei bambini in merito.
Di fronte ad una limitata possibilità di interazione del bambino, risultano funzionali sistemi
all’interno dei quali vengano garantiti meccanismi semi-autonomi, capaci di generare il giusto
feed-back.
0-2
anni
un’intelligenza pratica,
manipolazione degli oggetti e sulla prima
conoscenza del mondo esterno.
Raccolta stimoli esterni
www.knowledgeadventure.com

11. 3-5
anni
Consapevolezza del il linguaggio, memorizzazione delle esperienze.
Il gioco diventa la modalità principale di divertimento prima capacità di astrazione
L’utente web comincia a prendere forma. Possibile cliccare su obiettivi
specifici, L’uso della tastiera resta ancora limitato
Per questa fascia i mutamenti risultano forti e rapidi.
Fa la sua comparsa il linguaggio, rendendo possibile la verbalizzazione di tutte le azioni, il ricordo e la
memorizzazione delle esperienze.
Si sviluppa il pensiero in senso stretto, un pensiero di tipo egocentrico, in cui il gioco diventa la
modalità principale di divertimento: ai bambini piace immergersi in giochi in cui vengano simulate
realtà che vadano a soddisfare i loro desideri metafore
L’utente web comincia a prendere forma.
Diventa possibile cliccare su obiettivi specifici, mentre al contrario l’uso della tastiera resta ancora
limitato;

12. da dove cominciare…
I bambini sono incuriositi da interfacce che invitavano
ad entrare in dimensioni nuove.
La metafora di navigazione è molto importante!
3-5
anni
Consapevolezza del il linguaggio, memorizzazione delle esperienze.
Il gioco diventa la modalità principale di divertimento prima capacità di astrazione
L’utente web comincia a prendere forma. Possibile cliccare su obiettivi
specifici, l’uso della tastiera resta ancora limitato

13. 6-10
anni
Si compie completamente la distinzione tra realtà e fantasia.
Le attività devono presentare un certo grado di complessità; lasciare spazio allo sviluppo e
all’espansione dell’attività e del pensiero.
Sono abbastanza grandi per usare sistemi più sofisticati,
ma apprezzando ancora un approccio divertente.
Integrano abilità motorie e percettive e si compie completamente la distinzione tra realtà e fantasia. Le
attività devono essere interessanti, grado di complessità, curiosità
Le istruzioni devono essere presenti in una configurazione adatta, facili da comprendere e da
ricordare, gli elementi on-screen d’appoggio piuttosto che di distrazione.
Importantissimo diventa il fattore lettura: interviene una nuova fonte di
contenuto che allarga le possibilità di navigazione. I bambini cominciano a gradire molto, specie se la
grafica è ricca, la presenza di una mappa e la possibilità di avere sempre a portata, delle istruzioni da
consultare ogni qualvolta si ritenga necessario.
Circa il 50% dei bambini legge le istruzioni per comprendere con esattezza le operazioni da poter
compiere, cosa che comunemente gli adulti non facevano.
Gilutz, S. & Nielsen, J. "Usability of Web-sites for Children: 70 Design Guidelines", Fremont, CA:Nielsen Norman Group. (2002).

14. differenze di genere…
Le necessità e gli interessi sono simili e allo stesso modo, gli ambienti vengono
disegnati cercando strade in cui la distinzione e la connotazione di genere non venga
chiamata in causa. Inoltre la realizzazione di ambienti rappresentanti mondi
fantastici, si addice sia alle bambine che ai bambini.
Con lo sviluppo gli interessi cambiano, perciò già
verso i 7 - 8 anni le connotazioni e le scelte sono maggiormente indirizzate verso temi peculiari.
Le bambine usano internet per scopi educativi mentre i bambini ne sfruttano principalmente
gli aspetti ricreativi.
Le bambine usano la tecnologia per creare ed esprimersi, al contrario i maschi usano
internet primariamente per il divertimento.
I giochi ne rappresentano l’attività primaria che da la possibilità di sfidarsi, di competere e
dunque di offrire stimolazione e ricompensa. Un aspetto da rilevare è che i maschi
manifestano una maggiore autonomia e sicurezza davanti ad un PC, rispetto alle
proprie coetanee che invece sembrano essere meno interessate e chiedono espressamente
la presenza e l’aiuto da parte di un adulto durante la navigazione.
Differenze di genere

15. [3]
Esistono importanti facoltà intellettive
umane non verbali, grazie alle quali colori,
suoni e altre sensazioni, sperimentate fin
dai primi anni di vita rappresentano la base
di quotidiane esperienze di conoscenza e di
apprendimento. La capacità di “pensare
per immagini”, definita “Intelligenza
Visiva”, è una di queste abilità cognitive...
Ian Robertson

16. I bambini imparano e conoscono il mondo attraverso immagini colori, ritratti, disegni.
«sotto certi aspetti, il pensiero è ciò che possono percepire» .
Il concetto di pensiero visivo nega la separazione tra il vedere e il pensare
considerando la percezione come il superamento del semplice guardare:
interpretazione attiva di quello che viene osservato.
• La visione è selettiva
• Le forme sono concetti
[visual thinking]
Ian Robertson, autore del testo Intelligenza visiva, ritiene che i bambini
possiedono la capacità di elaborare immagini eidetiche fino all’età di
nove - dieci anni.
Fino a quel momento infatti, esiste ancora un libero accesso al pensare
visivo di competenza dell’emisfero destro che, con il tempo verrà sommersa
dell’attività dell’emisfero sinistro, responsabile del linguaggio parlato.

17. Quando un bambino interagisce per la prima volta con ambienti non conosciuti, mantiene un livello
di attenzione estremamente alto su tutti gli impulsi prodotti dall'interfaccia. Non appena individuati
quelli rilevanti, si concentrerà soltanto su ciò che considera nuova informazione.
Più alto è il livello di apprendibilità dell'interfaccia (learnability), più rapidamente si verificherà la
comprensione, impiegando soglie di attenzione più basse per semplici comandi procedurali e più
alte per elementi dedicati alla trasmissione di contenuti.
Il cervello umano reagisce rapidamente a determinati stimoli in base all'attivazione di
pattern, di configurazioni che ne agevolano il riconoscimento e l’interiorizzazione.
Ciò permette:
• la familiarizzazione con l’interfaccia
• Lo sviluppo di processi automatici che non richiedono alti livelli di attenzione
I bambini vogliono essere guidati dall’interfaccia attraverso feed-back che diano conferma
del buon esito dell’interazione. Se il contesto non è sufficiente a concedere queste
risposte, il bambino si vedrà costretto a uno sforzo di maggiore attenzione per
riprendere il controllo cosciente del processo.
[percezione/attenzione/interfacce]

18. La percezione è un’operazione mentale estremamente complessa, che si basa
sull’interpretazione delle informazioni sensoriali, prodotte attraverso la conoscenza, le
esperienze passate e i processi innati.
È un processo fondamentale per cogliere le informazioni che vengono presentate attraverso
l’interfaccia e dunque poter interagire con un pc.
ergonomia cognitiva
L'ergonomia cognitiva studia le
interazioni uomo-macchina
in cui entrano in gioco fattori cognitivi ed emotivi, legati alla
percezione, al gradimento, alla memorizzazione
dell’interfaccia e che influiscono sull'esperienza che l’utente
ha durante l’interazione.
[percezione/attenzione/interfacce]

19. L’analisi di principi di ergonomia cognitiva proposti da Donald Norman e da
altri autori è mirata a rivelare come il successo o l’insuccesso di attività
basate su tecnologie di uso quotidiano (elettrodomestici, siti web, telefoni
cellulari, etc…) sia spesso il
frutto di un “buono” o di un “cattivo” design,
più che l’espressione di abilità od incapacità da parte dell’utilizzatore.
Questa riflessione mette in luce come un elemento essenziale per il “buon”
design sia l’attenzione verso i processi di elaborazione delle informazioni da
parte della mente, ma anche verso il modo in cui le attività umane nascono
e si sviluppano in interazione con gli strumenti.
[ergonomia cognitiva]

20. «L’affordance dà forti suggerimenti per il funzionamento delle cose. Una piastra
liscia è fatta per spingere. Manopole e maniglie sono da girare. Le fessure sono
fatte apposta per infilarci dentro qualcosa. Una palla è da lanciare o da far
rimbalzare. Quando questi inviti all’uso sono opportunamente sfruttati , basta
guardare per sapere che cosa si deve fare, senza bisogno di figure, etichette o
istruzioni. Le cose complesse possono richiedere spiegazioni, ma quelle semplici
non dovrebbero averne bisogno. Quando una cosa semplice esige figure, scritte o
istruzioni, vuol dire che il design è sbagliato (…) »*
Capacità di cogliere le proprietà reali percepite delle cose. Tali proprietà sono
quelle che suggeriscono all’individuo il possibile utilizzo di un oggetto o di un
materiale in questione.
* Norman D., La caffettiera del masochista, The Psychology of Everyday Things. Giunti, Firenze, 1997
[ergonomia cognitiva]

21. Tutte le parti funzionali devono essere visibili e
devono fornire il messaggio corretto su quello
che si può fare
Le relazioni tra ciò che vogliamo fare e le parti dell’oggetto
su cui agire devono essere evidenti.
Il numero delle funzioni disponibili
non deve superare eccessivamente il numero
dei comandi utilizzabili
Per utilizzare un artefatto abbiamo bisogno di capire quali sono le sue parti funzionali e quali sono
le azioni disponibili. Distinzione importante:
artefatti superficiali (quello che si vede è tutto ciò che esiste)
artefatti interni (una parte dell’informazione celata nell’artefatto).
Esempio di artefatto superficiale: le maniglie. Dalla forma esterna si vede come vanno usate (una
va tirata, l’altra va fatta scorrere).
[ergonomia cognitiva]

22. [4]
Son Braccio di ferro….

23. In modo particolare Berkovitz e Strommen mettono in
evidenza, come i bambini manifestino difficoltà nella
selezione degli oggetti sullo schermo attraverso un sistema
marquee type
Le prestazioni dei bambini, con mouse ed altri dispositivi input,
non sempre risultano brillanti, soprattutto in relazione al tipo di
interazione che l’interfaccia richiede. I bambini sembrano avere le
principali difficoltà nel tenere premuto il mouse per un periodo
superiore al semplice click o nei casi in cui è necessario l’uso del
double click.
[destrezza]

24. I sistemi point and click sono più veloci e di maggiore gradimento.
I sistemi drag and drop sono meno graditi. Il grado di errore è maggiore e genera
frustrazione in chi interagisce. Questa modalità risulta di più facile utilizzo per quei
bambini che hanno una certa familiarità con l’uso del mouse.
Con il point and click si compiono due operazioni distinte.
Nel drag and drop si compie una sola operazione L’utente ha la
possibilità di trascinare gli oggetti sul monitor, rinforzando la
connessione concettuale con l’operazione da compiere.
L’aspetto negativo sta nel fatto che questa
modalità, più difficile da gestire e fonte di
un maggior numero di errori. Nonostante
ciò, molti ambienti costruiti per bambini,
vengono tuttora realizzati con un
sistema drag and drop.
Gli studi di
Kori Inkpen
[destrezza]

25. Gli studi di Kori Inkpen
Nell’ambito degli studi sulla destrezza, Kori Inkpen*,
ha analizzato l’efficacia di due diverse modalità di
interazione: point and click e il drag and drop.
La Inkpen scelse di somministrare due diverse
versioni di uno stesso ambiente variando il tipo di
interazione permessa. I bambini dovevano spostare
un elemento (box verde), dalla posizione in cui si
trovava ad un’altra (box evidenziato da un
contorno rosso).
La prova prevedeva sedici operazioni complessive di
questo tipo completate mediamente in venti minuti.
Per questa ricerca la Inkpen scelse un campione di
minori di età compresa tra i 9 e i 13 anni.
Su un campione di 67 bambini,
il 53% trova il sistema point and click più semplice
il 37% si lamenta della stanchezza che il drag and drop provoca alla mano.
Le preferenze verso il drag and drop, arrivavano da coloro che hanno maggiore familiarità
con il mouse.
[destrezza]

26. [destrezza]
Errori frequenti con differenti sistemi input

27. [5]
L'arte è ricerca continua, assimilazione
delle esperienze passate, aggiunta di
esperienze nuove, nelle forma, nel
contenuto, nella materia, nella tecnica, nei
mezzi.

28. Giallo: È il colore dell’allegria, esprime gioia e allontanamento dai problemi. Trasmette una sensazione di benessere,
liberazione dai problemi.
Blu: È il colore della quiete, di fronte a questo i bambini tendono a sospendere le difese a livello nervoso.
Rosso: È il colore dello slancio e della forza, capace di stimolare le abilità creative e di trasmette calore e sicurezza a
chi lo guarda.
Arancione: È un’esaltazione del giallo, ne
accentua i pregi ed esprime espansività e
comunicabilità.
Verde: È il colore dell’impegno, della
sopportabilità, della tenacia.
• Segmentare
• Orientare a un compito
• Raggruppare
• Evidenziare
Le funzioni del colore
Colori Primari
Massima tensione percettiva
[I colori]
Temi visuali

29. impiegare piccoli spazi
• essere riconosciute rapidamente
• essere facilmente ricordate
• rendere l’interfaccia universale
Rappresentative: forchetta è coltello
sono rappresentativi del concetto che si
intende esprimere: un luogo in cui è
possibile mangiare
Astratte: il bicchiere con una frattura
intende rappresentare l’idea di fragilità:
si tratta dunque di un’icona in cui si
intende esprimere un concetto con un
alto livello di astrazione rispetto
all’oggetto rappresentato.
Arbitrarie: non esiste relazione tra il
concetto espresso e l’immagine
rappresentata.
[Ie icone]

30. Agli occhi dei bambini le forme quadrate e rettangolari sono simbolo di ordine e razionalità.
Quelle circolari sono sinonimo di distensione. Ecco perché spesso anche se vengono scelte forme
quadrate o rettangolari, i loro spigoli sono sostituiti da contorni morbidi, meno accentuati, capaci di
generare una sensazione di tranquillità e di apertura.
Ogni sezione o argomento viene contraddistinto e
identificato da colori e icone rappresentative, che
permettono al bambino di compiere un’associazione tema/
colore/ immagine e quindi, ricordare più facilmente
l’allocazione delle informazioni.
Anche le forme trasmettono
significati e valori siano esse
semplici o complesse.
[Ie forme]

31. /metafora
Fare uso di una metafora, permette di fornire una
cornice unificata che induca a percepire un progetto
come un tutto unico. Un contenitore all’interno del
quale la navigazione risulti naturale e segua le
dinamiche della metafora scelta.
i bambini che non possiedono ancora
conoscenza della simbologia
convenzionale o dei comandi procedurali
(che per gli adulti sono invece intuitivi)
riescono a fare affidamento sulle sole
conoscenze che possiedono, quelle
relative alla realtà che li circonda.
ciò è ancora più centrale per i bambini che
non sanno leggere, dove la metafora è il
principale significato che sono in grado di
cogliere.
[Ie metafore]

32. [</end>]