Progetto di Comunicazione Visiva e Design delle Interfacce. A cura di Giulia Camedda, Roberta Gionni, Antonio Santoro. Prof. Letizia Bollini

1. UNIVERSITA’ DEGLI STUDI MILANO - BICOCCA
TEORIA E TECNOLOGIA DELLA COMUNICAZIONE
A.A. 2013 /2014
LABORATORIO DI COMUNICAZIONE VISIVA E DESIGN DELLE INTERFACCE
III CONSEGNA_Frontend Development
Gruppo 9_Giulia Camedda, Roberta Gionni, Antonio Santoro

2. L’INDIVIDUO NEL QUARTIERE
Abbiamo scelto il nome “Bicoccaqui”
per evidenziare il fatto che l’individuo si
trovasse all’interno del quartiere, l’idea
era quella di far quasi identificare l’u-
tente con il pin geolocalizzatore, come
se lo rappresentasse e lo guidasse
nella scoperta del quartiere Bicocca.

3. IL QUARTIERE / BICOCCA

4. INDIVIDUO / QUARTIERE
L’individuo, attraver-
so la sua interazione
all’interno del quartie-
re Bicocca, lo colora
e gli fa prendere vita.
Quest’immagine è usa-
ta come sfondo delle
pagine interne del no-
stro sito sia nella ver-
sione desktop che nel
tablet e nel mobile.

5. COLORI
LOGO
Per il nostro logo “Biccoccaqui” e per la no-
stra homepage abbiamo scelto di utilizza-
re un colore che fosse piuttosto neutro. Ab-
biamo optato per un colore tra il nero e il
grigio, infatti il nero ci sembrava troppo “mar-
cato” per essere messo nell’homepage.
ALTRI COLORI
Gli altri colori utilizzati all’interno del nostro pro-
getto sono colori vivaci, che caratterizzano for-
temente le tribù analizzate.
R=74 G=66 B=77
#4a424d
ROSSO
R=238 G=99 B=78
#ee634e
AZZURRO
R=80 G=186 B=225
#50bae1
VERDE
R=174 G=201 B=113
#aec97l
ARANCIO
R=250 G=190 B=76
#aec97l

6. ICONE
casaqui
universitàqui
lavoroqui
duepassiqui
La categoria “casaqui” è quel-
la che abbiamo riservato ai
residenti. La scelta del colore
arancione è avvenuta pren-
dendo spunto dalle strisce che
riservano il parcheggio per i
residenti all’interno delle città.
La categoria “universitàqui” è
quella riservata a coloro che
gravitano all’interno del mon-
do universitario, dagli studenti
ai collaboratori, agli insegnan-
ti. Il colore rosso è stato scelto
come richiamo al colore degli
edifici che compongono il cam-
pusuniversitariodellaBicocca.
La categoria “lavoroqui” è
quella che abbiamo riserva-
to ai lavoratori. Il colore az-
zurro è stato scelto in quan-
to viene spesso utilizzato
da banche, edifici pubbli-
ci e altri organi istituzionali.
La categoria “duepassiqui”
è quella che abbiamo riser-
vato ai city users. Il verde lo
abbiamo scelto in quanto ge-
neralmente è associato agli
spazi pubblici, al relax, all’aria
aperta, al benessere e quin-
di anche al godersi la città.
La forma che abbiamo scelto per le icone è una forma
che si ri fa a quella di un geolocalizzatore, per mantenere
una certa coerenza con il nome e con il logo“Bicoccaqui”. stilizzazione della nostra icona di partenza

7. casaqui universitàqui lavoroqui duepassiqui
ICONE / ATTIVE
ICONE / NON ATTIVE

8. MACRO CATEGORIE / MENU’
UTILITA’
SVAGO
TRASPORTI
RISTORO
UNIVERSITA’
salute
istruzione
banche uffici
tabacchi
aree Wi-fi
librerie
copisterie
parcheggi
linee bus
tram
metro
treno
altri trasporti
sport
cultura
aree verdi
bellezza
locali
shopping
ristoranti
pizzerie
fast food
bar & pub
alimentari
poli didattici
orario lezioni
segreterie
biblioteche

9. DESKTOP

10. DESKTOP / HOMEPAGE

11. DESKTOP / PAGINA1

12. DESKTOP / PAGINA2

13. DESKTOP / PAGINA3

14. DESKTOP / PAGINA4

15. DESKTOP / PAGINA5

16. TABLET

17. TABLET / HOMEPAGE

18. TABLET / PAGINA1

19. TABLET / PAGINA2

20. TABLET / PAGINA3

21. TABLET / PAGINA4

22. TABLET / PAGINA5

23. TABLET / PAGINA6

24. MOBILE

25. MOBILE / HOMEPAGE

26. MOBILE / PAGINA1

27. MOBILE / PAGINA2

28. MOBILE / PAGINA3

29. MOBILE / PAGINA4

30. MOBILE / PAGINA5

31. MOBILE / PAGINA6