Interactive Design

Definition of Interactive Design

 My personal definition of Interactive design is the process where designers create meaningful communication through multiple digital mediums. It’s a process where designers understand how users communicate and interact with technology, through this procedure a collection of data is assembled which allows designers to create successfully designs that target the users behaviour and needs. Interactive design is a collaboration between people and technology, its a problem solving mechanism where designers anticipate the consumers experience for early detection of errors or opportunity for inventive ideas.

Interactive Design Examples

Precedent example 1

10k Runner app

This app allows users to train and hopefully further improve on their cardio and endurance performance. The app has the ability to track the distance the user has completed throughout the session through GPS, through this data they calculate the estimated amount of calories lost during the session. The app has considered the element of human behaviour by implementing two factors of motivation. During the workout a voice continues to direct and further motivate the user, the app also allows the user to sync their music on their phone to the app so users are able to listen to music while they complete the workout.

The layout is simple and the app easy to navigate through creating a pleasant experience. It is based on a schedule, which is located on the lower half of the interface so users have a session to complete each day. It contains a burger menu on the top left side of the interface, which leads the user to headings, such as

  • Running
  • Wins
  • History
  • Help/info
  • Training plan
  • More Apps
  • Settings

Just opposite of the menu an arrow icon is located which leads the user to more available apps from the seller.

Precedent example 2

Virtual Trainer body weight

The virtual trainer bodyweight app caters for beginners and experienced individuals who are seeking to perform exercises in strength. For each exercise there is a video to assist the user in the correct form and technique needed to perform the exercise. The exercise are categorised in sections that are easy, medium and hard. The app gives the users a choice of completing weekly workouts provided or building their own program by adding exercises they provide.

There is an icon on the top left side of the interface of an outline of a body. When you touch the icon it leads the user to a body muscle diagram. Here you can select a muscle that you would like to exercise, once you have selected this will lead the users to a set of exercises specific to the muscle they wanted to workout.

Screen Shot 2017-05-06 at 1.46.22 pm
Image: Virtualtainer Sweden AB (2013). Virtual Trainer Bodyweight: Home and Travel Fitness Workout [screenshot]. Retrieved from Virturaltrainer Bodyweight app

Precedent example 3


Pinterest is a social network that allows users to upload visually captivating content, share and post( known as ‘Pinning’) on public or private boards. It’s an interactive that connects the community together by allowing the audience to browse through other users boards and see what they have pinned.

Users are able to use this application as it’s easy to navigate due to it’s easy layout.

Screen Shot 2017-05-06 at 1.52.58 pm.png

It’s a highly thought out interactive. This specific feature assists the user to find what they are seeking. For example below i searched ‘Art’ tags below the search bar appeared to further specify what art i wanted such as ‘Drawing, watercolour and DIY.

Screen Shot 2017-05-06 at 2.00.59 pm.png