Storyboarding for AI-driven Products - Part 3: How to Tell your Story Using Subject-to-AI and other Storyboard Transitions

You can use any of these transitions effectively to introduce a particular effect in your story. In Part 1, we learned why we needed a UX storyboard. In Part 2, we learned the basic components and panels. In this installment, Part 3, we will learn about transitions from panel to panel — the mechanisms by which we advance the story through our panels.

In his seminal book, “Making Comics,” (https://a.co/d/0zrGiif) Scott McCloud recognized six types of transitions. In the UX for AI storyboards, we are mainly concerned with the following four types:

• Action-to-Action: shows the same subject in a series of actions.

• Subject-to-Subject: a series of changing subjects within a scene.

• Scene-to-Scene: transitions across significant distances in time and/or space.

• Subject-to-AI: when the subject is interacting with an AI.

To demonstrate various transitions, let’s continue to use the “Mood Board” storyboard about a shy young man who finds love with the help of AI, which we discussed previously in Part 1 and Part 2 of the “UX for AI Storyboards” series:

Action-to-Action transition is your basic everyday bread-and-butter default. In the “Mood Board” storyboard discussed previously, we can consider the transition from the establishing shot to the young man drinking coffee to be a typical “Action to Action” transition:

Another example might be when the young man finally gets the courage to introduce himself to the young lady:

In both cases, the “action” part of the transition is the action taken by the protagonist to advance the story.

Subject-to-Subject transition is when the camera pans between two faces. In this case, if you had a panel of a young man sitting alone drinking coffee and one of the young woman doing the same, this might be considered a subject-to-subject transition:

Scene-to-Scene transitions are helpful when things happen “later,” in parallel, or in another place. For example, in our storyboard, we can easily imagine that the young couple going into the sunset with a heart balloon in hand happened a short while later and in another place: after all, coffee shops do not usually sell heart-shaped balloons:

Subject-to-AI is a special case of the Subject-to-Subject transition that comes into play specifically in creating storyboards for AI-driven projects.  You can think of AI simply as another “subject” in the story. In the Mood Ring storyboard, the protagonist checks his phone. The transition between his face and the “face” of AI (in this case, a vague suggestion of a customized checklist) provides a typical example of a Subject-to-AI transition:

Literature, movies, and popular culture provide numerous and versatile range of examples of AI-driven subjects, which range anywhere from giant planet-sized AI (Matrioshka brain https://en.wikipedia.org/wiki/Matrioshka_brain) to humanoid robots (Terminator) to AI-driven spaceships and habitats (HAL-9000, Star Trek computer) to disembodied AIs that live in the alternate dimensions (Hyperion, Ghost in a Shell). For your storyboard, feel free to pick whatever AI representation feels most appropriate for your project. Personally, I prefer to imagine my AI representations in the style of the Lost in Space Jupiter 2's B-9 environmental control robot famous for its (his?) profound grasp of the obvious: “Danger Will Robinson, Danger!”

Here’s a storyboard focused on Subject-to-AI transitions featuring the ever-vigilant B-9:

The beauty of B-9, the “Danger Will Robinson, Danger Robot,” as an AI mental model for your designs is that it pretty much applies to most manifestations of our modern state of consumer AI-driven products. Here’s the same storyboard featuring Amazon Alexa:

Note the use of the establishing shot of the tentacle monster to set the scene and the effective use of eyebrows to communicate what Will is feeling in each panel. (See Part 2 for more on those topics.)

For more nerdy UX fun, I highly recommend the book “Make It So: Interaction Design Lessons from Science Fiction” by Nathan Shedroff and Christopher Noessel. (https://a.co/d/bjYuDPx)

Next Steps:

1. Please vote for my UX for AI workshop at the next SXSW: https://panelpicker.sxsw.com/vote/151357 

2. Attend my next UX for AI workshop at UXStrat Boulder, CO, on September 9th to practice drawing storyboards and doing other exercises, such as Digital Twin, which is essential for success on your next AI project. Register here: https://strat.events/usa/tickets 

3. Look for the final Part 4 of this series coming this Friday.

Happy Storyboarding!

Greg

P.S. Our fabulous full-day workshop on September 9th, 2024, at UXStrat in Boulder WILL sell out like our previous workshops at UXStrat 2023, UX Copenhagen, UXLx in Lisbon, and Rosenfeld Media workshop online. If you found this article helpful, don’t miss out on crucial learnings you will need in your next project and get your ticket now: https://strat.events/usa/tickets 

P.P.S. And please remember to vote for my session at SXSW: https://panelpicker.sxsw.com/vote/151357. Thank you!