Laboratorio internet: 4. Requisiti (parte II)

Università degli Studi di Milano Bicocca Dipartimento di Informatica, Sistemistica e Comunicazione Laboratorio di Internet / Laboratorio di progettazione (mod.1) Anno Accademico 2009-2010 LEZIONE 4: FASE 1: SPECIFICA DEI REQUISITI (Parte II) Roberto Polillo

CHE COSA FAREMO OGGI 3 4 5 6 7 Web design Visual design Sviluppo Redazione dei contenuti Pubblicazione 1 Definizione dei requisiti Documento dei requisiti Prototipo di navigazione Prototipo funzionale Prototipo editoriale Sistema on line Prototipo di comunicazione 2 Avviamento del progetto Piano di qualità Gestione del sito

Comunicazione Il sito raggiunge i suoi obiettivi di comunicazione? Accessibilità Il sito è di facile accesso per tutti? Funzionalità Le funzioni del sito sono adeguate e corrette? Gestione L’operatività del sito è ben gestita ? Il modello di qualità Contenuto Il contenuto informativo è corretto, e adeguato agli scopi del sito? Architettura La struttura e la navigazione del sito sono adeguate? Usabilità Il sito è facile da usare?

INDICE DEL DOCUMENTO Origine e scopo del documento Parte prima: Generalità Parte seconda: Requisiti

Requisiti di architettura

Requisiti di comunicazione

Requisiti funzionali

Requisiti di contenuto

Requisiti di gestione

Requisiti di accessibilità

Requisiti di usabilità

Indice del documento dei requisiti

TEMPLATE: Requisiti di archiettura

Architettura informativa

Riportare la scaletta logica dei contenuti del sito , corredata dei commenti necessari.

Definire i termini utilizzati ove necessario, o riferirsi a un glossario riportato in appendice.

SCALETTA LOGICA DEI CONTENUTI

Indica la organizzazione logica dei contenuti informativi

Serve a comunicare al Web designer in quali categorie vogliamo che i contenuti informativi siano classificati e quali sono i nomi ( labelling ) che vogliamo vengano usati per queste categorie

Ha, per un sito Web, la stessa funzione dell’indice di un libro, ma non descrive ancora la struttura del sito in pagine

Scaletta logica dei contenuti: Esempio

Esempio Usare l’outliner di Word In Office 2007: Visualizza - struttura

Esempio

Home

Chi siamo

Il DISCo

Il personale

Le attività del DISCo

L’offerta didattica

Corsi di laurea di primo livello

Corsi di laurea di secondo livello

Master universitari

Dottorato di ricerca

La ricerca

La ricerca al DISCo

I laboratori di ricerca

I progetti di ricerca

Il Dottorato di ricerca

Studenti interni

Avvisi

Guida dello studente

Corsi di Studio

Corso di laurea di primo livello in Informatica

Regolamenti e procedure

Immatricolazioni e iscrizioni

Piani di studio

Vincoli per l’accesso al II anno

Regolamento degli stage e della prova finale

Orario delle lezioni

Primo semestre

Secondo semestre

Programmi e siti web dei corsi

Esami (link al Sifa)

Stage

Calendario prossime sessioni di laurea

Corso di laurea specialistica in Informatica

<come sopra>

Modulo per domanda di tesi specialistica

Corso di laurea specialistica in Teoria e Tecnologia della Comunicazione

<come sopra>

Laboratori didattici

<il sito del laboratorio compare in altra finestra>

Orario di ricevimento docenti

Servizi agli studenti

Lingue e ECDL

Diversamente abili

Studenti stranieri/foreign students

Studiare all’estero

Docenti e personale

Regolamenti e modulistica

Documentazione

Delibere del Consiglio di Dipartimento

Delibere del Consiglio di Coordinamento Didattico

Aggiornamento pagine

Studenti esterni

Orientamento

Iscrizioni e immatricolazioni

Master

Professionisti

Eventi

Laboratori e competenze

Progetti e partners

Master

Aziende

Stage e collaborazioni

I nostri laureati

Laboratori e competenze

Progetti e partners

Master

TEMPLATE: Requisiti di archiettura

Architettura informativa

Riportare la scaletta logica dei contenuti del sito , corredata dei commenti necessari.

