Skip to main content
jamesqg8994329
jamesqg8994329
Participating Frequently
April 13, 2017
Question

Inserting animation graphics

  • April 13, 2017
  • 1 reply
  • 204 views

Hi there,

I am getting some animation work done for our responsive HTML5 project.   We want our instructor to walk across the screen and point at certain objects in the background. NB: on this slide there is no need for any user interactions. 

Has anyone had experience doing something similar? What is the best way to execute - full slide MP4, HTML5 on just the character which can be embedded on top of the background? Or something else?

Apologies if the answer here is obvious, this is new ground for me.

Much appreciated,

 

James

This topic has been closed for replies.

1 reply

RodWard
Community Expert
RodWardCommunity Expert
Community Expert
April 13, 2017

Is your 'instructor' an animation or video of a real person that you wanted superimposed over the top of the background content?

jamesqg8994329
jamesqg8994329Author
Participating Frequently
April 13, 2017

Hey Rod,

It's a cutout illustrated character (we will likely be providing the vectors to someone with animation expertise). So just trying to work out the best way to execute e.g. full slide MP4 video, HTML5 on just the character which can be embedded on top of the background or something else...

Our users use tablets and varied computers, so it's a responsive project - not sure if that would render HTML5 character animations more problematic than an MP4?

Thanks so much for the help.

RodWard
Community Expert
RodWardCommunity Expert
Community Expert
April 13, 2017

MP4 video is unlikely to be a solution because it doesn't have the ability to use a transparent layer as a background.

You will likely need to create your animated character as an animated GIF file using PhotoShop or Illustrator.

GIF format can have transparency.

I think you will likely run into issues with trying to do something this sophisticated in an HTML5 Responsive course because the positioning of the character and where they will be pointing is likely to change all the time.  I suggest you save yourself a lot of angst and redesign the approach to something that is more likely to work in Responsive, or else forget about using Responsive and just go with normal HTML5.

Terms & ConditionsAccessibility statement
Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices