Create storyboards in 10 minutes with these magic AI prompts

Summary

In the video, product designer Maurice from Geocaching HQ shares valuable tips on creating effective UX storyboards using AI tools like Bing Image Creator and Dolly. Maurice emphasizes the importance of consistency in character and art style, and provides a template for crafting clear prompts that yield desired results. He also addresses the challenge of depicting user interactions with UI and offers a solution using a mirror board. The video concludes with a resource link for a free, updatable storyboarding cheat sheet for designers.

Takeaways

• 🚀 AI tools like Bing Image Creator and Dolly have made it easier than ever to create UX storyboards, saving significant time in the design process.
• 🎨 UX storyboards are similar to those used by filmmakers and animators, but instead visualize customer interactions with a product in their everyday lives.
• 📝 Tools such as Chat GPT and mid-journey allow for image creation by typing descriptions, though finding the right prompt can be challenging and may require trial and error.
• 👩‍🎨 Maurice, a staff designer at geocaching, shares valuable insights on using AI for storyboarding, emphasizing the importance of context in real-world scenarios.
• 📈 To create a coherent story with AI, clear guidelines and styles must be provided; otherwise, the characters and styles may be inconsistent.
• 📏 Maurice spent three hours perfecting a template for AI storyboarding, which significantly reduced the time needed to create new storyboards.
• 🖌️ Bing Image Creator generates images from natural language prompts, and its ease of use is highlighted by simply typing a text prompt to produce visual options.
• 🧩 For a consistent storyboard, the template has two parts: one for elements that remain constant across frames and another for elements that change from frame to frame.
• 👥 Character details such as hair color, length, clothing, and accessories should be specified in the prompt for a clear and consistent visual representation.
• 📍 Including real-world context in the prompt can enhance the relevance and accuracy of the generated images, especially when depicting interactions with UI elements.
• 🔄 To get the desired angle or perspective in the frame, it's recommended to add specific angle descriptions at the start of the prompt.
• 💾 Save favorites to your collection to easily rerun original prompts, as AI tools may not automatically save all iterations.

Q & A

What is the main topic of the transcript?

The main topic of the transcript is the use of AI tools for creating UX storyboards efficiently and effectively.

Which AI tools are mentioned in the transcript for creating UX storyboards?

The AI tools mentioned in the transcript are Bing Image Creator, Dolly, and Chat GPT.

What is the purpose of UX storyboards in product design?

UX storyboards help visualize how a customer might use a product in their everyday life, which aids in getting stakeholder feedback early in the design process.

What challenges does the speaker face when using AI tools for storyboarding?

The speaker faced challenges such as achieving a coherent story, maintaining consistent styles and characters, and accurately depicting user interactions with UI elements.

How did the speaker overcome the challenge of maintaining a consistent art style?

The speaker created a template that ensures consistency by specifying the art style and character details as the first part of the prompt when using Bing Image Creator.

What is the importance of context in UX storyboards?

Context is crucial in UX storyboards because it helps show people using the product in real-world situations, making the storyboards more relatable and effective.

How does the speaker address the challenge of drawing user interactions with UI?

The speaker addresses this challenge by using a combination of Bing Image Creator to generate the initial frame and then refining it with a mirror board and pen tool to add UI interactions.

What is the speaker's advice for saving time when using AI tools for storyboarding?

The speaker advises using a well-crafted template with specific prompts and saving favorite frames to a collection for easy re-use.

How can one access the recommended storyboard prompts and stay updated with the latest AI tool developments?

One can access the recommended storyboard prompts and stay updated by visiting the provided link in the description and downloading the cheat sheet, which will be kept current with the latest recommendations.

What is the significance of the cheat sheet mentioned in the transcript?

The cheat sheet contains current recommendations for storyboard prompts and will be updated as AI tools evolve, ensuring that users have access to the most effective and up-to-date methods for creating UX storyboards.

What is the role of the interview with Pavo Samsonov in the transcript?

The interview with Pavo Samsonov, UX Lead at AWS, is meant to provide additional insights into the power of UX storyboards and their impact on design work.

Outlines

00:00

🎨 Efficient Storyboarding with AI Tools

