Documento di Progettazione · termini di inserimento, aggiornamento, ricerca e cancellazione delle...

Corso di Ingegneria del Software A.A. 2016 – 2017

Docente: Prof. Agostino Cortesi

PandaCode

851777 - Martina Lunardi

852056 – Claudia Farronato

Data: 01/05/2017

Documento di Progettazione

Sommario

I. INTRODUZIONE ............................................................................................... 3

SCOPO DEL DOCUMENTO

STRUTTURA DEL DOCUMENTO

II. GLOSSARIO ......................................................................................................... 4

III. STRUTTURA DEL SISTEMA ............................................................................. 4

IV. MODELLO DI CONTROLLO ........................................................................... 5

V. DIAGRAMMA DELLE CLASSI .......................................................................... 6

VI. DIAGRAMMI DELLE ATTIVITÀ ...................................................................... 7

LOGIN PER ACCEDERE ALLE FUNZIONALITA’ PER UTENTI REGISTRATI RICERCA PUNTI DI INTERESSE

INSERIMENTO DI FOTO RELATIVE AD UN PUNTO DI INTERESSE

INSERIMENTO DI RECENSIONI RELATIVI AD UN PUNTO DI INTERESSE

AGGIUNTA DI UN LUOGO AI PREFERITI

RIMOZIONE DI UN LUOGO DAI PREFERITI

VII. DIAGRAMMI DI SEQUENZA .......................................................................... 11

LOGIN PER ACCEDERE ALLE FUNZIONALITA’ PER UTENTI REGISTRATI

RICERCA PUNTI DI INTERESSE

INSERIMENTO DI FOTO E RECENSIONI RELATIVI AD UN PUNTO DI INTERESSE

AGGIUNTA DI UN LUOGO AI PREFERITI RIMOZIONE DI UN LUOGO DAI PREFERITI

VIII. INTERFACCIA GRAFICA ................................................................................. 14

COLORI

ICONE

PULSANTI

PRIMO AVVIO PRIMO ACCESSO

HOME

PUNTO DI INTERESSE SELEZIONATO

VISUALIZZAZIONE DELLE OPZIONI RELATIVE AL PUNTO SELEZIONATO

AGGIUNTA AI PREFERITI

AGGIUNTA DI UNA RECENSIONE

AGGIUNTA DI FOTO MENÙ UTENTE REGISTRATO

MENÙ UTENTE NON REGISTRATO

HELP

INFO & CREDITS

DOCUMENTO DI PROGETTAZIONE - MAY 2017 3

INTRODUZIONE SCOPO DEL DOCUMENTO Lo scopo di questo documento è l’illustrazione degli aspetti che riguardano l’implementazione dell’applicazione BarbeCrew, mostrando in modo approfondito la strutturazione del nostro sistema.

STRUTTURA DEL DOCUMENTO Il documento presente è suddiviso nelle seguenti parti:

• Struttura del sistema: in questa sezione mostreremo come è strutturato il sistema, evidenziando la suddivisione in sottosistemi e facendo vedere come essi comunicano fra loro.

• Modello di controllo: lo scopo di questo paragrafo è l’illustrazione del modello di controllo scelto per stabilire le relazioni che intercorrono tra i sottosistemi individuati.

• Diagramma delle classi: si tratta di una sezione finalizzata a descrivere le entità che costituiscono il sistema e le loro relazioni, mostrando altresì le varie operazioni effettuabili.

• Diagramma delle attività: in questo punto verranno definite le attività che è necessario compiere in modo da poter mettere in atto le funzionalità offerte dall’applicazione.

• Diagramma di sequenza: qui verranno mostrate, in relazione alle varie attività descritte, le chiamate a funzione.

• Interfaccia grafica: questa sezione illustrerà i prototipi dell’interfaccia grafica destinata, mostrandone gli schemi più importanti.


GLOSSARIO Presentiamo di seguito un elenco dettagliato di termini di uso tecnico utilizzati nel documento, utile a garantire la comprensione del testo da parte di qualsiasi tipo di utente:

• Android: è un sistema operativo per dispositivi mobili sviluppato da Google Inc. e basato sul kernel Linux. Non è da considerarsi, tuttavia, propriamente un sistema unix-like o una distribuzione GNU/Linux, dal momento che la quasi totalità delle utilità GNU è sostituita da software in Java.

• App: dicitura abbreviata per indicare un'applicazione software, sia ludica che di utilità, per dispositivi mobili quali smartphone, palmari e tablet.

• Client: Programma o parte di un programma che permette di scambiare dati con un server. • Database: collezione di dati non omogenei ma tra loro correlati, utilizzati per rappresentare una

porzione del mondo reale. I dati sono strutturati in modo tale da consentire la loro gestione in termini di inserimento, aggiornamento, ricerca e cancellazione delle informazioni.

• Flat Design: letteralmente “design piatto”, si tratta di una tipologia di design semplice, talvolta minimale, che non utilizza effetti tridimensionali.

