Mastering the Star Story Solution Framework with Doodly

voomly-team-avatar png

Friday, December 13, 2024

Storytelling is your ultimate tool for grabbing attention and driving action.

It’s not just about telling a story—it’s about making people feel something, remember something, and most importantly, do something.

But here’s the catch: not all stories hit the mark.

Some fall flat, leaving your audience scrolling past or clicking away. Others? They stick. They inspire. They convert.

What’s the difference?

A strong, proven framework that takes the guesswork out of storytelling.

That’s where the Star Story Solution Framework steps in—a simple yet powerful formula that’s been winning hearts and minds for decades.

Now, combine this storytelling technique with the engaging visuals of whiteboard explainer videos, and you’ve got a recipe for success.

With Doodly, you can bring this framework to life in a way that’s not just visually engaging but also incredibly effective at driving results.

In this guide, you’ll learn how to use the Star Story Solution Framework alongside Doodly to create videos that captivate and convert.

But before we jump into video creation, let’s cover the basics.

​What exactly is the Star Story Solution Framework?

What is the Star Story Solution Framework?​

The Star Story Solution Framework is a simple yet impactful storytelling method widely used in copywriting and marketing. It breaks down a narrative into three clear components:

The Star.

This is your main character—the relatable hero who drives the story forward. The star faces challenges that resonate with the audience, making their journey one your viewers can connect with on a personal level.

The Story.

Here, we dive into the journey. The star encounters obstacles and struggles, creating an emotional arc that draws the audience in. This is where empathy and tension build, keeping viewers engaged and invested.

The Solution.

This is the resolution, where your product or service shines as the answer to the star’s challenges. It’s the moment where everything clicks, leaving your audience both satisfied and inspired.

This framework is effective because it simplifies complex ideas into relatable, emotional narratives. And simplicity is key in communication.

A Classic Example of the Framework

One of the most well-known examples of this storytelling formula is Martin Conroy’s "Tale of Two Young Men" from The Wall Street Journal.

This direct mail letter used the Star Story Solution Framework to highlight the transformational power of the publication.

The “star” is the young man who subscribes to The Wall Street Journal and goes on to achieve great success.

His counterpart, the one who doesn’t subscribe, remains stuck in mediocrity.

This iconic letter not only demonstrates the effectiveness of this storytelling method but also stands as one of the most successful pieces of direct mail in history.

Why Use This Framework?

The Star Story Solution Framework works because it mirrors how humans naturally process stories.

We empathize with characters, root for their struggles, and feel relief when challenges are resolved.

In marketing, this approach builds trust and relatability, making your message not just heard but remembered.

Now that you’ve got a solid understanding of the framework, let’s put it into action.

In the next section, we’ll create a short story using Doodly to show how this framework can translate into compelling whiteboard animation videos.

Scene 1: Creating the Star in Doodly

Every story needs a hero, and for this video, Janet takes center stage.

Janet is a school teacher, but she’s not just any teacher—she’s struggling to make her classes engaging for her students.

​Here’s how we set up Janet’s character and environment in Doodly to introduce her story:

1. Choose Your Star​

  • Janet is our relatable main character.
  • To find her, go to the Characters tab in Doodly and select a pose that matches her role as a teacher. Look for something natural, like Janet standing, holding a book or maybe a stick.

2. Set the Scene

  • Head over to the Scenes tab and choose a classroom setting. Doodly offers several classroom backgrounds, so pick one that feels realistic and welcoming.
  • Add Janet to the classroom by dragging her onto the canvas. Position her so she looks like she’s teaching or addressing her students.

3. Add Context with Props

  • To illustrate Janet’s challenges, we’ll add some details:
  • Navigate to the Props tab and search for “bubble.”
  • Select a thought bubble and place it near one of the student characters.
  • Inside the bubble, add the text “BORING” to convey the disengagement Janet is facing.

4. Final Touches

  • Arrange the elements so the scene looks cohesive. Janet should be front and center, with her students and the thought bubble clearly visible.
  • Play with sizes and positioning to ensure everything is visually balanced.

Up Next: Let’s dive into the challenges Janet faces in Scene 2—the heart of her story.

Scene 2: Building the Story in Doodly

With Janet’s character and the initial setup complete, it’s time to dive into her journey.

This part of the framework—the story—is where we build emotional engagement.

It’s about showcasing the obstacles she faces and the challenges she overcomes, making her struggles relatable to the audience.

Let’s show Janet trying her best to connect with her students, despite their growing disinterest.

Now, let’s bring her story to life in Doodly.

