Diese Präsentation wurde erfolgreich gemeldet.
Die SlideShare-Präsentation wird heruntergeladen. ×

Web Engineering L7: Sequence Diagrams and Design Decisions (7/8)

Anzeige
Anzeige
Anzeige
Anzeige
Anzeige
Anzeige
Anzeige
Anzeige
Anzeige
Anzeige
Anzeige
Anzeige
Wird geladen in …3
×

Hier ansehen

1 von 54 Anzeige

Web Engineering L7: Sequence Diagrams and Design Decisions (7/8)

Herunterladen, um offline zu lesen

This lecture covers Sequence diagrams and Design decision models. It covers:
- sequence diagrams in UML 2.x
- the QOC model for design decisions

The output of this course consists in a list of artifacts and principles to be used when engineering Web applications. They are listed at https://trello.com/b/z49P8z3b

This lecture covers Sequence diagrams and Design decision models. It covers:
- sequence diagrams in UML 2.x
- the QOC model for design decisions

The output of this course consists in a list of artifacts and principles to be used when engineering Web applications. They are listed at https://trello.com/b/z49P8z3b

Anzeige
Anzeige

Weitere Verwandte Inhalte

Ähnlich wie Web Engineering L7: Sequence Diagrams and Design Decisions (7/8) (20)

Weitere von Henry Muccini (20)

Anzeige

Aktuellste (20)