Definire i termini utilizzati ove necessario, o riferirsi a un glossario riportato in appendice.

Navigazione

Specificare i requisiti della struttura di navigazione e gli eventuali ausilii richiesti alla navigazione.

Se necessario indicare alcuni siti a cui ispirarsi come esempi , o riportare una gabbia schematica della home page.

Indicare se nella home page dovranno essere inserite delle scorciatoie per raggiungere altre parti del sito

STRUTTURA DI NAVIGAZIONE

Bisogna dare le linee guida per progettarla, NON progettarla fin d’ora !

Esempio logo payoff data barra di navigazione globale menu servizi standard area login area per richiesta preventivo noleggio offerte speciali banner?

Esempio

Il sito dovrà prevedere una struttura di navigazione globale, accessibile da ogni pagina, dalla quale siano sempre raggiungibili le pagine di primo livello corrispondenti alle diverse sezioni del sito, e una navigazione locale, che permetta la navigazione all’interno di ogni singola sezione.

Navigazione globale e navigazione locale dovranno sempre essere nella stessa posizione in tutte le pagine, e ciascun link non dovrà mai modificare la sua posizione durante la navigazione.

La navigazione globale dovrà preferibilmente essere disposta orizzontalmente, e la navigazione locale dovrà essere disposta verticalmente, oppure anch’essa orizzontalmente, sotto quella globale.

I nomi dei link non dovranno mai contenere abbreviazioni.

Il template richiede tre capitoli:

Identità di marca, tono e stile della

Grafica e multimedialità

Lingua e localizzazione

Identità di marca, tono e stile della comunicazione

Specificare i requisiti relativi al tono e alla strategia generale della comunicazione e alla identità di marca (marchi, slogan, tratti distintivi della marca, ecc.).

Specificare in particolare i requisiti di comunicazione della home page, eventualmente allegando bozze esemplificative o citando siti a cui ispirarsi.

Specificare lo stile comunicativo da utilizzarsi nella redazione dei contenuti.

Nel vostro caso:

Raccogliete loghi, carta intestata, brochure, poster, ecc.

Chiedete se usano slogan

Identità di marca: ESEMPIO Identità di marca della CocaCola?

Marchi e slogan: ESEMPI

Grafica e multimedialità

Specificare i requisiti relativi alla impostazione grafica del sito (eventuali standard aziendali, stile, formati video, layout fisso o liquido, requisiti di accessibilità ). Specificare eventuali requisiti relativi alla multimedialità.

Nel vostro caso, questi aspetti sono in gran parte definiti dai temi del CMS.

La cosa più importante è farsi un’idea dell’impostazione grafica della home page, e delle immagini da utilizzare

Economizzare le spazio!

Lingua e localizzazione

Specificare se il sito sarà solo in lingua italiana , o se parti del sito saranno tradotte in altre lingue. Se sì, specificare quali lingue e quali parti, motivando queste scelte.

TEMPLATE: Requisiti funzionali

Il template prevede tre capitoli:

Funzionalità

Base di dati

Sicurezza e privacy

Funzionalità

Inserire il diagramma e la descrizione dei casi d’uso , utilizzando la notazione (UML) descritta in appendice.

Quindi descrivere a parole ogni singolo caso d’uso, specificandone i passi dello scenario principali e degli scenari alternativi

Funzionalità: Casi d’uso

Un caso d’uso definisce un insieme d’interazioni finalizzate a uno scopo, fra uno o più attori e il sito. Ha un nome e una descrizione

Esempi :

 Ricerca prodotto

 Ordina prodotto

 Visualizza dati utente

 Inserisci prodotto

Modifica prodotto

Diagrammi dei casi d’uso Ricerca prodotto Ordina prodotto Visualizza dati utente Inserisci prodotto Modifica prodotto Sistema bancario Utente Gestore del negozio <sistema>

Acquista prodotto

Scenario principale:

Il cliente naviga nel catalogo e seleziona gli articoli da acquistare

Il cliente si avvia alla cassa (check out)

Il cliente fornisce le informazioni relative alla spedizione (indirizzo; scelta fra consegna in giornata o entro 3 giorni)

Il sistema presenta un prospetto con il conto totale, comprese le spese di spedizione

Il cliente riempie un modulo con le informazioni sulla carta di credito