1. Create a New Scene​

  • Start by clicking Add New Scene in Doodly.
  • This will be Janet’s story—her struggle to engage her students despite trying new methods.

2. Add Janet with a Teaching Element

  • Go to the Characters tab and select Janet again.
  • Choose a pose where Janet is holding a sign to represent her teaching effort.
  • On the sign, add text such as “Lifecycle of a Frog” and include an image of a colorful frog at the bottom of the text. This visual ties in with her lesson topic.

3. Introduce a Disengaged Student

  • Go back to the Characters tab and select a student character. For this scene, let’s choose Ethan.
  • Place Ethan in the scene, ensuring his body language looks bored or disengaged to reflect the narrative.

4. Add a Speech Bubble

  • Navigate to the Props tab and select a speech bubble.
  • Flip the bubble so it appears to come from Ethan’s mouth.
  • Inside the bubble, add text like “What time is lunch?” to show his lack of interest.

5. Arrange the Scene

  • Position Janet on one side, prominently holding her sign.
  • Place Ethan nearby with his speech bubble.
  • Add small details, such as subtle props or background elements, to make the classroom setting more dynamic.

Next Up: It’s time to bring in the solution that changes everything. Let’s move to Scene 3!​

Scene 3: Introducing the Solution in Doodly

With Janet’s struggles laid out, it’s time to introduce the moment of transformation—the solution.

This is where everything shifts. It’s the turning point that shows how Janet’s challenges are resolved, thanks to the tools at her disposal.

For this scene, we’ll highlight how Doodly becomes Janet’s secret weapon, enabling her to create lessons that engage and inspire her students.

Let’s bring this resolution to life in Doodly, crafting a satisfying conclusion to Janet’s journey.

1. Add Janet with a Solution Prop

  • Go to the Characters tab and select Janet holding a laptop.
  • Place Janet prominently in the scene to emphasize her as the hero of the solution.
  • This visual highlights the shift from struggle to success.

2. Incorporate the Doodly Brand

  • Upload the Doodly logo as a prop (if you haven’t done this already).
  • Navigate to the Props tab, hit the blue and white plus sign, and upload the logo.
  • Place the logo on the laptop screen Janet is holding to symbolize her discovery of the software.
  • Alternatively, position the logo in the bottom-left corner for branding without overpowering the scene.

3. Enhance the Visuals with a Custom Prop

For this scene, we want to add a creative twist—a cartoon hand holding a pencil. Instead of importing an image from elsewhere, we’ll use one of Doodly’s own assets.

The goal? To create the illusion of the hand writing “Doodly” on Janet’s laptop screen, perfectly blending interactivity and branding.

Here’s how you can create this custom prop step by step:

Steps to Create the Hand Graphic​

1. Add a Temporary Scene
​Create a new scene in Doodly just for this process (you can delete it later).

2. Add Invisible Text
​Insert some text in the scene and change its color to white to make it invisible. This allows the cartoon hand to appear as if it’s writing something.

3. Select a Hand from Doodly
Head to the Settings tab and choose a hand. Opt for a cartoon-style hand to give the scene a playful and creative feel.

4. Preview and Screenshot

Preview the scene to capture the moment the cartoon hand draws the invisible text. Pause the preview at the right moment and take a screenshot of the hand.

Removing the Background​

To use the hand as a standalone prop, we’ll need to remove its background:​

1. Open the Screenshot
Use a background removal tool like Pixel Beta Pro, Canva or any app of your choice.

2. Erase the Background
Remove everything except the hand holding the pencil. This ensures the image blends seamlessly into your Doodly scene.

3. Export as Transparent PNG
​Save the file as a PNG and make sure transparency is enabled. This is crucial for layering it onto your scene later.

Importing the Graphic Back into Doodly​

1. Delete the Temporary Scene
​Clean up your timeline by removing the temporary scene you used to capture the hand.

2. Return to Janet’s Laptop Scene
Go to the Props tab and upload the newly created hand graphic. You can either drag it directly into the scene or use the upload button.

3. Integrate the Hand with the Scene
​Place the cartoon hand on Janet’s laptop screen and layer it with the frog image. This setup demonstrates Janet’s interactive teaching method and adds a dynamic touch to your story.

4. Transform Ethan’s Reaction

  • Go to the Characters tab and select Ethan, but this time choose a pose where he looks happy and excited.
  • Replace the bored version of Ethan with the cheerful one to illustrate the impact of Janet’s improved teaching methods.

Next: Let’s refine the video with durations, delays, and more to make it seamless and engaging!​

Fine-Tuning Durations and Delays for Seamless Flow

Now that your scenes are coming together, it’s time to refine the timing. This step ensures that your video feels smooth and professional, holding the viewer's attention without dragging unnecessarily.

