Micro-Interaction: Understanding Double Tanks

Still image of screencast displayed on a laptopTry Out the Interation


University scuba diving students studying Marine Science


  • Script Writing
  • Audio Narration
  • Graphic Design

Tools Used

  • Articulate Storyline
  • Adobe Audition
  • Adobe Illustrator
  • Rode Procaster

Problem and Solution

Every semester, students struggled with the concept of double tanks and without a strong understanding of the valves, not only were the in-water training sessions taking too long, but students were going underwater without enough knowledge or confidence for how to operate the set of double cylinders, exposing the program to serious risk.

As part of the lecture on advanced and technical diving, I proposed to include an interaction on the functionality of double cylinders and isolator manifolds.  This interaction is a peek at a complete advanced diving module; students come across this interaction after already understanding the fundamentals of double tanks, how valves are frequently called posts, and how the right tank and left tank are named for being on the diver's right/left side when worn on the back. The module ends with a handful of quiz questions to review. Understand that this micro-interaction you see here is merely one single snippet of the advanced diving module.


This process is within the context of creating the entire course, but only focuses on this single interaction.  I wanted to employ a combination of visual and auditory feedback to show exactly what happens when each valve is closed.  Knowing that the students would have an in-person orientation with the gear and then use the equipment in the water, I weighed the costs and benefits of a scenario-based interaction versus a click-based interaction (to be followed up at the end of the course by quiz questions with specific feedback).  Ultimately my analysis led me to keep things simple and create the basic interaction that you see. Understand that students already had the context needed to follow along. They knew the equipment, the terminology, and had seen the gear already. This interaction is just one snippet of a larger course.

I decided to rely on custom artwork to visually depict what happens when certain valves/posts are closed and open.  Although learners can easily see what is happening with the visual right away, the detailed context was added through audio narration and supporting text.

Audio Script and Interactive Prototype

I wrote the script and then developed the interactive prototype for approval along with the rest of the project.  Not all slides are included in the basic interactive prototype, but for this course, this interaction was one of them.  With minor corrective suggestions and a long list of positive feedback, I began work on the custom artwork and narration.

Custom Artwork

I was able to find an image of double tanks, but my vision was to use color coding to clearly show what was open and what was closed.  My initial mockup for this interaction was with basic shapes in Storyline set to a certain transparency and given soft edges.  However, the shapes did not perfectly match the tanks and when multiple shapes overlapped, the transparency and soft edges did not look professional.  Enter Adobe Illustrator.  I moved the image of the cylinder into Illustrator and drew all of the shapes on top of the tanks.  I then systematically changed the colors appropriately and saved each version of the file as a PNG, imported them into Storyline, and then set the soft edges and transparency from there.

Full Development

Once satisfied with the artwork, I recorded and edited the audio, imported it into the project, along with the visuals, then added animations to give the interaction a sleek feel.

Constant Analysis and Development

Since this project was developed during my penultimate semester, I was only able to analyze two semesters’ worth of data.  The accompanying practical component of this lesson was removed due to covid, so although I was able to analyze exam data, I was not given the opportunity to assess the impact of the interaction as it related to practical in-water skills.  The exam data that I was able to see showed a definite improvement on students’ understanding of the double tank isolator, but the sample size was only about 40 students answering a couple questions on the topic.

Explore other projects