Argomenti del corso• Parte 1: Introduzione/ usabilita/user centered design

• Il funzionamento del web, gli ipertesti ed linguaggio del web• Cenni di usabilità e accessibilità: il web per esseri umani

• Parte 2: Progettazione • Progettazione: Colori, sfondi, caratteri, simboli e metafore visive• Progettazione: Wireframe Architettura del sito: strutturazione dei contenuti,

categorie e menù di navigazione

• Parte 3: struttura del sito: HTML• Il linguaggio XHTML• Lavorare con Adobe Dreamweaver: area di lavoro e impostazione del sito e stesura

del codice• Parte 4: visual del sito: CSS• Fogli di stile : i layout di pagina con i CSS, la compatibilità con i browser, la

validazione• La creazione dell’interfaccia: Integrazione fra XHTML, CSS e grafica

Argomenti di laboratorio

• Progettazione: Colori, sfondi, caratteri, simboli e metafore visive• Lavorare con Adobe Photoshop: progettazione del layout• Utilizzo di Adobe Photoshop per il web: • uso dei livelli• grafica per il web• strumenti di taglio• ottimizzazione delle immagini• formati immagine.

• Strutturazione dell’interfaccia• Trasformazione dell’interfaccia grafica in sito web

Revisioni progettuali

• Sono previste due sessioni di revisioni progettuali:

• 1) Revisione progettuale obbligatoria a inizio novembre (vi comunicheremo le date esatte, indicativamente a inizio novembre)

• 2) Revisione progettuale facoltativa su richiesta a fine corso (fino ad esaurimento posti) per valutare problemi tecnici o progettuali

Revisioni progettuali - mail

• Altre richieste di aiuto / verifica codice possono essere inoltrate tramite mail, ma solo se prima avete provato autonomamente a risolvere il problema e siete sull’orlo della disperazione• Revisioni a ricevimento (su appuntamento

via mail) in cui dovrete portare codice e file PSD

Modalità d’esame

• Per accertare le conoscenze acquisite, al termine del corso è previsto uno scritto individuale con domande a scelta multipla e una domanda teorica aperta volto a verificare le conoscenze teoriche e tecniche acquisite durante il corso.• E’ prevista inoltre la consegna di un elaborato progettuale composto da:

• Wireframe del sito• Mockup e file PSD• Sito web navigabile realizzato in XHTML + CSS (NO Javascript/Flash/PHP o altri

linguaggi)

• Il progetto verrà realizzato e presentato in gruppi di lavoro composti da 2 o al massimo 3 persone.

Modalità d’esame

• Il voto finale sarà calcolato attraverso la media delle valutazioni ottenute nella prova scritta individuale e dal voto relativo al progetto di gruppo.•

Ad esempio, lo studente Mario Rossi ha ottenuto una valutazione di 23 allo scritto, mentre il progetto di gruppo ha ottenuto una valutazione di 25. Il voto finale sara (23+25)/2 = 24. Il compagno di gruppo di Mario ha invece ottenuto 29 allo scritto, quindi il suo voto finale sarà dato da (29+23)/2 = 26.

Brief di progetto

• Il progetto da sviluppare durante il corso è rappresentato dallo sviluppo di un sito web di presentazione del gruppo stesso. L’obiettivo è quello di comunicare sia la natura unitaria del gruppo di lavoro, trovando un’idea originale che faccia percepire che siete 2/3 studenti che per sorte o per interesse collaborano ad un progetto d’esame comune, e allo stesso tempo presentando le singole persone che compongono questo gruppo.• l’obiettivo è che un navigatore capisca al volo che il gruppo di lavoro è

composto da due/tre persone distinte la cui unione ha dato vita ad un team di lavoro unitario.

Brief di progetto

• Il sito dovra presentare le seguenti pagine:• home page del gruppo• chi siamo o pagine dei membri del gruppo di lavoro• gallery• contatti e social page• eventuali pagine accessorie (non obbligatorie)• Il progetto dovrà essere consegnato funzionante e strutturato secondo quanto

visto a lezione.• La consegna dovra avvenire tramite we-transfer del pacchetto di file oppure

attraverso lo sharing di cartella dropbox, oppure tramite una cartella Google Drive condivisa.

Contatti

• Dr.Gabbiadini Ale.gabbiadini@gmail.comAlessandro.gabbiadini@unimib.it

• Dott.ssa Quartididattica@dianaquarti.com dianaquarti@gmail.com

Sito del corso: www.liralab.com/igw