This paragraph introduces the ease of creating UX storyboards using free AI tools such as Bing, Image Creator, and Dolly. It emphasizes the time-saving potential of these tools and compares UX storyboards to those used by filmmakers and animators but for visualizing customer interactions with products. The speaker, Maurice, a product designer, shares his experience with these tools and the importance of precise prompts to generate desired images. He discusses the challenges of mastering these tools and presents his own method of creating a storyboard in 10 minutes using Dolly, after spending three hours to perfect his technique. Maurice also introduces Bing Image Creator and shares a detailed strategy for crafting effective prompts that result in coherent and stylistically consistent storyboards.

05:02

🖌️ Overcoming Challenges in AI Storyboarding

In this paragraph, Maurice delves into the specific challenges he faced while using AI for storyboarding, such as maintaining a coherent story and dealing with varying styles and characters generated by Bing. He explains how he solved these issues by creating a template that ensures consistency across frames. Maurice provides an example of an effective prompt and breaks down the template into two parts: one for consistent elements like character features and art style, and another for changing elements like context, actions, and expressions. He also offers tips on how to get the desired angles and interactions with UI, including a workaround for Bing's limitations by using a mirror board for drawing buttons and text. Maurice concludes with a pro-tip on saving favorites in Bing and mentions a free cheat sheet available for keeping up with the evolving AI tools.

Keywords

💡UX Storyboarding

UX Storyboarding is a process where designers create visual representations of how a user might interact with a product. It helps to visualize the user experience and is crucial for getting feedback from stakeholders early in the design process. In the video, Maurice, a product designer, emphasizes the importance of storyboarding in his work and shares tips on how to use AI tools to streamline the creation of storyboards.

💡AI Tools

AI Tools, such as Bing Image Creator and Dolly, are software applications that utilize artificial intelligence to assist in tasks like generating images from textual descriptions. They are designed to save time and effort by automating parts of the creative process. In the context of the video, these tools are used to create storyboards for UX design, with Maurice sharing his experience and tips on how to use them effectively.

💡Natural Language Prompts

Natural Language Prompts are textual descriptions that are used as inputs for AI tools to generate specific outputs. These prompts are designed to be easily understood by the AI, allowing it to produce relevant results based on the context provided. In the video, Maurice explains how to craft effective prompts for AI tools to create consistent and accurate storyboard images.

💡Templates

Templates in the context of the video refer to pre-defined frameworks or structures that designers can use to ensure consistency in their storyboards. By using templates, designers can maintain a uniform art style and character representation throughout their work. Maurice shares his own template that he spent three hours perfecting, which allows him to create storyboards more efficiently.

💡Character Consistency

Character Consistency is the practice of maintaining a uniform appearance and behavior for characters across all frames of a storyboard. This is important for telling a coherent story and ensuring that the audience can easily follow the narrative. In the video, Maurice emphasizes the importance of character consistency and provides tips on how to achieve it using AI tools.

💡Art Style

Art Style refers to the visual characteristics and techniques used to create a unique look and feel in visual art, including storyboards. A consistent art style helps to create a cohesive visual narrative and contributes to the overall mood and atmosphere of the story being told. In the video, Maurice discusses the importance of maintaining a consistent art style throughout the storyboard and shares his approach to achieving this with AI tools.

💡Context

Context in the video refers to the real-world setting or scenario in which a product is used. It is essential for creating realistic and relatable UX storyboards. Maurice highlights the importance of context and shares how he incorporates it into his storyboards to better represent how users will interact with the product in their everyday lives.

💡Interactions

Interactions in the video pertain to the depiction of users engaging with user interfaces (UI) within the storyboards. Accurately representing these interactions can be challenging, especially when using AI tools to generate the images. Maurice shares a workaround for this challenge by combining AI-generated images with manual adjustments in a mirror board to accurately represent UI interactions.

💡Storyboard Cheat Sheet

A Storyboard Cheat Sheet is a resource that compiles useful tips, tricks, and recommended prompts for creating effective storyboards. It serves as a quick reference guide for designers to improve their workflow and efficiency when using AI tools for storyboarding. In the video, Maurice mentions that he and his team have created a cheat sheet to help keep designers up-to-date with the latest recommendations for storyboard prompts.

