Jump to content


Photo

After Effects to HTML5

after effects html5

  • Please log in to reply
5 replies to this topic

#1 madmonk

madmonk

    Newbie

  • Members
  • 18 posts
  • Gender:Male
  • Location:Rome, IT
  • Interests:Music, playing guitar, mountain biking, travelling, geekin out, blowing bubbles

Posted 04 February 2013 - 05:10 PM

Hi everyboy,

 

here's the point, a client wants to somehow realize several interactive videos in which the movie stops and you are prompt with an interface where you can choose various alternatives. The point is that I don't exactly know if I can be of any use since this sounds to me more like a website or an app than like a video.

Correct me if I'm wrong: my guess is that they need to build a website probably taking advantage of the new features in HTML5. So I was thinking, what if I animate the graphics over the video in AE and then I'd want to export it as "instructions" to be coded from a wed dev?

 

I was searching the web and I got over this http://blog.motionbo...m/ae-to-css3-75 and this http://aescripts.com/xml-gibson/

 

I have no clues about coding and web development, so at the moment I still don't know what to say to the client since I don't know if I'm able to offer them any service at all.

 

Are those XML files of any use in the case I'd want to animate in AE and export to HTML5?

 

Thanks in advice.

 

M.



#2 Aaron Scott

Aaron Scott

    MoGraph Demi-god

  • Members
  • 549 posts
  • Gender:Male
  • Location:Vancouver

Posted 04 February 2013 - 05:39 PM

This would actually be pretty trivial for a web developer (speaking as a former web developer). No fancy AE XML exports required -- just save each option as its own video and let the developer know how it all hooks up. They can code an interface that pops up when each video finishes that lets you pick the next option.



#3 madmonk

madmonk

    Newbie

  • Members
  • 18 posts
  • Gender:Male
  • Location:Rome, IT
  • Interests:Music, playing guitar, mountain biking, travelling, geekin out, blowing bubbles

Posted 04 February 2013 - 05:57 PM

Thanks for the answer Aaron, 

 

so basicly you're saying that the interface animation in the case of a HTML5 website will be animated by a web dev, right? That's my point, no job for me nor for AE. I can't actually figure out a workflow in which my AE abilities could be handy in this particular case.

I'm forgetting to mention the fact that the graphics are going to be created by another graphic designer.

 

Am I on a wrong track?



#4 Hamilton

Hamilton

    MoGraph Superstar

  • Members
  • 109 posts
  • Gender:Male
  • Location:Victoria BC, Canada
  • Interests:SKATE, BEER, MOTION, PHOTOGRAPHY -- now repeat 24/7

Posted 04 February 2013 - 09:55 PM

Years ago I did something similar within Flash. What you would do is make all the appropriate animation. Think of it as a choose your own adventure book. When video 1 finishes playing an interface pops up allowing the user to make their choice. You have the X number of video options all stored in a folder and the web coder just links to the correct video to play next based on the users input. 

 

As for the UI graphics done by someone else, that wouldn't matter either. You just create the videos that get embedded or loaded into the interface.

 

They can convert AE renders to load in as FLV's or stream as QT's or what ever they need as video playback, so working in AE is all good.



#5 hamax1

hamax1

    MoGraph Superstar

  • Members
  • 118 posts
  • Gender:Male
  • Location:Redmond, Washington
  • Interests:xbox, comics, board games, beer, lacrosse

Posted 05 February 2013 - 07:04 PM

 I've seen this done with great effect using Youtube only: 



#6 eliss

eliss

    MoGraph Superstar

  • Members
  • 184 posts
  • Gender:Male
  • Location:Orange County, Ca.
  • Interests:Design / Music

Posted 06 February 2013 - 06:13 PM

Yah, a dev will know how to stitch the videos together. We just finished a project http://ninja6r.kawasaki.com/tour which uses similar functionality you are looking for.
On your end all you need to do is save out your different formats for different browsers. WebM, MP4 and OOG. And, let the dev plug everything in.


Site and reel : Eric Liss.com






Also tagged with one or more of these keywords: after effects, html5

0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users