Sei sulla pagina 1di 15

Progetto Sito Web

AS: 2016/2017
Andrea Altomare 5A
I.T.I.S. G. Marconi - Jesi

INDICE
Introduzione..........................................................................................................................2

PMBOK.................................................................................................................................3

Analisi dellidea progettuale..................................................................................................4

Project Charter......................................................................................................................5

Pianificazione........................................................................................................................6

WBS...........................................................................................................................6
PDM...........................................................................................................................7
Diagramma di Gantt...................................................................................................9

Sitemap...............................................................................................................................11

Mockup...............................................................................................................................12

Progettazione database......................................................................................................14

Conclusioni.........................................................................................................................14

Andrea Altomare 5A | Progetto Sito Web 1


I.T.I.S. G. Marconi - Jesi

INTRODUZIONE
Questo documento il piano di progetto finalizzato a raccogliere tutte le informazioni riguardanti
lanalisi, la pianificazione, la realizzazione e la gestione del sito web per lesame di maturit. Esso
redatto dallo studente Andrea Altomare, classe 5A dellIstituto Tecnico Industriale Guglielmo
Marconi di Jesi.

Innanzitutto stata definita lidea progettuale di base secondo la quale muoversi per la progettazione
del prodotto finale, dopodich si passati alla pianificazione del lavoro e alla sua schedulazione nel
tempo (mediante varie tecniche e strumenti di project managing quali WBS, PDM, Diagramma di
Gantt...), quindi seguir la realizzazione vera e propria con precise tecnologie informatiche, infine vi
sar la fase di test, lultimazione dellorganizzazione di tutto il materiale (la quale ha gi preso il via
durante lanno scolastico) e la consegna alla professoressa di Gestione di Progetto e Organizzazione
dImpresa. Infine, il progetto e il sito verranno presentati alla commissione desame durante la fase
orale della maturit.

In particolare il sito dovr avere la funzione di raccoglitore dellintera produzione di materiale


scolastico messa in atto durante lanno secondo la metodologia della Scuola 2.0, la quale non prevede
lutilizzo di libri cartacei ma di strumenti multimediali sui quali operare alternativi metodi di
apprendimento.

Andrea Altomare 5A | Progetto Sito Web 2


I.T.I.S. G. Marconi - Jesi

PMBOK
Aree di Gruppi di processo
Conoscenza Avvio Pianicazione Esecuzione Controllo Chiusura
Integrazione Sviluppare il Sviluppare il Dirigere Monitorare il lavo- Chiudere il proget-
Project Charter piano di gestione lesecuzione ro del progetto to o una fase
di progetto Eseguire il
controllo delle
modiche
Scopo Definire lidea Scopo del sito Realizzazione Test componenti Consegna
progettuale del struttura del sito
Creare WBS del sito progetto
sito Scrittura codice
Creare mockup per interfaccia Test completo Presentazione sito
Caricamento file alla commissione
Tempi Creazione Controllare che
diagramma delle venga rispettata la
precedenze (PDM) schedulazione
Stima tempo per temporale
ogni attivit
Schedulazione
temporale con
Diagramma di
Gantt
Costi Stima costi e Controllo erispetto
budget dei costi

Qualit Pianicazione Esecuzione delle Controllo qualit


standard di attivit secondo componenti e
qualit gli standard sito completo
qualitativi

Risorse Definizione e Costituire,


umane pianificazione dei sviluppare e
ruoli delle risorse gestire il gruppo
umane (persona di progetto
unica) (persona unica)

Comunicazio- Identicazione Pianicazione Distribuire le infor-


ne degli stakeholder del le mazioni
comunicazioni Gestire le aspet-
tative degli
stakeholder
Rischi Analisi rischi di Risoluzione rischi Monitorare e
progetto di progetto controllare i
Pianificazione rischi
risoluzioni

Acquisti Analisi eventuali Denizione Amministrazione Chiusura fase


acquisti acquisti acquisti acquisti
Pianificazione Esecuzione
eventuali acquisti acquisti

Andrea Altomare 5A | Progetto Sito Web 3


I.T.I.S. G. Marconi - Jesi

