{"id":104,"date":"2017-03-24T23:21:22","date_gmt":"2017-03-24T23:21:22","guid":{"rendered":"http:\/\/generic.wordpress.soton.ac.uk\/gapapp\/?p=104"},"modified":"2017-03-24T23:22:11","modified_gmt":"2017-03-24T23:22:11","slug":"navigap-uml-diagrams","status":"publish","type":"post","link":"https:\/\/generic.wordpress.soton.ac.uk\/gapapp\/2017\/03\/24\/navigap-uml-diagrams\/","title":{"rendered":"NaviGap UML diagrams"},"content":{"rendered":"

In this\u00a0part, we will talk about our development model views described in Unified Modelling Language. UML is a\u00a0language which we will apply to describe\u00a0use cases meaning the interactions of an actor (user) and a\u00a0system to achieve certain goals. This is an in-between process: after we gathered all requirements and shaped our agenda and before we actually started coding.<\/p>\n

Our app users<\/strong><\/p>\n

In previous posts, we identified our user personas. Now we can proceed and implement those personas into our interaction use cases. It helps us to identify the functionalities we want to offer to them. We don’t have to cover now the scenario of a registered or authenticated user, but we will treat as a seperate diagram.<\/p>\n

Our app\u00a0functionalities<\/strong><\/p>\n

Now we identify general functional blocks we offer for the actors (personas) aligned with activities they perform.<\/p>\n

The First Persona is identified as a novice who comes for social value and expert advice. is clearly interested in<\/p>\n

The\u00a0Second Persona is an expert who was a novice at the beginning, but after a\u00a0certain amount of contribution (posts, advice, photos etc.) became an expert (high degree of centrality) and can provide help\/advice\/guidance to novices.<\/p>\n

Finally, the Third Persona is a commercial partner type of user who is interested in business add-on value.<\/p>\n

Three iterations are needed to reach the outlined use case scope.<\/p>\n

\n
<\/a><\/div>\n<\/div>\n

Figure 1.\u00a0Use Case Diagram: NaviGap interaction<\/p>\n

At this point, we can augment the Persona 1 case by\u00a0expanding each functionality. For example, ‘Seek travel inspiration’ functionality:<\/p>\n

\n
<\/a><\/div>\n<\/div>\n

Figure 2.\u00a0Use Case Diagram: Augmented\u00a0functionality<\/p>\n

Through each augmentation iteration, we ask ourselves: is it enough? have we listed all possible functionalities that we can release? Step by\u00a0step we will augment our UML layout and add blocks to each functionality. After each functionality has a detailed list of sub-functionalities we can look at it critically and think of additional features that will give us a competitive\u00a0edge.<\/p>\n

Our app communication diagram<\/strong><\/p>\n

As an example of UML communication\u00a0diagram, we show the scenario when a user wants to login into their account. That provides a model-view-controller\u00a0perspective of interaction.<\/p>\n

\n
<\/a><\/div>\n<\/div>\n

 <\/p>\n

Figure 3. Communication Diagram: Login<\/div>\n

Our app state diagram<\/strong><\/p>\n

State diagrams can be seen as the essence of object-oriented programming (OOP)<\/a>. Those diagrams are good when we want to describe the behavior of a single object. In general, those diagrams define various states of an object during its life cycle.<\/p>\n

A state diagram represents the actual changes in state, not the particular processes\/commands creating those changes.<\/p>\n

\n
<\/a><\/div>\n<\/div>\n
Figure 4. State Diagram: Novice User object<\/div>\n

 <\/p>\n

Why we need all those diagrams?<\/strong><\/p>\n

We assume that our team should have a clear understanding how the\u00a0users interact with the App, what functionalities we are planning to offer to them and in what way they can access them. Overall, each diagram builds up a\u00a0clear understanding of what is expected from the app, what role the users and other actors play in it, and helps to shape the outline of the UI design.<\/p>\n

 <\/p>\n","protected":false},"excerpt":{"rendered":"

In this\u00a0part, we will talk about our development model views described in Unified Modelling Language. UML is a\u00a0language which we will apply to describe\u00a0use cases meaning the interactions of an actor (user) and a\u00a0system to achieve certain goals. This is an in-between process: after we gathered all requirements and shaped our agenda and before we […]<\/p>\n","protected":false},"author":2298,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[12,32,25,1],"tags":[28,37,36],"class_list":["post-104","post","type-post","status-publish","format-standard","hentry","category-app","category-development","category-ui","category-uncategorised","tag-development","tag-diagram","tag-uml"],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/generic.wordpress.soton.ac.uk\/gapapp\/wp-json\/wp\/v2\/posts\/104","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/generic.wordpress.soton.ac.uk\/gapapp\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/generic.wordpress.soton.ac.uk\/gapapp\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/generic.wordpress.soton.ac.uk\/gapapp\/wp-json\/wp\/v2\/users\/2298"}],"replies":[{"embeddable":true,"href":"https:\/\/generic.wordpress.soton.ac.uk\/gapapp\/wp-json\/wp\/v2\/comments?post=104"}],"version-history":[{"count":14,"href":"https:\/\/generic.wordpress.soton.ac.uk\/gapapp\/wp-json\/wp\/v2\/posts\/104\/revisions"}],"predecessor-version":[{"id":121,"href":"https:\/\/generic.wordpress.soton.ac.uk\/gapapp\/wp-json\/wp\/v2\/posts\/104\/revisions\/121"}],"wp:attachment":[{"href":"https:\/\/generic.wordpress.soton.ac.uk\/gapapp\/wp-json\/wp\/v2\/media?parent=104"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/generic.wordpress.soton.ac.uk\/gapapp\/wp-json\/wp\/v2\/categories?post=104"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/generic.wordpress.soton.ac.uk\/gapapp\/wp-json\/wp\/v2\/tags?post=104"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}