Didattica UNISI

PROGRAMMA D’ESAME

Laurea Magistrale: STRATEGIE E TECNICHE DELLA COMUNICAZIONE

Insegnamento: CULTURA E TECNICHE DEL WEB

Docente: Salvatore Paone

Esercitazione 16-dic 2019:

1. Wireframe
2. Wireframe con aiuti
3. Testo commissione cliente

PREREQUISITI

Alfabetizzazione informatica e disponibilità a seguire un percorso in cui teoria e pratica sono fortemente interconnesse.

OBIETTIVI FORMATIVI

Obiettivo dell'insegnamento di CULTURA E TECNICHE DEL WEB è di sviluppare e coordinare le capacità logiche e metodologiche degli studenti durante la realizzazione concreta di un progetto di web design, con particolare riferimento all’ambito della web and social communication. Ulteriore imprescindibile obiettivo è la padronanza degli strumenti per l’elaborazione digitale dei contenuti: CMS; e l’utilizzo dei linguaggi di mark-up: HTML/CSS, e di interazione jQuery.

CONTENUTO DEL CORSO

Il corso di CULTURA E TECNICHE DEL WEB prenderà il via dalle essenziali nozioni di design della comunicazione, portando l’allievo a progettare/sviluppare gli elaborati proposti dal docente in ambiente web, partendo da una valutazione delle tecnologie con particolare attenzione a Wordpress e Joomla, agli aspetti mobile e alla loro integrazione con altre piattaforme libere, per poi, infine, approdare alla realizzazione di una o più proposte e alla loro presentazione e discussione critica in sede d’esame.

TESTI DI RIFERIMENTO

Per studenti frequentanti

• Stephen Hay (2014), Responsive design. Progettare siti web per i dispositivi mobili, Pearson.
• Francesco De Nobili (2019), SEO GOOGLE, Hoepli.
• Aaron Gustafson (2017), Web design adattivo, Pearson.
• Materiale indicato dal docente durante il corso.

Per studenti non frequentanti

Lo stesso materiale summenzionato per gli studenti frequentanti più, a supporto della parte pratica:
Un manuale recente su Wordpress [se si sceglie Wordpress come CMS per sviluppare l'elaborato da portare all'esame], p.e. Bonaventura Di Bello (2017) Webmaster con Wordpress, Seconda Edizione: Creare Rapidamente e facilmente Siti Web Professionali a Costo, Hoepli.
Un manuale recente su Joomla [se si sceglie Joomla come CMS per sviluppare l'elaborato da portare all'esame], p.e. Alessandra Salvaggio (2014) Joomla 3.3: Guida all'uso, Edizioni LSWR.

TESTI DI CONSULTAZIONE E APPROFONDIMENTO

• Alessandra Salvaggio (2015), HTML5 e CSS3: Guida completa, Edizioni LSWR; 2 edizione, Collana: Digital Lifestyle Pro.
• Simone Aliprandi (2013), Creative Commons: Manuale Operativo , Milano, Ledizioni; disponibile anche sul sito dell'editore in formato .epub ad un costo molto minore rispetto al cartaceo.
• Francesco De Nobili (2016), Strategie di CONTENT MARKETING, Hoepli.

METODI DIDATTICI

Per studenti frequentanti
Trattandosi di un modulo con obiettivi professionalizzanti, l’attività didattica sarà di tipo laboratoriale e si svolgerà attraverso lezioni frontali in cui risulterà fondamentale l’interazione continua con gli allievi. In particolare, durante l’attività laboratoriale, gli studenti saranno invitati a cimentarsi in esercitazioni di web design che tengano conto di usabilità ed esperienza utente, su tematiche fornite dal docente. La frequenza alle lezioni rappresenta una condizione indispensabile per l’auspicato conseguimento degli obiettivi formativi.

Per studenti non frequentanti
Gli studenti impossibilitati a frequentare - solo in casi di documentata impossibilità - dovranno comunque svolgere un’attività che sia assimilabile a quella svolta in aula. Sono perciò tenuti a contattare il docente entro le prime 2 settimane di corso in modo da essere indirizzati verso un analogo lavoro metodologico e progettuale. I progetti potranno essere sottoposti al docente, per le opportune considerazioni, attraverso incontri con cadenza mensile, durante il ricevimento. Solo in casi di documentata impossibilità, tale confronto potrà avvenire via mail. Non sono ammesse deroghe a quanto indicato. Lo studente non frequentante avrà inoltre un carico bibliografico superiore, vedi sezione “Testi di riferimento”.

TIPO DI ESAME

L’esame consiste in una prova orale in cui saranno analizzati dal docente gli elaborati degli allievi e verranno poste domande sia di tipo teorico, sia di tipo pratico, con conseguente discussione critica. I testi di riferimento sono obbligatori, mentre si consiglia la consultazione dei testi di approfondimento, sia per gli studenti frequentanti che per i non frequentanti.

MATERIALI