​Here’s how to adjust durations and delays in Doodly to make your scenes crisp and engaging.

1. Assess the Scene Length​

Start by reviewing the length of your scenes.​

  • For example, in the first scene, the total length might clock in at one minute and 30 seconds, which is far too long for a simple story.
  • If every element in the scene is set to draw on with a default duration of three seconds each, the scene can quickly become bloated.

2. Select All Elements in the Scene

You’ll need to adjust the drawing durations for all the elements.

  • Use Ctrl+A (or Command+A on Mac) to select everything in the scene at once.
  • Alternatively, hold down Ctrl (or Command) and click each element individually.

3. Set Durations to Zero

Not everything needs to be drawn on by hand—some elements can simply appear.

  • Click the gear icon after selecting the elements.
  • Set the drawing duration to zero for all items.
  • This will make the elements appear instantly, condensing the scene into a more efficient one-second segment.

4. Choose What to Draw On

While most elements can appear instantly, a few key items can benefit from the drawing effect for added emphasis.

  • For instance:
  • Let the hand draw Janet on for two and a half seconds.
  • Set the speech bubble to draw on for one second.
  • Adjust the text, “Boring,” to appear in one and a half seconds.
  • This selective approach ensures that the most important elements get the attention they deserve without overstaying their welcome.

5. Preview Your Adjustments

Once you’ve applied your changes, preview the scene to see how it flows.

  • Look for any moments that feel rushed or sluggish.
  • Make additional tweaks if needed to maintain a balanced pace.

6. Streamline the Timeline

After adjustments, the first scene should now be approximately 35 seconds long—a much more manageable duration.

Next: Let’s layer in voiceovers to elevate your video further!​

Adding Voiceover: Make Your Story Come Alive​

Voiceovers bring depth and personality to your video, turning static visuals into an engaging narrative. Here's a step-by-step guide to adding and perfecting voiceovers in Doodly.

1. Access the Voiceover Tool

Navigate to the timeline at the bottom of your screen.

  • Click on the microphone icon to open the voiceover tool.
  • Hit the plus sign to start a new audio recording track.

2. Record Your Voiceover

You’re now ready to narrate your story. Follow these steps for each scene:

First Scene: Introduce Janet

  • Press the red microphone button and start speaking clearly.
  • Say: “Meet Janet. Janet is a teacher struggling to make her classes engaging for her students.”

3. Edit and Tighten the Recording

After recording, you may notice unwanted silence (dead air) at the beginning or end of the track.

  • Hover your cursor over the edges of the recording and drag to shorten these sections.
  • This ensures a cleaner, more professional voiceover.

4. Add the Second Scene Voiceover

Repeat the process for the next part of the story:

  • Press record and say: “Despite trying various methods, her students are losing interest, and she’s on the verge of giving up.”
  • Once done, trim the dead air and preview your narration to ensure it matches the visuals.

5. Narrate the Final Scene

For the solution part of the story, bring in the excitement of Doodly as the answer.

  • Record this voiceover: “Janet discovers Doodly, a whiteboard animation software. With its easy-to-use interface and vast library of images and animations, she creates engaging lessons that captivate her students.”
  • Again, edit out any dead air, and align the narration with the visuals.

6. Fine-Tune the Sync

To make the video flow seamlessly:

  • Move scenes around on the timeline as needed.
  • Add slight delays between scenes to ensure perfect synchronization with the voiceovers.

By following these steps, your video will not only look polished but also sound professional, leaving your audience fully engaged.

Up next: Let’s dive into adding camera movements for a dynamic touch.

Adding Panning and Zooming: Direct Attention Where It Matters

Panning and zooming effects can make your whiteboard animation more dynamic by directing the viewer’s focus to specific areas or characters. Follow these steps to add movement to your scenes and keep your audience engaged.

1. Access the Panning and Zooming Tool

Navigate to the timeline, where you’ll adjust your scene’s movement.

  • Right-click within the Panning & Zooming bar in the timeline or just click the plus sign.
  • Select Add Panning & Zooming to create the effect.

2. Set the Starting Point

Adjust the playhead on the timeline to determine where the effect begins.

  • Place the playhead at the point in your scene where you want the movement to start.
  • This ensures the timing aligns perfectly with your visuals and voiceover.

3. Define the Focus Area

Click the fx bar created in the timeline and customize the effect.

  • Adjust the Start frame to match the full-screen view of your scene.
  • Drag the End frame to zoom in and focus on the specific character or element you want to highlight, such as Ethan, the happy little guy.

4. Preview and Refine

