Progetto social network

Transcript

1 Progetto social network Tecniche Multimediali Docente: dott. Stefano Marchetti 03 Giugno 2009 Corso di Laurea in Informatica

2 Introduzione Scopo del progetto Realizzare un portale di social network in stile facebook ( Le tecnologie da applicare: HTML Javascript CSS Flash programmazione server side (JSP) database (MySQL) Ajax Caratteristiche del progetto Portale verosimile rispetto ad una situazione reale. Le funzionalità offerte dovranno essere accattivanti per gli utenti. I contenuti fittizi inseriti ai fini della consegna dovranno essere realistici e sufficientemente completi. Il social network dovrà dare l impressione di un prodotto finito e pronto per la messa in produzione. Si devono considerare aspetti quali usabilità, accessibilità e servizi offerti. Come da punto precedente: i servizi offerti dal sito verranno valutati dal punto di vista dell utente finale, quindi dovrà essere altamente usabile (visto il target eterogeneo) e e di facile comprensione. La struttura del database sarà definita dai gruppi stessi. E richiesta l approvazione del docente prima di partire con lo sviluppo: questo comporta la consegna anticipata della struttura e dello schema relazionale del database (almeno un mese prima della data d esame).

3 I gruppi Essenziale il lavoro di gruppo Gruppi di 2-3 persone VIETATI i gruppi da N, dove N=1 o N>3 Valutazione del lavoro di gruppo e del contributo personale Ogni gruppo deve comunicare la lista dei suoi componenti ENTRO IL 30 APRILE Importante la divisione dei ruoli all interno del gruppo: in sede d esame verrà chiesto chiaramente qual è stato il ruolo e il carico di lavoro di ciascun componente del gruppo Evitare di abbandonare il gruppo 1 mese prima della consegna!!!! Alcuni esempi di social network

4

5 Specifiche tecniche Funzionalità Occorre realizzare una serie di procedure con il linguaggio JSP che, via Web, si interfaccino ad un database MySql per consentire le interazioni tra gli utenti registrati al sito Il portale dovrà essere graficamente originale e presenterà elementi multimediali (filmati Flash) Il portale non avrà contenuti pubblici navigabili Le uniche pagine accessibili all utente anonimo saranno: semplice home page di presentazione da cui deve essere assolutamente evidente e chiaro: - il logo, il nome e il tema del sito - l accesso al form di login o di registrazione - un invito chiaro ai nuovi utenti per guidarli/invogliarli nella registrazione - elementi extra facoltativi (clip flash, foto, testi)

6 login e pagina di registrazione disclaimer per privacy e condizioni di utilizzo del sito guida per l'utente all'utilizzo del sito, corredata di immagini (a scelta in flash) Per sfruttare i servizi del sito sarà richiesto il login: necessità di essere registrati Loggandosi, si presenta come prima pagina la "bacheca" con le ultime N attività degli utenti Il sito rappresenta un unica comunità di persone ma per poter interagire occorre richiedere l amicizia ai propri contatti. Un utente richiede l'amicizia ad un altro utente iscritto che: può accettarla o può respingerla Area personale Ogni utente dispone di una propria area personale per: - modifcare il proprio profilo e pubblicare una frase di stato - visualizzare le notifiche - creare eventi - visualizzare l elenco dei propri amici La bacheca Due modalità di interazione dalla bacheca: commentando le attività degli amici: non si possono lasciare commenti a chi non ha un legame di amicizia votando con mi piace o non mi piace le attività di tutti: devono esserci due piccoli pulsanti/link in corrispondenza di tutte le attività visualizzate in bacheca (indipendentemente da legami di amicizia). - Il click sul pulsante mi piace (o non mi piace) aumenterà (o diminuirà) il gradimento degli iscritti per una certa attività. Attività segnalate in bacheca pubblicazione della frase di stato pubblicazione di un evento

7 adesione ad un evento Ogni attività sarà costituita da: Il nome (o nickname) dell utente che l ha generata, linkato alla pagina del suo profilo (se è un proprio amico) o ad una pagina semplice da cui poter richiedere la sua amicizia (in alternativa si può gestire la richiesta via Ajax/jQuery utilizzando finestre a livelli sovrapposti alla pagina corrente). Il testo descrittivo dell attività (nuova frase di stato, titolo e data del nuovo evento,...). Numero di mi piace o non mi piace ricevuti, con i pulsanti per dare il proprio voto - opzionale: dopo aver votato, in positivo o negativo, i pulsanti dovrebbero sparire La lista di commenti lasciati dagli amici e un area di testo per aggiungere il proprio commento (o in alternativa un pulsante che rimandi ad una sezione specifica da cui poter scrivere il commento). Quest ultima sarà presente solo se l attività è stata generata da un amico. - opzionale: i commenti possono essere gestiti via Ajax/jQuery L utente Accedendo al sito, l utente sarà reindirizzato immediatamente alla bacheca ma avrà a disposizione anche una propria area personale costituita da: pagina del profilo pagina di gestione delle notifiche calendario degli eventi Il profilo Deve prevedere un minimo di anagrafica possibilità di inserire una frase personale di "stato" foto/avatar opzionale: l utente può inserire informazioni relative al proprio lavoro, ai propri studi, alle proprie preferenze, hobbies, attività... Il profilo di un utente è visibile solo ai propri amici L evento Ogni utente potrà creare degli eventi caratterizzati da:

8 data inizio / fine località tipo di evento (festa, lezione, spettacolo,...) descrizione generica Gli utenti del sito possono partecipare ad un evento, confermando la propria presenza Gli eventi appena creati sono pubblicati in bacheca Deve essere gestito un calendario globale (accessibile dalla bacheca) con tutti gli eventi passati e futuri - Per ogni evento verranno riportate le informazioni di base (data, località...) e la lista dei partecipanti - Se l evento non è ancora trascorso deve esserci un link/pulsante che consenta di iscriversi/ partecipare (sempre in relazione ai permessi di accesso definiti di seguito) Ogni evento può avere tre stati possibili: visibile e aperto a tutti visibile a tutti ma possono partecipare solo gli amici riservato agli amici Ogni utente vedrà nel calendario globale e tra le attività in bacheca solo gli annunci relativi ad eventi per cui ha i permessi necessari Non è possibile partecipare agli eventi già trascorsi Le notifiche Ogni utente può visualizzare una lista di notifiche nella propria area per: - commenti al proprio stato o ai propri eventi - iscrizioni ricevute ai propri eventi - richieste di amicizia ricevute - richieste di amicizia inviate ed accettate Una notifica deve contenere: - data e ora in cui è stata generata - attività a cui si riferisce - riferimento dell utente a cui va segnalata

9 Adobe Flash Slider automatico Realizzare una piccola applicazione Flash da visualizzare nella bacheca Transizione automatica degli avatar degli utenti iscritti al sito, in ordine casuale - avatar - solo il nome - iscritto dal xx/xx/xxxx Inserire un pulsante per arrestare/riprendere l animazione I dati degli utenti saranno richiesti al database tramite XML Opzionale: la foto può essere cliccabile e rimandare al profilo dell utente (se è un amico) o generare una richiesta di amicizia Opzionale Si possono inserire a piacere altri clip multimediali nel sito (banner, advertising...) purchè originali

10 I contenuti Utenti e attività Il progetto consegnato dovrà contenere un discreto e realistico numero di contenuti - utenti - attività - eventi Alla consegna si dovrà fornire, insieme alla documentazione tecnica, l account di un utente già attivo sul sistema

11 La grafica Il layout Il portale dovrà presentare una grafica accattivante ma non invadente, in linea con le attuali tendenze del web 2.0 Il layout dovrà essere realizzato interamente e preventivamente in Photoshop (o analogo) e consegnato insieme ai sorgenti del progetto Il logo Saranno oggetto di valutazione anche il logo ed il payoff scelti per il sito Importante lo studio e l originalità, non la tecnica

12 Il database (mysql) Progettazione del database La progettazione e realizzazione del database è lasciata ai gruppi Consegna obbligatoria del diagramma relazionale con tabelle e relativi campi/tipi di dato - la consegna del db è fissata per ALMENO UN MESE prima della consegna del progetto La struttura del db dovrà essere valutata e approvata dal docente - non saranno accettati progetti che non abbiano ottenuto l approvazione del db - non saranno accettati progetti che non abbiano rispettato la scadenza di consegna del db

13 Consegne successive... dopo luglio Dopo la prima sessione di esami di luglio sarà richiesto di implementare ulteriori funzionalità Alcune possibili richieste... - gestione gallerie di foto dell utente - gestione messaggi privati tra amici - aggiunta di una scadenza alle notifiche

14 La consegna Cosa consegnare Di tutto il materiale va consegnato obbligatoriamente anche il CODICE SORGENTE - struttura db con diagramma relazionale - pagine JSP/HTML + script Js/Ajax - layout del sito con livelli - sorgenti Flash (.fla) - documentazione (relazione tecnica) Le scadenze Struttura del database - almeno un mese prima della consegna - vincolante l approvazione del docente - prima sessione: entro il 31 Maggio 2009 Layout del sito - sarà valutata positivamente la consegna del layout entro il 31 Maggio 2009 Il progetto - per ogni sessione la scadenza è fissata circa ad una settimana prima dell esame - verificare sul sito la data esatta per ogni appello - COMUNICARE SEMPRE al docente l avvenuta consegna e l intenzione di sostenere l esame in un certo appello Come consegnare Tutti i file (sorgenti e non) vanno caricati sul SERVER DI CONSEGNA Ogni gruppo avrà un accesso privato ad una cartella e ad un database Vanno invece inoltrati per

15 - La struttura del database e il diagramma relazionale (stefano.marchetti@unife.it) - Il layout del sito realizzato in Photoshop (o analogo) (irene.capatti@unife.it) Il server di consegna La consegna è effettuata esclusivamente sul server opportunamente predisposto a cui ci si puo' connettere via ftp Gli username sono nella forma tm09_01, tm09_02,... dove tm09_xy è il codice del gruppo La pwd verrà comunicata via Nella propria cartella mettere la documentazione del progetto in formato OpenOffice o PDF Nella propria cartella creare le varie sottocartelle jsp, html, images, css, js che conterranno i vari tipi di file Il file nome-file.jsp nella propria home directory sarà accessibile all'indirizzo Gestione del database: collegarsi a phpmyadmin disponibile all'indirizzo Gli username e le pwd sono le stesse usate per ftp Server ftp : dynamo1.bloccob.man NOTA: il server di consegna ha 2 interfacce di rete con 2 nomi distinti (dynamo0 e dynamo1) Software installato sul server di consegna tomcat JSP e servlet container mysql database server phpmyadmin gestione del database via Web apache server web per phpmyadmin jdk 1.5.0_11 supporto java per tomcat I criteri di valutazione Griglia di valutazione

16 Punteggio assegnato ad ogni singola funzionalità richiesta Bonus per prima consegna Punteggio aggiuntivo per consegna layout entro i termini Punteggio per ogni funzionalità aggiuntiva non richiesta (documentata) Valutazione tecnica Struttura del database Documentazione tecnica Pagine lato pubblico obbligatorie - home page - guida utente - registrazione... Correttezza CSS (validato) Correttezza HTML (validato: almeno Transitional) Correttezza javascript Programmazione server-side Servizi offerti dal portale ed eventuali servizi aggiuntivi USABILITA Portabilità tra browser, risoluzione minima 1024 Qualità dell informazione, contenuti realistici Valutazione grafica Layout grafico e uso degli strumenti di design Qualità estetica, scelta e abbinamento dei colori Uso del CSS (effetti, gradevolezza) Uso HTML (div/tabelle) Studio e originalità del logo/payoff Uso di Flash per le funzionalalità obbligatorie

17 Elementi aggiuntivi (clip animati, elementi grafici,...) non richiesti nelle specifiche Siate ORIGINALI e CREATIVI Il punteggio I punti assegnati ad ogni singola voce variano tra 0 e 5 (6 in casi eccezionali) Il punteggio totale viene convertito in trentesimi Il voto del progetto fa media con il voto dello scritto

18 Riferimenti E. Wilde, Wilde s WWW, Springer Verlag