Motion Comic Effect

Hello everyone - I've been immersing myself in learning more about motion comics as I would love to use this storytelling format for a Privacy Compliance course I'm developing.  I would love any input, resources or suggestions on how to go about doing this in Articulate, Powerpoint or any other application (I'm on a very low to no budget).  I've explored NARR8 app for ideas and searching for "free" versions of software I can test out (e.g. Motionartist by Smithmicro).  I came across a great sample that depicts the look and feel I'm looking for:  http://tv.schneider-electric.com/site/schneiderTV/index.cfm?video=pzMHA1Yzq2qys6PDxdwmTlZfx3k9wBRa

I also came across David Anderson's post on this 5 years ago - so David if you're reading, I would love your input! http://multimedialearning.com/interactive-motion-comics-as-e-learning-scenario-model/

My biggest obstacle is the curation of characters to use.  I'm not an artist that can draw free form (and even if I was, i don't have the time).  Does anyone know of any 'character collections' I can access/purchase that might mimic this comic style?  I'm extremely excited about the possibilities of how this format can engage the learner and elicit emotion. 

Thank you everyone

 

29 Replies
Christie Pollick

Hi, Darlene -- Thanks so much for reaching out with your question! Here is an older thread on a similar topic that you may find to be of interest, and I also wanted to share that you would be welcome to post over in our design-related forum, Building Better Courses, for additional input. 

And I will be sure to pass on your request to David Anderson in just a moment, so hopefully you will be hearing from him shortly! :) 

David Anderson

A lot of the motion effects you see in your example can be created with PowerPoint and Storyline using motion paths. 

Here's a good thread on PowerPoint animation effects that will mostly apply to Storyline: https://community.articulate.com/discussions/articulate-presenter/you-top-10-favorite-ppt-animations-transitions-or-text-effects

 

David Anderson

To achieve the comic style effect, you have a lot of options.