Il PMBOK stato ottenuto intersecando le aree di conoscenza con i gruppi di processo. Le righe
riguardanti le risorse umane e la comunicazione devono essere viste in modo opportuno rispetto a
questo tipo di progetto: per quanto riguarda le prime, lunico a lavorare interamente sono io, dunque
la gestione del team di progetto puramente formale; le comunicazioni invece riguardano solamente
il docente interessato, e non un insieme di varie persone (stakeholder) come di consuetudine nei
progetti aziendali.

ANALISI DELLIDEA PROGETTUALE


Nella fase di avvio studio lidea progettuale del sito. Dopo che il docente ha spiegato e
commissionato il lavoro, devo tenere in considerazione lo scopo e i vari motivi che sottintendono la
creazione di un sito web, per poi passare alla fase di pianificazione.
Con le seguenti, si intende dare una pi accurata visione dellidea progettuale, sui motivi che
sottendono la sua realizzazione, sullo scopo, e sui mezzi, gli strumenti e le tecniche che verranno
utilizzate durante tutto lo svolgimento.
Lo scopo primario proprio del sito web in questione sar quello di raccogliere e presentare
adeguatamente tutto il materiale scolastico utilizzato durante lanno ed i prodotti realizzati
individualmente o in team. Il lavoro individuale e io (Andrea Altomare) sono lunica persona
coinvolta nella totalit del progetto, successivamente il tutto verr presentato alla commissione
desame. I vari materiali prodotti durante lanno scolastico verranno suddivisi secondo la materia di
appartenenza (o quella che pi la interessa, per lavori interdisciplinari), e ad ognuna verr dedicata
una pagina allinterno del sito, il quale dovr in ogni caso avere una parte iniziale generale che non
mostri alcun file. Il sito web verr realizzato utilizzando appositi linguaggi studiati durante gli anni
(specialmente il 5), quali lHTML per la creazione della struttura, i CSS per la definizione degli stili
grafici delle pagine, eventualmente il JavaScript per linterazione utente-sito lato client, lSQL nel caso
venga progettato un database, il PHP per lesecuzione di operazioni lato server (come il recupero dei
file da mostrare o la navigazione tra le pagine). Non da escludere lutilizzo di un CMS per la
realizzazione del prodotto finale in funzione dellintrinseca utilit che permette di risparmiare tempo e
lavoro. Gli strumenti che verranno usati saranno:

Microsoft Expression Web 4: per la scrittura del codice;


MySQL: come DBMS per leventuale database;
phpMyAdmin: nel caso si debba gestire il DB;
Microsoft Office Word: per la stesura dei vari documenti di progetto;
Microsoft Office Excel: per la creazione di tabelle per il DB e, in generale, per i documenti di
progetto;
Microsoft Visio: per la creazione professionale di schemi progettuali;
Microsoft Project: per il Project Management;
Balsamiq Mockups 3: per la progettazione dellinterfaccia e del layout del sito;
CMS: eventualmente, per la realizzazione del sito web;
WAMP o XAMPP: per il test in locale dellintero sistema.

Andrea Altomare 5A | Progetto Sito Web 4


I.T.I.S. G. Marconi - Jesi

Il progetto verr definitivamente concluso e consegnato in prossimit della fine dellanno scolastico,
per la valutazione che verr effettuata dal docente interessato. In ultimo, verr mostrato e presentato
alla commissione durante la fase orale dellesame di maturit.
Ho stabilito che lavorer tutta la settimana (anche sabato e domenica), mediamente per tre ore al
giorno.

PROJECT CHARTER
Progetto: Sito Web Codice progetto: P01
Data: 15 settembre 2016 Revisione: 0
Clienti: Scuola; Commissione desame Sponsor:
1. OBIETTIVI
Lo scopo del progetto quello di creare un sito web personale con le conoscenze e le competenze acquisite
durante gli anni (specialmente il 5), nel quale dovranno essere inseriti tutti i materiali prodotti durante lultimo; il
sito dovr poi essere mostrato alla commessione in sede desame.
2. PRINCIPALI DELIVERABLE
Project Management: piano di Project Management e PMBOK
Project Management: Project Charter
Progettazione: analisi e specifiche; WBS, PDM, Diagramma di Gantt
Progettazione: mockup interfaccia
Esecuzione: codice sito web
Esecuzione: sito web funzionante
3. MILESTONE
Sito web funzionante
Contenuti organizzati e inseriti
Upload sito web
4. VINCOLI E DIPENDENZE