• (Dispense HTML) https://drive.google.com/open?id=1YDekJhcrGs0JgG_huuSpNekPqJHmbUs9
• (root michelangelo) https://drive.google.com/open?id=1utHTc0UMMwku4cpbAco5rEPyNBVOpJkP
• (Introduzione HTML5 CSS3) https://docs.google.com/presentation/d/19SpA71w7CIjajvjdvEaJWtCpDT6gvwmRVAub9NqwGcI/edit?usp=sharing  
• (Michelangelo 2) https://drive.google.com/open?id=1bwn8R_5637dgKz_KGrn3W96fIM6Ji3mZ
•  (Wireframe Landing page) https://drive.google.com/file/d/1f5orn7zsdG2mtfpFaEgvJl18rYvvCZmR/view?usp=sharing
• (Dal wireframe al prototipo HTML) https://drive.google.com/open?id=10pSUVNEANopg9IP-dXOygXenbk9pBUgt01ed4HklmNs
• (Codice HTML/CSS) https://drive.google.com/open?id=1SAuU9VLrSJvP9FnNKoW3yFUupoHF73Yu
• Balsamiq di Alberto Porri (Creative Commons Attribuzione - Condividi allo stesso modo 4.0 Internazionale): https://drive.google.com/open?id=1HhGY58kwqESdug7T70hMp6lGMFtmSwNz
• Prototipo Cute the Rope (con tavolozza colore): https://drive.google.com/open?id=1Xi-CHVsQ59SPTNngfzsoh4Iq_Wsb7H6e
• Protipo Clash Royale (con tavolozza colore): https://drive.google.com/open?id=1PSl5ALrMdxLrhsanyZ1ncOusDWsYG6TP
• Prototipo Brawl stars (con tavolozza colore): https://drive.google.com/open?id=1RPMaCBHPQlNdvBoQB7-CJbIju-ew4zfr
•  Introduzione a WordPress: https://drive.google.com/open?id=0B4ycSZkVbRUdYkV6WG1lOWcxMUk
• Adobe XD di Eleonora Piccinelli (Creative Commons Attribuzione - Condividi allo stesso modo 3.0 Italia CC BY-SA 3.0 IT): https://drive.google.com/file/d/1_6GlKTlSTWOqRBDLeVPkVZwrviML7Z19/view?usp=sharing
• Wireframe esercizio: https://drive.google.com/open?id=1NgIXuIPEzyYns6uVLT_jUdXMKhmxWYFk
• TripAdvisor di Francesco Pinzuti (Creative Commons Attribuzione - Non commerciale - Condividi allo stesso modo 4.0 Internazionale) https://drive.google.com/open?id=1f7fsi7XRgIjHwh7-dCh1fU7LuCOhZQMf
• DaVinci Resolve di Patrick William Soh Mba (Creative Commons Attribuzione - Non commerciale - Condividi allo stesso modo 4.0 Internazionale) https://drive.google.com/open?id=1B-RXM_tHkecRB3inls6EZcRWDE89er7R
• Come generare traffico web di Giulia Garofalo dd https://drive.google.com/open?id=1EpVXBgJiw3hSejCLeHu9bHOm-A69vWN4
• Narrazione transmediale di Yasmina Nunziata (Creative Commons Attribuzione - Non commerciale - Condividi allo stesso modo 4.0 Internazionale)  https://drive.google.com/open?id=1vSRFGX3g50gv70wt3cBrxFMged4mYA4z
• SEO di Serena Bruno (Creative Commons Attribuzione - Condividi allo stesso modo 4.0 Internazionale) https://drive.google.com/open?id=1fsIQvHttkuamOyr5CNVBcGDqt7n4GOw2
• CMS di Ottavia Messina (Creative Commons Attribuzione - Non commerciale - Condividi allo stesso modo 4.0 Internazionale) https://drive.google.com/open?id=1wWYhM42aVfnusQnS700-HL3rssijlSgZ
• FONT E ACCOSTAMENTO COLORI di Slava Grecov (Creative Commons Attribution-NonCommercial 4.0 International License) https://drive.google.com/open?id=1KXn_HL_PrejNAsXQteBew3Po2Q5FrhUc
• Mockup su Coedu di Slava Grecov (Creative Commons Attribution-NonCommercial 4.0 International License) https://drive.google.com/open?id=1dFosm9VqujSLTiusjscLXUh1QGDyC1Fs
•  La realizzazione di un logo di Flavia Digiugno (Attribuzione - Non commerciale - Condividi allo stesso modo 4.0 Internazionale) https://drive.google.com/open?id=1E1fqJOMlCQq1_HQLjNywoqnz1jf0_vAn
• User Experience Design di Paola Del Castello (Creative Commons Attribuzione - Non commerciale 4.0 Internazionale) https://drive.google.com/open?id=1LqViPQbWT9OgLtiiGQTUVxSl7vW-E8mjvavA-O498a0
• ANALISI DI UN SITO CREATO PER UN MUSEO di Chiara Mancini (Creative Commons Attribuzione - Non commerciale 4.0 Internazionale) https://drive.google.com/open?id=1qludtUM4bhXep3WS2MvwbJTo5TnsorWi
• L’ADVERTISING SUL WEB di Manuela Fichera (Creative Commons Attribuzione - Non commerciale - Condividi allo stesso modo 4.0 Internazionale) https://drive.google.com/open?id=1Rn5CvMXLM6InsaKgQ37cj5sGpsghzMgb
• Template base Joomla: https://drive.google.com/open?id=1m0I_QbZEPpM2T54n3ZVhOTlFZNjxM6ge
• Adattamento culturale di un sito Web: come attraversare i con fini di Anastasiia Ermilova (Attribution-NonCommercial 4.0 International CC BY-NC 4.0) https://drive.google.com/open?id=1oi0EUUx-38icPod_SwPuJjrjl8Y5TPXK