Member Avatar for William Hemsworth

Hi all, I'm a very early user of Daniweb, and after a long break, and I'm hoping to participate a bit more in this forum again.

I'm here specifically for some advice before starting a new project of mine. I'm an experienced C++ / Win32 developer, but seem to be having trouble coming up with a good way of encoding AVI videos, or animated GIFs (or both!), in such a way that they will be quick to load and watch on my website. I don't really care about the final video output type, as long as I can upload them to my website and have them load up fairly quickly and render in high quality, cross-platform and on different browsers, whether it's using HTML5, GIF, or whatever. It doesn't have to be 100% lossless, but the higher the quality, the better.

I love making physics & biology simulations, and have already had some success building up a simulation framework in C++ capable of generating AVI videos, but the AVI encoding was unreliable, often problematic, and basically I want to have another go at doing this properly in a nice efficient and low-level way. I want to be able to create videos and/or animations which I can upload on to my website, and render detailed animations with as little loading time as possible - which I assume will require some basic level of compression.

Can anybody point me in the right direction, or reccommend any specific libraries? I like working quite low-level, I basically just want to feed an array of bitmaps to a video encoder and have it do all the dirty work for me, but the file size is either always too large, or the quality too low. I often do particular simulations where each particle is just 1 pixel in size, and lossy compression can really ruin the effect. How are people able to encode long 1-2 hour movies in high quality and maintain such a relitavely small filesize?

Thanks in advance!

Edit: Just as an example, I'd like to be able to create GIFs like these using raw C++:

I'd also like the ability to display larger & longer animations, but for that, youtube might be more appropriate.

Edit 2: More examples:

http://33.media.tumblr.com/7da3cc785c66cce44e03fd433996de76/tumblr_nl4l4f4Xzf1u93xcqo1_500.gif

http://38.media.tumblr.com/fb583d4c627fc91ce6203f2e8f15e08e/tumblr_nldy1onAsZ1tjki5do1_500.gif

Edited by William Hemsworth because: Example given
  • 2 Contributors
  • 1 Reply
  • 478 Views
  • 28 Minutes Discussion Span
  • Latest Post Latest Post by rproffitt

Dani AI

Generated

Quick practical add-on for (and good call by about ffmpeg): treat the problem as a two-stage pipeline — (A) produce and archive an exact, lossless frame sequence from your C++ renderer, and (B) make one or more web-friendly variants (GIF/APNG/WebP for short loops, MP4/WebM/AV1 for longer playback). That keeps a perfect master you can re-encode without rerunning the simulation, and lets you pick the best tradeoff of quality vs. size for each audience.

Useful ffmpeg examples (start from sequential PNGs):

ffmpeg -framerate 30 -i frame%05d.png -c:v ffv1 archive.mkv

ffmpeg -framerate 30 -i frame%05d.png -c:v libx264rgb -crf 0 -preset slow -pix_fmt rgb24 out_lossless.mkv

ffmpeg -framerate 30 -i frame%05d.png -c:v libx264 -crf 18 -preset slow -pix_fmt yuv420p -movflags +faststart out_web.mp4

ffmpeg -i input.mp4 -vf "fps=15,scale=640:-1:flags=lanczos,palettegen" palette.png
ffmpeg -i input.mp4 -i palette.png -lavfi "fps=15,scale=640:-1:flags=lanczos [x];[x][1:v] paletteuse" out.gif

Why those choices and what to watch for: GIF is limited to 256 colors and aggressive quantization/dithering — it will lose 1‑pixel details unless you up the resolution or carefully tune the palette. Most consumer H.264/VP9 pipelines use chroma subsampling (yuv420p) which smears color information and can destroy single‑pixel particles; to preserve every pixel, encode in RGB or use yuv444p/lossless modes (but be aware of playback compatibility and larger files). For the web, provide an MP4 (H.264) fallback plus a WebM/AV1 variant for better compression, or keep the particle layer out of the raster altogether and recreate it in the browser (Canvas/WebGL) on top of a compressed background video.

Troubleshooting: if particles vanish, try the lossless master or rgb/yuv444p encodes; if files are huge, use a high‑quality CRF (16–20) and a slower preset; for GIFs always use the palettegen/paletteuse two-step workflow.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.