Per la realizzazione dellinterfaccia grafica sar prima necessario un adeguato mockup.


Per questioni di tempo inoltre potrebbe essere necessario lutilizzo di CMS per la costruzione del sito. Inoltre,
lultimazione dellorganizzazione e inserimento dei contenuti e lupload del sito web sono necessariamente vincolati
alla registrazione di un dominio e allacquisizione di uno spazio web.
5. TEMPISTICA PRELIMINARE
Il progetto comincia allinizio dellanno scolastico, 15 settembre 2016, quando ci stato comunicato e
commissionato, e termina alla fine dellesame di stato, dopo averlo presentato alla commissione nella fase orale.
6. PRINCIPALI RISORSE E LIMITI DI COSTO
Le risorse necessarie alla realizzazione del prodotto ultimo che si sta progettando sono costituite da un
computer con collegamento internet, gli ambienti di sviluppo e gli strumenti necessari alla programmazione
concreta del sito (indicati sopra, nelle informazioni generali), e uno spazio web da acquistare (e un dominio da
registrare) per rendere disponibile il prodotto ultimato online.
Si gi in possesso degli strumenti indicati precedentemente, per cui gli unici costi economici da sostenere
saranno eventualmente quelli relativi alla registrazione del dominio ed allacquisizione di uno spazio web.
7. DOCUMENTI DI RIFERIMENTO E ALLEGATI

I documenti di riferimento sono costituiti dalle sezioni riguardanti il PMBOK, il Project Charter, e lanalisi delle
specifiche interne a questo stesso documento. Saranno inoltre presi in considerazione vari documenti, fonti e
materiali forniti dai docenti.
8. STRUTTURA ORGANIZZATIVA
Il Project Manager del progetto nonch ogni altro ruolo del team di progetto sar ricoperto da me, Andrea
Altomare. I professori avranno il ruolo di supervisori ed approvatori del lavoro e del prodotto creato durante tutta
la progettazione e la realizzazione.
9. AUTORIZZAZIONE
Approvato da: Prof.ssa Mantini Stefania Data

Andrea Altomare 5A | Progetto Sito Web 5


I.T.I.S. G. Marconi - Jesi

PIANIFICAZIONE
Segue la pianificazione della attivit costituenti il progetto e la relativa schedulazione temporale.

WBS

Progetto Sito Web

Avvio Pianificazione/Progettazione Realizzazione/Controllo Chiusura

Studio dell'idea Pianificazione contenuti da Progettazione mappa sito Progettazione del Scelta delle tecnologie da Realizzazione Registrazione spazio web
Analisi delle specifiche Pianificazione delle attivit Mockup interfaccia
progettuale del sito inserire web database usare documentazione tecnica (registrazione dominio)

Upload sito nello spazio


Realizzazione del WBS Sviulppo struttura sito web
web

Realizzazione interfaccia Consegna Progetto Sito


Realizzazione del PDM
sito web Web concluso

Organizzazione dei
Realizzazione del Presentazione Progetto
materiali (contenuti) nelle
Diagramma di Gantt Sito Web
directory del sito

Realizzazione database

Sviulppo script back-end


per l'interfacciamento
sito-webserver-database

Test di ogni componente


del sito web

Andrea Altomare 5A | Progetto Sito Web 6


I.T.I.S. G. Marconi - Jesi

PDM
3 Realizzazione del WBS

2 gg
Pianificazione contenuti da
6 8 Mockup interfaccia
inserire

4 gg 2 gg
Studio dell'idea progettuale
1 2 Analisi delle specifiche 4 Realizzazione del PDM
del sito

7 gg 7 gg 2 gg
Progettazione mappa sito
7 9 Progettazione del database
web

2 gg 2 gg
Realizzazione del Diagramma
5
di Gantt

2 gg

12 Sviluppo struttura sito web

30 gg

Sviluppo script back-end per


