MGRA501.1

A flowchat, as its name indicates, is a chart describing how a system under different circumstances reacts to users status, decisions and behaviors.

Flowcharts can be useful to anyone who wants to create a flow for almost anything. For example, factories use flowcharts to tell its workers the right procedures when someone get hurts.

A flow chart is a common tool interaction designers.
It helps the designers to design the interaction flow of the product, organise and connect scattered wireframes and to make sure that the product is still friendly to users.

They should all have only one start point and at least one end point. These help the users to start an interaction flow and exit

A decision point is where users make decisions. Usually at this point, the interface is waiting for the user to choose where to go next.

Conditional branches look similar to decision points, but they both do different things.

In decision points, the decisions are always made by the users, however, the conditional branches only allows the system to choose the right branch automatically in the background.

This helps the designers in planning the flowcharts as well as it makes the reading experience much better.

Flowcharts are very important for game designing. It is complex and quite strict to making them 'inflexible' and less compatible. They are created very quickly also gives a visual reference to the structure of the game design.

A flow chart offers;
-visual documentation of the game design (levels and mission flow)
-an analysis of the objects snd their relationships

1) Picking a method, it could be formal or informal
-methods are detailed making it legible and predictable, that is ideal for the analysis in-depth and the documentation of the games design
-informal flowcharts are ideal for documentation that are less legible

2)Determination
-Flowcharts can limited by documentation of the game mechanics, architecture and horizontal slice

3)Analysis
-a designer should look for inconsistencies when analysing a flowchart, -the relationships within the design

4)Communication
-simple and technical way to communicate visually in motions of the game design, it makes it more legible to wider range of readers

HTML 5

Planning a website always includes the idea of use of flowcharts, it will not workout correctly without a flowchart

;

This was an exercise to understand of how a story is visualised, this is a non-linear narrative as the story can be jumbled up or read backwards, or even a new story can be made if the visuals were arranged differently.

We all had one or two visuals to do between the group, and this is the developed illustration

Development

Runescape is an online game, where it has all the instructions of how to play it, on the hand we have the Guardian website, where hyperlinks and navigation bars are used- this is an alternative way of giving instructions on how to use the websites, navigation bars consist in all other websites, it is a function however not a choice whether to have one on a website or not.

Tina
goes to
Tescos

The story: Its a disastrous day for Tina. (1)She waits for a bus and as the bus approaches she gets splashed by the huge puddle, Tina is soaked. She gets on to the bus and realises that she doesnt have enough money on her oyster card which she then has to pay double for her bus fare. Not long after she gets a seat, an old lady hops on the bus too and yells at Tina for not giving up her seat.
She finally reaches her destination, however she sees that there arent any trolleys left so takes two baskets instead. The two baskets are filled up and sadly heavy that she has to carry it around her around the store- she heads to the checkouts and gets informed that her debit card is on overdraft which she cannot use to buy her groceries. She then tries to shoplift noticing later that the security guard is running after her, and unluckily gets caught&arrested.

.
.
.
.
.
.

.
.
.
.
.
.

.
.
.
.
.
.

The one on the right is a flowchart of the 'The guardian' website, it has quite a lot of navigation bars that open up to other navigations, some of these choices become one, as in it has the same HTML. Blogs for example, once you open up a blog, it gives you other informations of the articles etc from other navigations.