• Material Design: design sviluppato da Google e caratterizzato da regole di progettazione concentrate su un grande uso di layout basati su una griglia, animazioni e transizioni ed effetti di profondità come l'illuminazione e le ombre.

• pop-up: sono degli elementi dell'interfaccia grafica, quali finestre o riquadri, che compaiono automaticamente durante l'uso di un'applicazione ed in determinate situazioni, per attirare l'attenzione dell'utente.

• Query: interrogazione di un database per estrarre o aggiornare i dati che soddisfano un certo criterio di ricerca.

• Utente: è la persona fisica che fa uso dell’applicazione.

STRUTTURA DEL SISTEMA L’applicazione sarà strutturata secondo il modello Client-Server. Sarà provvista di un database, necessario per la raccolta e al trattamento di tutti i dati che caratterizzeranno i punti d’interesse considerati. In questa configurazione di sistema, il client ha il compito di richiedere al server i dati per mezzo di query determinate. Il sottosistema client, inoltre, sarà suddiviso in tre sottoclassi: la prima sarà dedicata alla visualizzazione dei dati in maniera ordinata, la seconda servirà ad inviare richieste specifiche di dati al server, mentre l’ultima avrà lo scopo di ricevere i pacchetti di dati da parte del server.


MODELLO DI CONTROLLO Il modello di controllo che utilizzeremo è il call-return model a struttura centralizzata, caratterizzato dall’esistenza di un sottosistema avente controllo globale sugli altri sottosistemi. Si tratta di un modello gerarchico gestito secondo una struttura top-down. Tale scelta è dovuta al fatto che la nostra applicazione sarà sviluppata in modo sequenziale.

Figura 1. Rappresentazione modello call-return


DIAGRAMMA DELLE CLASSI Di seguito presentiamo il diagramma delle classi riferito all’utenza registrata:

UTENTI Questa classe raccoglie i dati relativi agli utenti che effettuano la registrazione con un account Facebook o Google+. È inoltre possibile visualizzare e rimuovere i luoghi preferiti.

PUNTI DI INTERESSE La classe contiene informazioni relative ai punti di interesse, contraddistinti dall’attributo categoria, a cui l’utente accede effettuando una ricerca. Comprende inoltre le operazioni di visualizzazione di foto, commenti, e indicazioni stradali. Il metodo set luogo preferito permette di aggiungere il luogo alla lista dei preferiti.

RICERCA La classe permette all’utente di ricercare un luogo nella mappa specificando il nome. FOTO e RECENSIONI Le classi permettono di aggiungere foto e recensioni ai punti di interesse specificati.


DIAGRAMMI DELLE ATTIVITÀ In questa sezione vengono mostrati i diagrammi di attività relativi all’applicazione.

LOGIN PER ACCEDERE ALLE FUNZIONALITA’ PER UTENTI REGISTRATI



INSERIMENTO DI FOTO RELATIVE AD UN PUNTO DI INTERESSE


INSERIMENTO DI RECENSIONI RELATIVI AD UN PUNTO DI INTERESSE



DIAGRAMMI DI SEQUENZA LOGIN PER ACCEDERE ALLE FUNZIONALITA’ PER UTENTI REGISTRATI



INSERIMENTO DI FOTO E RECENSIONI RELATIVI AD UN PUNTO DI INTERESSE


INTERFACCIA GRAFICA


L’interfaccia grafica di BarbeCrew è stata realizzata applicando elementi di material e flat design. Per il logo è stato utilizzato prevalentemente il colore arancio chiaro riferimento al fuoco del barbecue dell’immaginario comune.

Di seguito viene presentato il logo di BarbeCrew che ci accompagna durante le fasi di avvio dell’applicazione, di registrazione all’applicazione e nel menù. I tre simboli sono la rappresentazione delle tre tipologie di punti di interesse che possiamo ricercare grazie all’applicazione, ovvero BBQ, campeggi e aree picnic.

Logo dell’applicazione


COLORI

È il colore dominante principale presente nell’applicazione, dello stesso colore anche i pulsanti e la grafica coordinata. Colore primario e primario scuro dell’applicazione.

Colore utilizzato per i pulsanti disattivati o già usati (after tap).

Colore di background dell’applicazione.

Colore utilizzato per simboli, pulsanti, icone e testi su sfondo scuro.

ICONE

Icona realizzata in stile Material e Flat Design, viene utilizzata per segnalare nella mappa i BBQ presenti.

Icona realizzata in stile Material e Flat Design, viene utilizzata per segnalare nella mappa i campeggi presenti.


Icona realizzata in stile Material e Flat Design, viene utilizzata per segnalare nella mappa le aree picnic presenti.

PULSANTI

Il pulsante contrassegnato da una matita e visibile nella schermata che permette la visualizzazione delle operazioni relative al punto d’interesse selezionato e consente la visualizzazione di un pop-up per l’aggiunta di una recensione.