Scelta delle tecnologie da Realizzazione interfaccia sito Test di ogni componente del Registrazione spazio web
10 13 16 l'interfacciamento sito- 17 18
usare web sito web (registrazione dominio)
webserver-database

1 gg 30 gg 10 gg 7 gg 1 gg

15 Realizzazione database

3 gg

Realizzazione
11
documentazione tecnica

48 gg

Organizzazione dei materiali


14 (contenuti) nelle directory del
sito

22 gg

Andrea Altomare 5A | Progetto Sito Web 7


I.T.I.S. G. Marconi - Jesi

Consegna Progetto Sito Web Presentazione Progetto Sito


19 Upload sito nello spazio web 20 21
concluso Web

1 gg 1 gg 1 gg

Andrea Altomare 5A | Progetto Sito Web 8


I.T.I.S. G. Marconi - Jesi

DIAGRAMMA DI GANTT
Schedulazione temporale delle fasi di progetto:

Nome attivit Durata Inizio Fine


PROGETTO SITO WEB 207 giorni gio 15/09/16 ven 30/06/17
AVVIO 7 giorni gio 15/09/16 ven 23/09/16
Studio dell'idea progettuale del sito 7 giorni gio 15/09/16 ven 23/09/16
PIANIFICAZIONE/PROGETTAZIONE 16 giorni ven 23/09/16 lun 17/10/16
Analisi delle specifiche 7 giorni ven 23/09/16 mar 04/10/16
Realizzazione del WBS 2 giorni mar 04/10/16 gio 06/10/16
Realizzazione del PDM 2 giorni mar 04/10/16 gio 06/10/16
Realizzazione del Diagramma di Gantt 2 giorni mar 04/10/16 gio 06/10/16
Pianificazione contenuti da inserire 4 giorni gio 06/10/16 mer 12/10/16
Progettazione mappa sito web 2 giorni gio 06/10/16 lun 10/10/16
Mockup interfaccia 2 giorni mer 12/10/16 ven 14/10/16
Progettazione del database 2 giorni mer 12/10/16 ven 14/10/16
Scelte delle tecnologie da usare 1 giorno ven 14/10/16 lun 17/10/16
REALIZZAZIONE/CONTROLLO 52 giorni lun 17/10/16 mer 28/12/16
Realizzazione documentazione tecnica 48 giorni lun 17/10/16 gio 22/12/16
Sviluppo struttura sito web 30 giorni lun 17/10/16 lun 28/11/16
Realizzazione interfaccia sito web 30 giorni lun 17/10/16 lun 28/11/16
Organizzazione dei materiali (contenuti) nelle directory del sito 22 giorni lun 28/11/16 mer 28/12/16
Realizzazione database 3 giorni lun 17/10/16 gio 20/10/16
Sviluppo script back-end per l'interfacciamento sito-webserver-database 10 giorni lun 28/11/16 lun 12/12/16
Test di ogni componente del sito web 7 giorni lun 12/12/16 mer 21/12/16
CHIUSURA 44 giorni mar 02/05/17 ven 30/06/17
Registrazione spazio web (registrazione dominio) 1 giorno mar 02/05/17 mar 02/05/17
Upload nello spazio web 1 giorno mer 03/05/17 mer 03/05/17
Consegna Progetto Sito Web concluso 1 giorno mer 03/05/17 gio 04/05/17
Presentazione Progetto Sito Web 1 giorno ven 30/06/17 ven 30/06/17

Oggi

ott 16 nov 16 dic 16 gen 17 feb 17 mar 17 apr 17 mag 17 giu 17


Inizio PROGETTO SITO WEB Fine
gio 15/09/16 gio 15/09/16 - ven 30/06/17 ven 30/06/17

AVVI PIANIFICAZIONE/ REALIZZAZIONE/CONTROLLO CHIUSURA


O PROGETTAZIONE lun 17/10/16 - mer 28/12/16 mar 02/05/17 - ven 30/06/17
gio
Studi ven 23/09/16 - lun Realizzazione documentazione tecnica
Analisi
o delle lun 17/10/16 - gio 22/12/16
dell'i specific Sviluppo struttura sito web Organizzazione dei
lun 17/10/16 - lun 28/11/16 materiali (contenuti)
Realizzazione interfaccia sito nelle directory
Sviluppo Testdel sito
web script di
lun 17/10/16 - lun 28/11/16 back-end ogni