Play back the scene to see how the panning and zooming effect looks.

  • Ensure the movement is smooth and doesn’t feel rushed or abrupt.
  • Adjust the duration of the fx in the timeline to make the effect slower or faster, depending on your preference.

Next: Let’s complete your video with some background music.​

Adding Background Music: Set the Tone for Your Video

Background music can elevate your whiteboard animation by adding energy and atmosphere to the story. Here's how to seamlessly add and adjust music in Doodly.

1. Access the Music Library

Navigate to the Sounds tab to explore your music options.

  • Click Categories, then select Music to view the pre-installed tracks available in Doodly.
  • Browse through the collection and choose a track that complements the mood of your video. For example, opt for something upbeat and cheerful to match Janet's triumphant moment.

2. Add Music to the Timeline

Drag your chosen track from the Sounds tab down to your timeline.

  • Place it at the very beginning of your video for consistent background audio.
  • The timeline helps you visualize how the music aligns with your scenes and voiceover.

3. Adjust the Volume

Click the little speaker icon next to the track to control the volume.

  • Reduce it to around 10% if you’re using a voiceover. This ensures the background music enhances rather than overpowers the narration.

4. Trim the Music

Locate the end portion of your track and tighten it to align with your video’s ending.

  • Click and drag the end of the music track to shorten it, ensuring it stops as the final scene concludes.
  • A well-timed stop avoids awkward silences or music that extends beyond your visuals.

5. Preview and Refine

Play your video to check how the music complements the visuals and narration.

  • If adjustments are needed, move the track slightly along the timeline or tweak the volume further.

Finished Product: See the Star Story Solution Framework in Action

After following each step and blending creativity with storytelling, the final video is ready. This isn’t just a video—it’s a journey that takes your audience from challenge to triumph, all with the help of Doodly.

And Here’s the Finished Product​:

Conclusion: Bring Your Stories to Life with Doodly

Storytelling is a powerful way to connect with your audience, and the Star Story Solution Framework makes it even more effective.

By focusing on a relatable star, a compelling story, and a satisfying solution, you can craft narratives that not only engage but also inspire action.

With tools like Doodly, bringing these stories to life becomes a creative and seamless process.

From designing engaging scenes to adding voiceovers, music, and animations, every step enhances your video’s impact.

Now that you’ve seen how easy it is to combine this storytelling framework with Doodly, it’s time to create your own captivating content.

Don’t just tell a story—make it unforgettable.

Ready to elevate your storytelling game? Click the button below to try Doodly now!

Leave a comment

Your email address will not be published. Required fields are marked *

cover-2-1024x623.gif

8 Min Read

Video marketing is a preferred method to promote business these days. It is a great marketing tool that can help you stay relevant and help guide potential clients towards you. […]

cover-jpg-1024x576.jpg

8 Min Read

Did you know that a customer review is the most important factor in your SEO strategy? It can be hard to get and keep customers, but once they move to […]

cover-2-1024x576.png

8 Min Read

Have you ever seen a product that made your head turn? It caught your attention, right? Now, that doesn’t necessarily mean you were interested in the product, but for some […]

Skyrocket Sales & Conversions Like Never Before Using Voomly’s Incredibly Intuitive Interface!

Voomly is the perfect platform to host videos advertising your brand.

And with its ultra-customizable, no-coding-required video tools, you’ll get the absolute best results from your sales videos.

Select video player colors, border skins, player skins, and customized thumbnails … potentially increasing your sales video views by as much as 4X, according to some research.

Drive website traffic by adding a clickable brand logo to your video player … so anyone watching your videos can easily find out more about your products and services.

Promote a professional image by using video players that “travel” with your video … so when your videos are shared via social media, everyone sees them in a video player that displays your logo and brand colors.

Hide or display controls, like the play bar, time, volume, speed, autoplay, full-screen option and more, customizing your player to your marketing goals.

image_2022_05_30T06_20_22_141Z.png

Give Voomly A Try For FREE Today

30-Day Money Back Guarantee

If you are not completely satisfied with Voomly within 30 days, we will refund 100% of your payment. Just email us at support@voomly.com and every penny will be gladly refunded to you within the first 30 days. Nothing could be more fair than that.

This site is not a part of the Facebook website or Facebook INC. Additionally, this site is NOT endorsed by Facebook in ANY WAY. Facebook is a trademark of Facebook INC. You understand this to be an expression of opinions and not professional advice. You are solely responsible for the use of any content and hold Voomly LLC and all members and affiliates harmless in any event or claim. You can also safely assume that I get paid anytime you click on a link on this site. We recommend that you do your own Independent research before purchasing anything.