Il sistema autorizza l’acquisto

Il sistema conferma immediatamente la vendita

Il sistema invia al cliente una email di conferma.

Scenari alternativi:

3a. Il cliente è abituale:

1. Il sistema visualizza le preferenze memorizzate riguardanti le spedizioni, il pagamento e la fattura

2. Il cliente può accettera il default o ridefinire le preferenze, in questo caso ritorna al passo 6 dello scenario principale

6°. Il sistema non autorizza l’acquisto con carta di credito:

1. Il cliente può inserire nuovamente le informazioni e riprovare oppure annullare l’acquisto

Descrizione di un caso d’uso: esempio

Nel nostro caso:

Non sviluppiamo software, ma usiamo funzioni già fornite dal CMS, o funzioni realizzate da applicazioni o widget che “montiamo” sulle nostre pagine.

Come fare?

Tipicamente, tre categorie di utenti:

Amministratore del sito: fa tutto il CMS

Redattore: fa tutto il CMS

Utente: descriviamo i casi d’uso “a grandi linee” – dicendo quale componente realizza le funzioni necessarie

Casi d’uso per l’utente finale - esempio

Registrazione al sito

Login

Donazione on-line

Sottoscrizione al bollettino

Utilizzo del social network

… .

(specificando il componente che lo realizza)

Base di dati

Inserire il modello concettuale dei dati, in forma abbozzata, utilizzando un diagramma E-R (o, se si preferisce, un diagramma delle classi UML, utilizzando la notazione introdotta in appendice)

Specificare se la base di dati esiste già, o se deve essere realizzata ex novo

Basi di dati

Dovete abbozzare lo schema concettuale della base di dati

Usate una notazione a vostra scelta per rappresentare i diagrammi entità-relazioni

Esempio: AFFERENZA DIREZIONE DIPARTIMENTO SEDE COMPOSIZIONE IMPIEGATO PROGETTO PARTECIPAZIONE Indirizzo (0,1) (0,1) (0,N) (1,N) (1,N) (1,N) (1,1) (1,1) (1,N) (0,1) Stipendio Cognome Codice Età Nome Budget Data consegna Data inizio Data afferenza Telefono Nome Città Numero civico Via CAP

Esempio: (Notazione che usa i diagrammi delle classi UML) prezzoUnitario Ordine indirizzoDiConsegna speseDiSpedizione importoTotale Cliente datiAnagrafici Articolo Catalogo ClienteRegistrato userid password CartaDiCredito 1..1 0..  0..  1 ..  0 ..  1 ..  1 ..  1..1 Effettua Riguarda Utilizza FaParteDi

Sicurezza e privacy

Specificare i requisiti di sicurezza e privacy (es. protezione da accessi non autorizzati, protezione della base dati, recupero codici di accesso smarriti, …)

Specificare come verranno trattati i dati personali .

(Sicurezza e privacy saranno gestiti dal CMS, mediante il settaggio di opportuni parametri, qui si devono solo specificare I requisiti)

TEMPLATE: Requisiti di contenuto

Facendo riferimento alla scaletta logica dei contenuti del sito già definita , descrivere i requisiti relativi ai contenuti informativi di ciascuna componente logica:

- quali informazioni dovrà contenere

- come dovranno essere espresse

- dove potranno essere reperite

Esempio

Nel vostro caso…

Il contenuto è ciò che fa la differenza per questi siti…

Far capire agli utenti (potenziali donatori/volontari/…) che cosa fa l’associazione, mostrando i risultati (immagini, video, documenti,…)

Mostrare “la faccia” delle persone dell’associazione

Creare INTERESSE, FIDUCIA, SIMPATIA

E’ bene che una persona del gruppo di dedichi fin da subito alla raccolta dei contenuti

TEMPLATE: Requisiti di gestione

Infrastruttura sistemistica del sito

Specificare l’infrastruttura hw, sw e di rete che ospiterà il sito in esercizio -> sarà tipicamente un servizio in rete

Gestione dei sistemi

Specificare come e da chi verrà gestita la infrastruttura tecnologica del sito; come e da chi verrà fornita l’assistenza tecnica; disponibilità e qualità del servizio; monitoraggio degli accessi -> normalmente non sarà necessario