There are dozens of apps for iOS (and I'm sure for Android) that can stylize photos or illustrations with the comic style. ToonCamera is one of my favorite apps.

You can find plenty of plugins for Photoshop to automate the comic style process. Or, you can do it yourself using basic image techniques.

As for characters, the built-in characters in Storyline give you hundreds of poses and expressions. You can also find multi-pose characters at sites like Elearning Art for a good price.

Michael Shannon

A few other examples that might help you on your quest:

  • A great example built on sound instructional design
  • Another one. There are some worthwhile articles that are linked to how it was created, how they hired a comic artist and how it was working with one, etc. 
  • And this one is important from the perspective of developing a story. 

So much more out there on scenario based elearning. 

From a character development (visual) there really aren't any shortcuts that will get you close to the example you cited. It will cost in dollars or time (but time is money too). I've had success developing similar projects using GoAnimate (online subscription), CrazyTalk Animator (software), or using photos that have been shot by me or others and convert them to the comic look using Photoshop actions as David mentioned above. The best option I've ever used is working with a comic artist directly. 

Kevin Thorn

Hi Darlene,

My soft spot - comics to tell stories. Softer spot are motion comics! 

Can't echo David and Michael enough here. I'm excited for you about your interest in this genre approach to elearning. From one who had developed a few of these type projects before, the majority of the effort is in the artwork. I built this one a couple years ago - PwP in Action

The tools are not that big of an issue as David and Michael suggested. There are countless tools and apps available today to create the look you want. If you want that pure hand-drawn look/feel where every pose, gesture, expression, apparel, background, etc. are key in telling the story, they you will need to resort to hiring an artist. 

You can achieve the look using a low-budget approach, but building a motion comic or interactive graphic novel is not about the art - it's about the story. You need a good well-written story. In fact, the story should be written similar as if you were writing a screenplay because each panel will need to be described to set the tone, mood, location, etc. Dialog is just part of the project.

With a low-budget and tools like photo conversion apps or plugins for the visuals and PowerPoint and/or Storyline for the development, you're not that far off.

If I could offer one piece of advice, though - focus on the story. The design. All the tools or how to achieve the look are already out there. If you focus on the tools first, you will restrict your story because you're trying to "fit" the story into that tool. Write the story first. Then go find the tools.

Darlene Patgunarajah

David - thank you!  I downloaded that ToonCamera app and it is fantastic.  I can now customize the characters and background exactly as I need it!   Great tip and advice - I know I was aware of such apps but for some reason I didn't think of them as an eLearning tool!  I will look at all the other links and suggestions you've provided. 

Darlene Patgunarajah

Kevin - thank you for your response - thank you for sharing your project.  And I completely share your views on the importance of the story.  I will be working with a small focus group that I think will bring a lot of value to creating that realistic story that will resonate with the learners.  Thank you for the advice.

Darlene Patgunarajah

For sure - I'll definitely be revisiting here throughout development for tips I'm sure.  Actually here's my first question.  I don't have photoshop or Adobe Ilustrator... is there a way to separate a person out from the background - i.e. make into a vector image?   So that I can overlay people onto a background (then create motion paths as suggested).?

Kevin Thorn

There is a feature in PowerPoint that removes the background of an image. It works best if there is a strong contrast between the subject you are wanting to extract from the background as the tool in PPT is not for pro editing.

There are LOTS of tutorials online how to do this. A quick search for "how to remove the background from an image in PowerPoint" revealed this top hit:

http://blog.hubspot.com/marketing/how-to-remove-background-image-in-powerpoint-design-ht

Kevin Thorn

The PwP in Action comic? Concept to completion was about 9 months. The first 6 months were writing the script, designing the scenes, drawing and preparing all the artwork. Development only took a month or so and then final testing and tweaking to close it out.

We could have done it in half or less time, but the client was new to this type of project. I spent a lot of time educating the process while they re-wrote the script a few times followed by needing approvals every time they changed the script.

Darlene Patgunarajah

Amazing.  I love this community.  Here is what I've created to satisfy that itch - simple layering of photo over background with the voice bubble.  I think I can go to bed now :)  Ignore that I cut off his body... I forgot to zoom out to see the whole image.

Ryan Martin

Hey Darlene, you may get stuck trying to mimic 'motion comics' each panel ... I'd be very careful with playing with a well established medium like a comic (if you lack the experience).

What I mean is this: the majority of people have a familiar and established 'user experience' with a comic—and that experience, if the story is compelling, can be a good without the need to shift characters & backgrounds around (which I personally think is a horrible experience).

The 'Healthcare Power Solutions - The Quake Motion Comic' is bad if it simply allows the learner to push play, then sit passively... (that experience also has someone read the comic to me?)

With that said...

Infinite Comics is the direction you may want to consider: https://en.wikipedia.org/wiki/Infinite_Comics

And it can be easily replicated in Articulate Storyline; here's some random guy on YouTube explaining Marvel's Infinite Comics: https://youtu.be/5hmbo51R6oA?t=1m6s

I recommend you watch digital comics pioneer, Mark Waid's talk, "Reinventing Comics and Graphic Novels for Digital - TOC 2013" https://www.youtube.com/watch?v=vPikusZm2As

Infinite Comics was the inspiration of my second iteration of "Broken Co-worker" - my attempt to improve on the original, and to properly take advantage of the digital space.

http://brokencoworker.com/diamond-demo/

What we have—using Articulate Storyline—is the ability to replicate the technical and creative direction of comic powerhouses Marvel & Amazon (Amazon owns Comixology).

Personally, once a story & storyboard is hashed out, and I had a talented comic artist, I'd be able to build a digital comic in a day with Storyline... *okay, maybe two days :P

Have fun,
Ryan

P.S. Second Mr. Thorn's advice: "If I could offer one piece of advice, though - focus on the story. [...] Write the story first. Then go find the tools."

P.P.S. While you write your learning story, if you're envisioning an "Infinite Comics" experience, you can quickly storyboard in Storyline, which will allow you to see & test each panel transitioning in an engaging way ... A bit of a lean development approach.

P.P.P.S. Okay. One last piece of advice: Work backwards from your learning goal, and make it activity-based (like Broken Co-worker). Try to break your story up into scene's where a decision needs to be made. Haji Kamal is the same (an activity-based scenario).

Speaking of which, here's my Haji Kamal Office Space Remix: http://brokencoworker.com/bill-lumbergh-activity/ (this example was made to illustrate the flexibility of the Haji Kamal design/learning mechanic)

/now, i better get back to work...

Darlene Patgunarajah

Wow - fabulous insight Ryan!  I am quite familiar with broken co-worker and have seen both versions - it was definitely inspiring for my project.  I like your suggestion of this 'leaner' approach with Infinite comic style and how easy it is in Articulate.  The idea for my project is to just have maybe no more than 30 seconds of story interspersed between content/concept scenes.  So the entire project won't be comic style - short comic scenes will be utilized to enhance the storytelling.  Thank you for taking the time to respond.  I will be sure to share my final project in a couple of months :)