12

I have the following CSS3 Animation going on: http://dabblet.com/gist/2884702. It's basically a simulation of a mirror rotating on its x-axis.

Now, I wish to present that in a PowerPoint presentation. Since PowerPoint doesn't have the webkit engine, I want to extract an animated GIF image of that animation, and embed it into my presentation.

The problem? No matter what I've tried, I couldn't make a reasonably smooth animated GIF.

I've Googled and found many free software which claim to do the job, tried several, none worked as expected. I've tried IrfanView, same issue (also their site makes me want to vomit).

So, is there a solution? Or am I doomed to not be able to display it?

5

Use Camstudio. It's free, and it makes a video of your desktop, and whatever you choose to display.

So... start recording, record a short video of the animation, then edit the video and crop out everything you don't need. There. You've now got a video you can either embed in your presentation, or convert to an Animated GIF file.

EDIT Ok, so you want to embed the AVI file you made of this into the presentation. According to Microsoft...

Method 4: Insert the movie as a package

You can insert a movie file as a package in a PowerPoint presentation. To do this, follow these steps:

On the Insert menu, click Object.

Click Create new, and then click Package under Object type.

When you insert a movie as a package in a PowerPoint presentation, the movie file is kept inside a package that is embedded in the presentation. If you move the presentation to another location, the package is also moved to this location.

This method is the only way that you can embed a movie into a PowerPoint presentation. A package is an OLE2 wrapper object that embeds an OLE stream into a file. This file registers itself as a Packager object. When the Packager object is opened, the contents are read. Then, the appropriate extension verb is called. Typically, an .avi file is verb-activated with Windows Media Player.

You may want to use this option if you are not concerned about the size of the PowerPoint presentation or about the speed at which the presentation will play. When you use this method, make sure that all the content is in one file. If you use this method to insert larger .avi files, the computer may experience performance issues.

Movie playback

To make the Packager object function in a presentation, follow these steps:

Right-click the inserted object, and then click Action Settings.

Click Object Actions. Then, click Activate Contents in the Object Actions list.

When you click the Packager object in a presentation, the movie is played back in a separate window above the presentation.

That's from this Microsoft Article

Now, if you'd rather convert the AVI to a GIF file to make embedding it easier, you can use an online converter like Zamzar.

  • I'll give it a try and get back to you on that – Madara's Ghost Jun 9 '12 at 15:18
  • How can I embed it in my presentation? (Not link to it, but embed it inside) – Madara's Ghost Jun 9 '12 at 15:24
  • @truth I'll edit the answer to include that – Bon Gart Jun 9 '12 at 21:29
7

You can try Cockos LICEcap. LICEcap is GPL free software. It directly captures the screen and saves it in .GIF or .LCF formats.

Some of the features of LICEcap (from its website):

Features and options:

  • Record directly to .GIF or .LCF.
  • Move the screen capture frame while recording.
  • Pause and restart recording, with optional inserted text messages.
  • Global hotkey (shift+space) to toggle pausing while recording
  • Adjustable maximum recording framerate, to allow throttling CPU usage.
  • Basic title frame, with or without text.
  • Record mouse button presses.
  • Display elapsed time in the recording.

See a GIF version of your animation :)

enter image description here

1

Looks like someone has created a tool here: https://www.npmjs.com/package/@scenejs/render

source: https://github.com/daybrush/scenejs-render

I haven't tried using it yet, so can't vouch for it, but it claims to convert css animations to video files.

  • I upvoted you, because the page at npmjs.com/package/@scenejs/render seems to say it does just what you and I want. (I want to convert SVG/CSS animation to video.) But, @scenejs/render is as user-unfriendly as barbed wire in the groin. I just tried "npm install @scenejs/render" as advised on that page. It gave me two errors. Firstly, one about needing to "install a peer of @daybrush/utils". What is a peer??? Secondly, one about "no such file or directory, open package.json". No explanation what these mean, but can't the authors just write this software to install smoothly? – Phil van Kleur Nov 20 '20 at 10:43
0

You can test: GifCam.

- Version 4.5 - 686 KB (single exe file no install required). - Compatible With Windows 8,7,Vista,XP.

  • Practical, easy and fun animated gif making app.
  • Works like a camera that stays on top of all windows so you can move it and resize it to record your desired area.
  • GifCam has only a mouse-centric interface.

Capture easily : When you’re ready, click “Rec” to start recording or click “Frame” to record a single frame.

  • Full Screen to ignores recording area and capture the Full Screen.
  • Preview: preview with size.
  • Recording different frames dimensions (resize while recording).
  • Capture cursor: useful for demonstrating the mouse interaction.
  • Export To AVI: export your record to uncompressed video.

Capture / Editing: Simple and powerful.

  • Adjust frames delay, Delete frames/add or remove delays, Resize, Crop, Adds reverse frames, 5 color settings,Hue And Saturation, Add text etc...
  • 3
    Your answer significantly reads like ad copy. You might want to edit your answer to actually focus on how your suggested solution would work for the specific answer, rather than copy/pasting every single feature. More is less here. – Journeyman Geek Mar 24 '15 at 6:18
  • Yes, I have copied the description:but reorganize it in many part(delete redundant infos, move infos in other location,etc...). Read the link i provide to see. i am not the author of this app by it's so simple you can't see all the possibility it provide in one simple way... – decembre Mar 24 '15 at 9:50
  • Whatever this is, it is not an answer. – Giacomo1968 Mar 25 '15 at 4:05
  • That's the same type of answer that the others about LICEcap . – decembre Mar 26 '15 at 12:13
  • @decembre - We (I) have problems with those other answers as well. So you defend your submission, by saying here is even worst, not the smartest thing to do. – Ramhound Sep 30 '15 at 18:39
0

You can check online site http://html5animationtogif.com . This is an online paid conversion service. As per my observation, I was able to convert GIF from html animation with very small file size. My Gif file size was just half of the gif which was recorded through desktop recording tool. One more thing, it takes more time to convert css animation into gif as compared to desktop tool

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.