Il pulsante con il simbolo della macchina fotografica , visibile nella schermata che permette la visualizzazione delle operazioni relative al punto d’interesse selezionato e nella gallery, consente l’aggiunta di una foto dal dispositivo.


Il pulsante con la spunta, visibile nel pop-up di inserimento di una recensione o di aggiunta ai preferiti permette rispettivamente di confermare l’aggiunta di una recensione e di confermare l’aggiunta del luogo tra i preferiti con conseguente chiusura del pop-up e ritorno e ritorno alla pagina del punto.

Il pulsante con la ‘X’, visibile nella lista dei luoghi preferiti accessibile dal menu utente registrato, consente di rimuovere un luogo dalla lista.

Questo pulsante raffigurante una stella, visibile nella schermata che consente la visualizzazione delle operazioni relative al punto d’interesse selezionato e nella gallery, consente di accedere al pop-up per l’aggiunta del luogo alla lista dei preferiti..

Il seguente pulsante indica che il punto di interesse è già stato inserito nella lista dei luoghi preferiti.


PRIMO AVVIO

L’immagine a fianco è la prima ad essere visualizzata dopo aver avviato l’applicazione.


PRIMO ACCESSO

Dopo l’avvio viene visualizzata la schermata per effettuare l’accesso come utente registrato o come ospite. Viene visualizzata anche per eseguire il Login da menù utente non registrato o il Logout da menù utente registrato.


HOME

In queste immagini viene rappresenta la schermata di “home”. Se l’utente acconsente all’app di usare la sua posizione, viene visualizzato l’indicatore della posizione nella mappa, altrimenti viene solo visualizzata la mappa centrata sul veneto.

Vengono inoltre visualizzate le diverse icone differenziate per tipologia di punto di interesse (BBQ, picnic e campeggi).

La barra di ricerca permette di digitare il nome di un luogo e visualizzare i punti di interesse presenti.


PUNTO DI INTERESSE SELEZIONATO

Toccando il punto interessato vengono visualizzate le informazioni principali, il bottone per accedere alla pagina relativa ai punti e le icone di navigazione di Google che permettono di calcolare il percorso per arrivare alla destinazione prescelta.


VISUALIZZAZIONE DELLE OPZIONI RELATIVE AL PUNTO SELEZIONATO

In questa pagina, accessibile premendo il bottone “visualizza” dalla schermata relative al punto di interesse selezionato, le icone color arancio rendono possibili le operazioni di:

• Aggiunta di un luogo ai preferiti • Aggiunta di foto • Aggiunta di recensioni

Questi tasti sono abilitati solo se l’utente ha effettuato la registrazione, in caso contrario verrà visualizzato un messaggio di errore.


AGGIUNTA AI PREFERITI

È possibile aggiungere un punto di interesse ai preferiti rinominandolo qualora esso non avesse un nome. Quando viene aggiunto il pulsante relativo cambia tema per segnalare che il punto è già presente tra i preferiti.

I luoghi contrassegnati come preferiti sono visualizzabili nella sezione “Preferiti” dal menù dell’utente registrato come nella schermata sottostante. Se si effettua un singolo tap sul nome del luogo presente nella lista si viene reindirizzati alla pagina corrispondente. È possibile rimuovere un preferito semplicemente premendo la ‘x’ di fianco al punto.


AGGIUNTA DI UNA RECENSIONE

Il pop-up afianco è visualizzabile premendo il pulsante contrassegnato dalla matita accessibile dalla schermata relative al punto di interesse selezionato e permette di aggiungere una recensione . La pagina in seguito viene ricaricata e la recensione inserita viene visualizzato nello slider dedicato alle recensioni, se non sono presenti recensioni lo slider non viene visualizzato.


AGGIUNTA DI FOTO

L’aggiunta di foto comporta la visualizzazione della sezione “gallery”, progettata in modo tale da permettere all’utente la visualizzazione di tutte le foto presenti come nella schermata sottostante. Anche da questa sezione è possibile aggiungere foto.


MENÙ UTENTE REGISTRATO

Di fianco viene proposta la composizione del menù dedicata all’utente registrato. Il menù è accessibile mediante singolo tap nella sezione “≡” presente nella toolbar.


MENÙ UTENTE NON REGISTRATO

Di fianco la composizione del menù per utenti non registrati.


HELP

Nella seguente schermata è presente una breve guida al significato delle tre principali icone di identificazione dei punti. A destra di ogni icona è riportata la sua descrizione.


INFO & CREDITS

Questa schermata viene resadisponibile dalla sezione info del menu utente. Essa contiene informazioni riguardo il nome dell’app, la versione e il gruppo di sviluppatori. Premendo il pulsante Credits viene visualizzata la schermata sottostante contentente i riconosciementi riguardanti gli autori dell’applicazione.

Documento di Progettazione · termini di inserimento, aggiornamento, ricerca e cancellazione delle...

Documents

Transcript of Documento di Progettazione · termini di inserimento, aggiornamento, ricerca e cancellazione delle...