Web Engineering L7: Sequence Diagrams and Design Decisions (7/8)

  1. 1. Progettazione di Applicazioni Web corso del Master in Web Technology a.a. 2017-2018 https://app.schoology.com/course/1511186315/ Henry Muccini Università degli Studi dell’Aquila 7. Web Architecture Design with Sequence Diagrams
  2. 2. MWT– Progettazione di Applicazioni Web Henry Muccini 2 Copyright Notice Il materiale riportato in queste slide puo’ essere riutilizzato, parziale o totalmente, a patto che le fonti e gli autori vengano citati Henry Muccini
  3. 3. MWT– Progettazione di Applicazioni Web Henry Muccini 3 Progettazione .web contents modeling [dati e contenuti] .architecture modeling + tecnologies .component diagrams .sequence diagrams .user centered design .API description modeling .design decisions .UX modeling
  4. 4. Discussione Esempio Prenotazione – parte II
  5. 5. MWT– Progettazione di Applicazioni Web Henry Muccini 5 Flaiano_Lucioli (voti: 2) Scenari 1. l’utente scrive il tipo di lavorazione necessaria 2. la carrozzeria definisce il tempo di servizio 3. L’utente puo’ prenotare 4. Cancellazione: in qualsiasi momento Scenario non app: 1. di persona 2. Associato ad un ID App: • Servizi base, lista prenotazione, cancellazione • Nota: richieste diverse per servizi diversi. • Nota: integrazione con sistemi esistenti Costo: • 15.000 • 30gg/40 gg (senza e con grafico dedicato) • 2 persone in parallelo (full time) Pitch  Scalabilita’ e servizi
  6. 6. MWT– Progettazione di Applicazioni Web Henry Muccini 6 Critical Path, Contenuti, Architettura SA:  SA client-server: server, app mobile  Php, Laravel, Ionic Tool:  Trello, slack, bitbucket Critical Path:  Divisione netta tra sviluppo server ed app, con punti di sincronizzazione  Documentazione preparata in digitale, in quanto in distribuito  Mettete in evidenza le attivita’ potenzialmente «critiche»
  7. 7. MWT– Progettazione di Applicazioni Web Henry Muccini 7
  8. 8. MWT– Progettazione di Applicazioni Web Henry Muccini 8 Corsetti_DiSilvio Sistema di prenotazione unico Selezione del tipo di servizio Diff: mancanza di pre-prenotazione Costi:  96 gg (ma hanno linearizzato)  Costi?? Pitch • Prenotazione istantanea (senza pre-approvazione) • Multi-piattaforma
  9. 9. MWT– Progettazione di Applicazioni Web Henry Muccini 9 Critical Path, Contenuti, Architettura Path:Tempi rivalutati: 60 gg 10.000 euro di costo Critical Path:  I due team member lavorano in modo interscambiale, con relativi pro e contro  Manca informazione sui punti di sincronizzazione tra i task  Mettete in evidenza le attivita’ potenzialmente «critiche»  Documentazione preparata in cartaceo, in quanto il team e’ locale ed i team member lavorano insieme Architettura: UI (web ed app), Server, external system, DB
  10. 10. MWT– Progettazione di Applicazioni Web Henry Muccini 10
  11. 11. MWT– Progettazione di Applicazioni Web Henry Muccini 11
  12. 12. MWT– Progettazione di Applicazioni Web Henry Muccini 12 De Toma_Filippone (voti: 5) Logica come Corsetti_DiSilvio Diff: Applicazione Web (per non installare nulla) • Notifiche via email Costi: • 30 gg totali con consegna dopo due settimane • 8.000 Pitch • Tempi di sviluppo • Semplicita’ d’uso
  13. 13. MWT– Progettazione di Applicazioni Web Henry Muccini 13 Critical Path, Contenuti, Architettura Critital Path:  5 attivita’ principali  Identificazione dei giorni di sviluppo  Nota: fornire subito al cliente qualcosa concreto da valutare SA: disegno
  14. 14. MWT– Progettazione di Applicazioni Web Henry Muccini 14 Berardi_Felipe_MastroGiuseppe Soluzione mista, rispetto alle altre • No mobile – solo web • Servizio SMS ed email • No login • Pre-prenotazione automatico • Stima tempi di servizio carrozzeria e vendita Esposizione troppo lenta Servizi esterni: • SMS • Hosting • Internet • Grafico Costi ?? Pitch • Usabilita’ • Efficienza
  15. 15. MWT– Progettazione di Applicazioni Web Henry Muccini 15 Critical Path, Contenuti, Architettura SA  Client-server  Gestione SMS Costi/tempo:  25 gg  7000 euro Gestione dei Ritardi  Logica molto/troppo elaborata per un sistema del genere
  16. 16. MWT– Progettazione di Applicazioni Web Henry Muccini 16
  17. 17. MWT– Progettazione di Applicazioni Web Henry Muccini 17 Nespoli (voti: 1) Elementi salienti:  Sito Web  Servizio base  Email ed SMS  Costi:  40+5 gg  Diff: 45 euro/mese  2.200 euro + 200 annui di manutenzione  Servizi Avanzati  App  Suggerimento orari e giorni  Riaccompagnamento a casa, auto sostitutiva Vincoli cliente  Sistema informatico adeguato, etc etc Pitch: • Semplicita’ • Cio’ che realmente serve
  18. 18. Sequence Diagrams
  19. 19. MWT– Progettazione di Applicazioni Web Henry Muccini 19 Sequence Diagram Enfatizza l’ordine temporale dei messaggi, cioè come i messaggi sono inviati e ricevuti tra gli oggetti durante il tempo Particolarmente adatto per la modellazione di sistemi real-time e per la descrizione del flusso di eventi degli use case
  20. 20. MWT– Progettazione di Applicazioni Web Henry Muccini 20 Messaggi Sono presenti in tutti i diagrammi dinamici (sequence, collaboration, state e activity) Rappresentano la comunicazione tra oggetti Sono rappresentati tramite una linea con una freccia che va dall’oggetto che invia il messaggio (sender) all’oggetto che lo riceve (receiver) Differenti tipi di freccia indicano differenti tipi di messaggi
  21. 21. MWT– Progettazione di Applicazioni Web Henry Muccini 21 Tipi messaggi Linea continua con freccia chiusa piena  Indica una chiamata di un’operazione o di un altro flusso di controllo annidato  Se c’è un flusso di controllo annidato, il controllo passa al chiamante dopo che è terminata l’esecuzione del flusso annidato (chiamata sincrona) Linea continua con Freccia aperta  Indica una comunicazione asincrona, non c’è flusso di controllo annidato  Sender invia lo stimolo e continua immediatamente con il prossimo passo nell’esecuzione Linea tratteggiata con Freccia aperta  Indica il ritorno da una chiamata di un’operazione  Può essere omessa In UML 2.0 sono stati introdotti altri tipi di messaggi, descritti nel seguito
  22. 22. MWT– Progettazione di Applicazioni Web Henry Muccini 22
  23. 23. MWT– Progettazione di Applicazioni Web Henry Muccini 23
  24. 24. MWT– Progettazione di Applicazioni Web Henry Muccini 24 Combined Fragment (CF) Questo concetto permette di suddividere un Sequence Diagram in piu’ “frammenti” e di combinare tali frammenti, seguendo diverse regole Alcuni operatori (gli “InteractionOperator”) definiscono come tali frammenti possono essere combinati insieme Nel seguito, descriviamo tali operatori
  25. 25. MWT– Progettazione di Applicazioni Web Henry Muccini 25
  26. 26. MWT– Progettazione di Applicazioni Web Henry Muccini 26 CF “Alternatives” Operatore: Alt Significato: – rappresenta una scelta – Solo una alternativa puo’ essere selezionata – Uso di “guardie”
  27. 27. MWT– Progettazione di Applicazioni Web Henry Muccini 27 Alternatives
  28. 28. MWT– Progettazione di Applicazioni Web Henry Muccini 28 CF “Option” Operatore: Opt Significato: – Questa frammento e’ opzionale (nulla o tutto)
  29. 29. MWT– Progettazione di Applicazioni Web Henry Muccini 29 CF “Parallel” » Operatore: par » Significato: > I vari frammenti possono essere interleaved > l’ordine imposto da ciascun frammento deve pero’ essere rispettato
  30. 30. MWT– Progettazione di Applicazioni Web Henry Muccini 30 CF “Weak Sequencing” Operatore: seq Significato: – rappresenta una variazione al “par” dove: • L’ordine di esecuzione degli eventi in ciascun frammento viene preservato • eventi in frammenti diversi e lifeline diverse, possono occorrere in qualsiasi ordine • eventi in frammenti diversi e stessa lifeline sono ordinati in modo tale da preservare l’ordine • Fare esempio
  31. 31. MWT– Progettazione di Applicazioni Web Henry Muccini 31 seq
  32. 32. MWT– Progettazione di Applicazioni Web Henry Muccini 32 CF “Negative” Operatore: neg Significato: – rappresenta delle tracce da considerare invalide – Esempio
  33. 33. MWT– Progettazione di Applicazioni Web Henry Muccini 33 CF “Critical Region” Operatore: critical Significato: – rappresenta una “regione critica” – le tracce all’interno della regione critica non possono essere interleaved – la regione e’ trattata atomicamente
  34. 34. MWT– Progettazione di Applicazioni Web Henry Muccini 34 Critical Region
  35. 35. MWT– Progettazione di Applicazioni Web Henry Muccini 38 CF “Loop” Operatore: loop Significato: – il frammento deve essere ripetuto piu’ volte – una guardia o una espressione booleana esprimono il numero di ripetizioni
  36. 36. MWT– Progettazione di Applicazioni Web Henry Muccini 39 Interaction Occurence » Operatore: ref » Significato: > permette di richiamare, all’interno di un SD, altri SD > permette una maggior separation of concern, lasciando all’esterno del SD quella porzione utilizzata in piu’ SD
  37. 37. MWT– Progettazione di Applicazioni Web Henry Muccini 41 Stato Ad un lifeline, puo’ essere associato uno “stato” Lo stato viene valutato: – Se e’ verificato, allora possiamo continuare ad eseguire il SD – altrimenti, il SD non puo’ essere verificato.
  38. 38. MWT– Progettazione di Applicazioni Web Henry Muccini 42 Transition Time Viene utilizzato per esprimere vincoli temporali sul tempo di esecuzione dei messaggi Espresso tramite constraints In genere si trovano alla sinistra dei messaggi
  39. 39. MWT– Progettazione di Applicazioni Web Henry Muccini 43 SD con concetti di timing
  40. 40. Design Decisions
  41. 41. MWT– Progettazione di Applicazioni Web Henry Muccini 45
  42. 42. MWT– Progettazione di Applicazioni Web Henry Muccini 46 Giorno 2: Diverge (conflicting ideas) Our goal is to explore as many possibilities as possible, regardless of how realistic, feasible or viable they may or may not be. From this explosion of opportunity comes insights made when considering the implications of radically different perspectives on and approaches to solving a problem. These insights can become valuable differentiating forces and the source of unique solution inspiration. Also, once we begin eliminating as many of these options as possible we are given reason to be more confident in the options we do move forward with because we have explored so many alternatives.
  43. 43. MWT– Progettazione di Applicazioni Web Henry Muccini 47 From The product design sprint: diverge (day 2) 1.Hand out blank sheets of paper and Sharpies to all participants. 2.Set the timer for 10 minutes. 3.Have everyone write down or draw everything in that they are thinking about. Keep the format free so that people feel comfortable to explore any and all ideas.
  44. 44. MWT– Progettazione di Applicazioni Web Henry Muccini 48 Picture taken from http://apprentiperpetuel.blogspot.com.au/
  45. 45. MWT– Progettazione di Applicazioni Web Henry Muccini 49 Taking (design) decisions Design problem sub- problem (or issue) sub- problem (or issue) Design option Design option Design option Design option Problem space Solution space Alternative solutions Alternative solutions Decision = best option Decision = best option Best, with respect to some criterion
  46. 46. MWT– Progettazione di Applicazioni Web Henry Muccini 50 Design space The space of possible designs that could be achieved by choosing different sets of alternatives. thin-client rich-client web browser based custom client program client style fat-client layered peer-to-peer architecture style client-server peer clients structured p2p unstructured p2p hybrid p2p tiered ...
  47. 47. MWT– Progettazione di Applicazioni Web Henry Muccini 51 3 main components 1- a design issue/problem to solve 2- a list of alternative solutions 3- a list of concerns to be maximized
  48. 48. MWT– Progettazione di Applicazioni Web Henry Muccini 52 QOC notation QOC3 Which technology should be used by the user to communicate locally with the devices which are located at home?
  49. 49. MWT– Progettazione di Applicazioni Web Henry Muccini 53 QOC Template (Open the Excel File)
  50. 50. MWT– Progettazione di Applicazioni Web Henry Muccini 54 ADD challenges Dependencies among decisions Granularity of design decisions Collaborative ADD Evolving ADD
  51. 51. MWT– Progettazione di Applicazioni Web Henry Muccini 55 DI1. How many gateways can we place? Single Gateway 1 Gateway per floor 1 Gateway per apartment CostReliability Availability DI2. how the sensors are connected? Wired Wireless Wi- Fi Wireless ZigBee Installation Performance Availability Which device can the Firefighter Use? Wearable sensor Mobile-Wi-Fi Enables decision Best way to get a city map for the truck manager Online map Local offline GPS device Enables decision Reliability Performance Availability DI3.How should data be broadcasted Using gateways Directly through sensors Cost Reliability Availability Enables question Dependencies…
  52. 52. MWT– Progettazione di Applicazioni Web Henry Muccini 56 Dependencies… Are of various types: • Excludes • Requires • Depends On • Subsumes • Enables • … Con#1: Which kind of technology is used for node-to-node communication?  Con#1-Opt#1 : Bluetooth  Con#1-Opt#2 : Wi-Fi  Con#1-Opt#3: Zigbee Con#5: How the WSN infrastructure shall communicate with the trucks and central station?  Con#5-Opt#1 – 3G  Con#5-Opt#2 – GPRS  Con#5-Opt#3 – Wi-Fi
  53. 53. MWT– Progettazione di Applicazioni Web Henry Muccini 57 Granularity… ADD Question:  How the FireFighter system components shall communicate?  Which entities shall go in the DB?
  54. 54. MWT– Progettazione di Applicazioni Web Henry Muccini 58 Collaborative Decision Making

×