Classwork, Interactive Design

First Aid – Red Cross App: Deconstructed

This is a collaborative project based on the First Aid – Red Cross App. As a team, we deconstructed the interactive to understand how all the elements conjoined into one to produce the instructional design.

The Red Cross App provides an inbuilt interactive interface that allows users to react in real time to emergency and disaster events.

The app enables users to choose from a multitude of scenarios and provides solutions facilitated through back end flowcharts which narrow down possible cause/effect and solutions. Below is a link to a short video which introduces the general use of the app.


The Red Cross App is designed for young adults, adults and the elderly. Its purpose is to help teach individuals basic medical procedures until emergency arrives.


To an extent, having the basic knowledge of digital literacy is assumed. This ensures easy navigation throughout the procedures. Also, due to its medical nature, the users of the app must be fluent in English as the instructions are written in the language and any miscommunication can be fatal in times of a dire situation. This skill is also required when dialing emergency.

For example, the amount of pressure when giving chest compressions varies from adults to children. If this information was misunderstood, it could cause further damage. Although there are accompanying diagrams and GIFS, it can be easily misinterpreted as it doesn’t depict the procedures for a child.


The Red Cross Australia App is available IOS / Android devices through iTunes and Google Play. There are several elements to the interactive, including

  • Choosing emergency types (e.g. Burns)
  • Q&A on emergency types built upon a hierarchy of ‘what’ ‘why’ ‘how’ and ‘when’
  • Interactive video that walks you through the solution to a given emergency
  • Disaster training and preparation instructions
  • Test your knowledge sections on each emergency or disaster scenario which includes checklists
  • What to do in actual scenarios which link the user straight to emergency services


The Red Cross app reflects a simple and structured design. Its minimalism allows users to be able to navigate their way through the app without complication.

The typography selected for the app is ‘Helvetica’, a sans-serif font that is commonly used because of its easy readability. The different weighting, like bold, is adopted on the headings to differentiate the various sections found in the app. In conjunction to that, font sizes are also used to distinguish the steps from the descriptions.

The colours that are integrated within the app include red, black and white. This was purposefully done for users to recognise and raise awareness about the Red Cross Company.

The layout of the app is simple and cohesive, consisting of a one-column arrangement to allow easy comprehension.  It’s designed to automatically navigate the user from one link to another to ensure nothing is missed. Its symmetrical alignment and vertical flow, enables the user to read and interact with the pages from a top to bottom flow. This is a powerful quality for phone apps as it minimises unnecessary scrolling.


The videos accompanying the instructions could be more professional as opposed to showing someone who is panicked and emotional. This can further unnerve the user in an emergency situation and can cause them to lose focus. Having a calm and cool tone voiceover may help ease the user.

Also, having more illustrations or GIFS can help make the directions clearer. For example, how to position hands for chest compressions. Integrating a search button would also be useful for faster access to a specific procedure. In addition, having a zoom feature would be convenient as the type size is small and can be difficult to read if the information is dense.