Progettazione, descrizione Logica

Le estensioni UML per la modellazione di Applicazioni Web consentono la definizione di nuovi componenti:

• Pagine Client; • Pagine Server; • Form;

• Associazioni tra le pagine. 3.3.1 Interfaccia Utente

Si introduce il concetto di User Experience model (o modello UX), questo aspetto viene usato per descrivere il gruppo e le attività degli specialisti

43

responsabili del mantenimento della consistenza dell’interfaccia utente con i paradigmi correntemente usati e, cosa più importante, di garantire che l’interfaccia sia appropriata per il contesto nel quale il sistema dovrà operare.

Il gruppo UX è responsabile della definizione del look-and-feel dell’applicazione, della determinazione dei percorsi di navigazione dell’applicazione e della gestione/organizzazione della struttura del contenuto delle pagine.

Alcuni degli elaborati prodotti dal gruppo UX sono:

• Schermate e descrizione dei conenuti; • Storyboard associati agli scenari;

• Percorsi di navigazione tra le schermate.

Gli aspetti di presentazione grafica non sono di interesse e non verranno approfonditi. Nella sezione successiva verranno descritti gli aspetti di notazione UML per la rappresentazione di Form, Pagine Cient e Pagine Server.

3.3.2 Vista Logica

La vista logica di un diagramma UML consiste principalmente in classi, relazioni e collaborazioni. Per le classi stereotipate si userà la notazione con l’icona in alto a destra della classe. L’estensione WAE definisce tre stereotipi primari per le classi e alcuni stereotipi per le associazioni. La progettazione di questa fase è di competenza del gruppo di ingegnerizzazione.

Server page

Una pagina server rappresenta una pagina Web che ha contenuti costruiti dal server ad ogni richiesta. Tipicamente, una pagina server contiene script eseguiti dal server che interagisce con risorse lato server come basi di dati, logica di business e sistemi esterni. Le operazioni dell’oggetto rappresentano le variabili che sono visibili nella pagina (accessibili a tutte le funzioni nella pagina).

44

Figura 40: Notazione per Pagina Server

Client Page

Un’istanza di una pagina client è una pagina Web formattata in HTML ed un misto di dati, presentazione e persino logica applicativa. Le pagine client sono visualizzate dai browser client e possono contenere script che sono interpretati dal browser. Le funzioni della pagina client corrispondono a funzioni nelle etichette di script nella pagina. Gli attributi della pagina client corrispondono a variabili dichiarate nelle etichette di script della pagina e sono accessibili da qualsiasi funzione nella pagina (visibilità a livello di pagina). Le pagine client possono avere associazioni con altre pagine client o server.

Figura 41: Notazione per la Pagina Client

Form HTML

Una classe stereotipata come <<form>> è un insieme di campi di input che sono parte di una pagina client. Una classe form corrisponde direttamente al tag <<form>> di HTML. Gli attributi di questa classe rappresentano i campi di input per un modulo HTML (input box, text area, radio button, check box e hidden field).

Una <<form>> non ha operazioni, poiché non è possibile incapsulare operazioni in un modulo. Qualunque operazione che interagisce con il modulo è proprietà della pagina che contiene il modulo, nel caso in esame la pagina che contiene il form.

45

Stereotipi per le associazioni

Nella tabella seguente si elencano i principali stereotipi per le associazioni tra elementi WAE con la descrizione del loro utilizzo.

Stereotipo Descrizione

<<link>>

Relazione tra una pagina client e una risorsa lato server, o una pagina Web. La destinazione può essere una classe associata a una pagina client o a una pagina server. L’associazione <<link>> è un’astrazione dell’elemento ancora di HTML. Per questo tipo di associazione stereotipata è definito un importante valore etichetta: parameters. Questo valore contiene i parametri passati con la richiesta HTTP; è formattato come stringa e può utilizzare una codifica legata alla specifica implementazione.

<<build>>

Relazione direzionale fra una pagina server e una pagina client. Questa relazione identifica l’output HTML dell’esecuzione di una pagina server.

<<submit>>

Relazione direzionale tra un modulo <<HTML form>> e una pagina server. E’ simile ad una relazione <<link>> e referenzia una risorsa lato server. Quando la risorsa viene richiesta al server, tutti i valori degli attributi associati ai campi del modulo sono inviati insieme alla richiesta per essere successivamente elaborati.

<<redirect>>

Relazione direzionale fra una pagina client o server e un’altra pagina. Questo tipo di associazione indica un comando inviato al client affinché richieda un’altra risorsa.

<<forward>>

Relazione direzionale fra una pagina server e un’altra pagina server o client. L’associazione rappresenta la delega dell’elaborazione di una richiesta del client per una risorsa a un’altra pagina server.

<<object>>

Relazione di contenimento tra una pagina client e un’altra classe della vista logica, tipicamente una classe che rappresenta un’applet, un java script ecc. Questa associazione rappresenta un’astrazione di elementi HTML

46

Stereotipo Descrizione

come <object> o <script>

<<include>>

Associazione direzionale fra una pagina server e un’altra classe <<Server Page>> o <<Client Page>>. Durante la costruzione della pagina a tempo di esecuzione, questa associazione indica che la pagina inclusa viene elaborata, se di tipo dinamico, e che i suoi contenuti o risultati vengono utilizzati dalla classe contenitore o classe padre.

47