Non-linear Design Patterns

Video as a format is linear. It starts and it ends. We can control the playback of the video but it is not the intention of the creator for us (the viewer) to interrupt it. By shooting and editing different sequences we can build complex narratives. We can string them in any order but the medium still stays the same, and as an audience, we are left to take in the production with no input.

The ability to create interactive video is becoming more and more available to artists and designers and as a result of that we are beginning to see common design patterns emerge.

Interaction allows video to become non-linear so a standard timeline is now obsolete as a means to map out our content. As we visualize these maps, patterns become more obvious between projects that have similar goals or outcomes. We need to define these patterns to create a common language that allows us to discuss ideas more effectively.

To define these patterns we have examined interactive videos, mapped out the relationships between their component videos and looked for common goals. To sum up these patterns effectively we reduce the relationships to their core. What we are left with is a group of small design patterns that help us easily describe these types of relationships and we can quickly see if the application is functioning as expected.

The four key patterns we keep seeing we have described as thus: Parallel, Path, Program and Tangent Path.

Parallel interactive videos consist of several videos with a fixed timeline but different content. They allow you the ability to jump between videos without interruption and tend to have a common audio track. The recent 24 hour music video for Happy by Pharell is a great example of this pattern where the user is able to jump between videos at different “hours” however the music remains the same.

The path pattern describes the connection of separate videos with their own duration. Most commonly we see this pattern in Choose Your Own Adventure (CYOA) projects such as Afro Supa Hero. The viewer will be presented with options to change the course of the story which creates a unique experience each time the video is viewed. While this is the most common implementation of the path pattern we have also noticed a couple of noteworthy variations that still fall under this branch: Tangent and Forced Outcome. Tangent describes the setup of a main timeline that the viewer is given choices to leave at certain points but ultimately comes back to it. This means that the experience can be different each time however the end will usually be the same each time. A forced outcome describes the setup of perceived choice but with only one correct option to move forward.

Program patterns are most commonly seen in educational projects. The main video acts as a hub to different videos that the user can explore. The interesting attribute of this pattern is that the notion of time is not applicable except in the individual segments, in essence there is no definite end. It’s completely non-linear. Check out an example of an e-commerce interactive here.

The connection of videos as we have previously shown purposefully removes the notion of time or duration. As in most cases these things become arbitrary, however, this does not mean we should remove it entirely and there will be certain cases where the representation of time can be extremely useful in visualising a project. For instance, we previously talked about Tangent Paths. A Tangent Path could in theory look much like a Program pattern if the project is setup so that there is one central video and the tangent videos are only accessed at certain points in time on the central video. Once playback of the tangent video is over it returns to the previous video at the last timestamp or further on. Here you can watch a branded interactive video based on the Tangent Path pattern.

This is a blog series on storytelling tactics and techniques. Stay tuned for our next post on how-to create your own non-linear video with Vidzor.