💡Feedback

Feedback in the context of the video refers to the input or reactions received from stakeholders during the design process. Early feedback is crucial for UX designers as it helps to refine and improve the product before it is fully developed. Maurice emphasizes the value of storyboarding in obtaining this early feedback, as it allows stakeholders to visualize and better understand the user experience.

💡Efficiency

Efficiency in the video pertains to the ability to create storyboards in a shorter amount of time without sacrificing quality. By using AI tools and mastering techniques like crafting effective prompts and using templates, designers can work more efficiently. Maurice's presentation aims to help other designers save time by sharing his insights and cheat sheet for using AI tools in storyboarding.

Highlights

Creating UX storyboards using free AI tools like Bing, Image Creator, and Dolly can save massive amounts of time.

UX storyboards visualize customer interaction with a product in their everyday life, similar to how filmmakers and animators use storyboards.

Tools like Chat GPT and mid-journey enable image creation by typing a description, but finding the right prompt can be challenging and involve trial and error.

Maurice, a product designer at geocaching, shares hot storyboarding tips to streamline the process.

Geocaching's real-world context is crucial, requiring depictions of people interacting with the environment, not just screens.

AI storyboarding tools have evolved to allow non-illustrators to easily create visual representations of product use cases.

Bing Image Creator generates images from natural language prompts, which can be used for storyboarding.

Creating a coherent story with Bing requires clear guidelines on styles and characters to avoid inconsistencies.

Maurice spent three hours perfecting a template for Bing Image Creator to streamline the storyboard creation process.

A good prompt for consistent results includes specific character details and art style, such as 'black and white line drawing, storyboard of a woman with short black hair wearing a beanie'.

The template Maurice created has two parts: one for consistent elements across frames and another for elements that change from frame to frame.

To depict real-world context, actions, and emotions, the prompt should include these elements without using generic emotion words.

For specific angles or shots not provided by Bing, additional phrases can be added to the prompt, such as 'full body shot from above'.

Drawing user interactions with UI elements using Bing alone can be tough, but workarounds like mirror boards and pen tools can achieve desired results.

Saving favorites to a collection is recommended as Bing only saves the last 20 frames by default.

A free storyboarding cheat sheet is available for download, keeping users updated with current recommendations for storyboard prompts.

The power of UX storyboards can make a significant difference in design work, as discussed in Maurice's interview with UX lead at AWS, Pava Samsonov.

Transcripts

it's easier than ever to create ux story

boards using free AI tools like Bing

image Creator and Dolly and if you use

them right these ux storyboards can save

you massive amounts of time a ux

storyboard is a lot like the story

boards that filmmakers are animators use

but instead of visualizing shots and

action a ux storyboard visualizes how a

customer might use your product in their

everyday life tools like chat GPT and

mid Journey let you create images by

typing in a description of what you want

but the trick is to figure out exactly

the right prompt to get the results you

want and if you've tried it you know

that this can be very frustrating and

can involve lots of trial and error so

today you're going to Save hours of time

experimenting here's Maurice Sai product

designer at geocaching with some Hot

storyboarding Tips make sure to stay to

the end to find out how to get your free

storyboarding cheat sheet now let's get

into it

my name is Maurice I am a staff designer

at geocaching HQ I joined the game

Thinking group a couple of years ago and

did a project with them and it

completely transformed the way that I

see and do products and I learned how

great storyboarding is especially to get

like stakeholder feedback earlier in the

process and thing about that is part of

the reason I really like being a ux

designer is because I don't have to

illustrate things but like oh no now I

do have to illustrate things and I don't

not a really good illustrator thank

goodness it's come around the time when

uh there AI story boarding tools and

thing about geocaching it's very real

world so context is really important so

I do have to show people doing stuff out

in the real world not just on their

screens so let me tell you how to draw a

storyboard in 10 minutes with AI I used

an AI tool called Dolly to make this in

10 minutes however it took me three

hours to master the tool I made this

presentation so you don't have to spend

those three hours so here's a tool it's