Andrea Altomare 5A | Progetto Sito Web 9


I.T.I.S. G. Marconi - Jesi

Diagramma di Gantt:

Andrea Altomare 5A | Progetto Sito Web 10


I.T.I.S. G. Marconi - Jesi

SITEMAP
Dallanalisi dellidea progettuale ho realizzato una mappa per il sito web al fine di stabilirne preventivamente la struttura ed i contenuti che lo comporranno. Il sito sar costituito da una homepage e da una pagina per le materie
scolastiche, la quale per verr semplicemente trattata dinamicamente con PHP, dunque ci che cambier nella pagina predisposta per mostrare i contenuti saranno solo questi ultimi e le informazioni contenute in essa.

Homepage

Gestione di
progetto e Progetto Sito Progetto
Home Italiano Storia Matematica Inglese Informatica Sistemi e reti TPSIT Tesina
organizzazione Web TWeb
di impresa

Andrea Altomare 5A | Progetto Sito Web 11


I.T.I.S. G. Marconi - Jesi

MOCKUP
Il layout del sito semplice ed essenziale, focalizzato sulladempimento dellobiettivo per il quale
stato creato: mostrare i contenuti scolastici utilizzati o prodotti durante lanno.

Il sito web sar formato da due pagine: lhomepage iniziale e una pagina che, attraverso un
apposito script PHP, mostrer gli argomenti e i file della materia selezionata dal men a tendina (il
quale si apre cliccando sullhamburger button in alto a sinistra e scorrendo da sinistra). Tutte e due
le pagine hanno un hamburger button in alto a sinistra, il mio nome ed un logo in alto a destra. La
pagina iniziale avr inoltre un titolo ed un sottotitolo al centro con scritto rispettivamente il mio
nome, e la classe e la scuola che frequento; sotto ci, ci sar un blocco di testo nel quale descrivo a
grandi linee chi sono, la scuola ed il sito web. La pagina delle materie, oltre agli elementi comuni,
avr una lista interattiva a sinistra nella quale ci saranno i nomi dei capitoli e gli argomenti trattati
della materia selezionata (il quale nome verr mostrato con una label proprio sopra la lista in
questione), e per ogni argomento il materiale usato o prodotto; al centro della pagina verr
collocato un plug-in per la lettura dei file PDF (PDF reader), attraverso il quale si potranno leggere i
vari documenti caricati grazie a uno script PHP.

Seguono i mockup:

Figura 1 - Homepage

Andrea Altomare 5A | Progetto Sito Web 12


I.T.I.S. G. Marconi - Jesi

Figura 2 - Homepage con men aperto

Figura 3 - Pagina per le materie

Andrea Altomare 5A | Progetto Sito Web 13


I.T.I.S. G. Marconi - Jesi

PROGETTAZIONE DATABASE
Per lorganizzazione dei contenuti nel sito web si pensato alla possibilit di realizzare un
database in modo da averne una gestione pi efficace. Tuttavia, al momento non ne ritengo
necessaria la progettazione n la realizzazione poich, dovendo gestire un numero piuttosto
ristretto di file (e non una grande quantit di dati riguardanti utenti, gallerie fotografiche, ecc...),
sono arrivato alla conclusione che il sistema pi semplice e veloce per adempire a questo compito
e per mostrare i materiali richiesti sia quello di utilizzare opportuni script PHP.

CONCLUSIONI
Il controllo durante tutta la fase di realizzazione verr effettuato da me e dai docenti, i quali
supervisioneranno lo svolgimento dei lavori e daranno consigli sui modi attraverso i quali si possa
migliorare il prodotto finale. Il sito web verr consegnato agli insegnanti a lavori ultimati, dopo
essere stato opportunamente testato (per verificarne il corretto funzionamento in ogni sua parte),
infine verr mostrato e brevemente presentato alla commissione durante la fase orale della
maturit.

Dopo lesame, se possibile e se permesso dal servizio di hosting, rimarr online per eventuali
fruizioni e consultazioni future.

Andrea Altomare 5A | Progetto Sito Web 14

Potrebbero piacerti anche