called Bing image Creator it produces

image from natural language prompts

super easy to use you just type in a

text prompt in the upper bar up there

and then it's it's going to generate

four options that you can copy download

or save to your collection seems pretty

simple to make these things right like

just type in every part of your story

it'll make a storyboard for you but it's

a little more difficult than that so so

the first challenge I ran into is

telling a coherent story when Bing

generates prompts and if you don't give

it clear guidelines the Styles and the

characters will end up all over the

place this is supposed to be a story of

someone going outside looking for a

geocache which just a small hidden

treasure and then finding it but it

doesn't feel that way because you have

three different styles three different

characters not if it feels like it

really comes together so to solve this

problem I used a template I spent three

hours perfecting the template but once I

did it was super duper easy that's when

I was able to like start making things

in 10 minutes here's the template and

I'm going to share my template so that

you can reuse it here's an example of a

good prompt black and white line drawing

storyboard of a woman with short black

hair wearing a beanie in nature in front

of bushes looking at her phone with a

smile on her face the reason I think

this is a good prompt is because every

time I ran that prompt it got me

something that I that I likeed got me

what I was looking for and no matter how

many times I ran it that's what I got so

the template has two parts the first

part highlights the elements that need

to remain consistent across all the

frames so who are the characters what's

the art style it always has to be the

first part of your frame it always has

to be at the very start because if you

put it at the end B Bing tends to

disregard it let's break up that first

part the first part which says black and

white line drawing

storyboard this is the only phrase that

consists inst L return this particular

art style even small changes totally

messed it up they made it look too

sketchy they made them look like

photographs this phrase is exactly what

you want so feel free to copy it the

second part of the first half is to

create distinct features for characters

so include details like hair color

length clothing accessories so woman

with short black hair wearing a beanie

much better than 25-year-old woman it

tells you exactly what that person is

supposed to look like the second half of

the template is about the elements that

change from frame to frame so like

context actions expressions in the first

part of the second half it tells you the

real world context if you don't know the

context don't make it up but if you do

know the context in which it's going to

be used add it to your prompt then you

describe the character's actions and

then this is where you show the emotions

by describing facial expressions but

don't use happy or sad don't use emotion

words because AI will exaggerate the

emotions happy is going to return like

creepy Joker like smiles and sad looks

like so sad you don't really believe it

like you don't believe anyone could be

that sad going outside finally if Bing

isn't providing the angle you want in

the frame something you can do is add to

the very start of the prompt so for

example I wanted a version of this woman

looking at her phone but a full body

shot and no matter how many times I ran

the prompt and always showed it like

half body but I want it full body so

just add that angle you want at the at

the start of the prompt ones that worked

for me were full body half body shot

from below shot from above close-up shot

extreme close-up shot Challenge number

two is drawing interactions drawing a

user interacting with UI using Bing

alone is really tough like if I wanted

to show a device and them tapping a

button they would either miss the button

or they draw a hand inside inside the

phone tapping a button is crazy also it

cannot spell I tried to make it write

spoiler photo and instead it said spoter

so here's a solution let's say I want an

image of someone pressing start Auto map

to begin navigation first I used Bing to

generate a frame of a hand holding a

phone with a street map we're not even

going to bother with a button right now

then I uploaded that same image to a

mirror board and use the pen tool to

draw buttons and text and that got me

the results that I wanted here's a pro

tip save your favorites to your

collection so you can rerun the original

prompt uh I made this mistake I made a

bunch of frames and I thought that Bing

was going to save all of them it didn't

it only saved the last 20 frames you can

try it at bing.com create and uh this is

me feel free to get in contact AI tools

are evolving fast by the time you watch

this video some of what we're talking

about here might even be out of date so

that's why we've put together a cheat

sheet with our current recommendations

for storyboard prompts and we're going

to keep that up to date and keep you up

to date as things change to download

your free cheat sheet go to gameth

thinking. storyboards the link is in the

description and if you want to learn

more about the power of ux storyboards

check out my interview with pava

samsonov ux lead at AWS right here it's

powerful stuff and it can make a real

difference in your design work happy

storyboarding I'll see you soon