Create a Waveform Image with ffmpeg
Waveform images have a variety of uses and I've started seeing waveform images overlaying at the bottom of videos. That type of feature seems useful if you want to see identify music in a video or specific spaces in a video which feature action. If you're creating an audio-centric app, you may have a dozen uses for the waveform image.
You can easily create a waveform image using the amazing ffmpeg utility with a very short command:
ffmpeg -i input -filter_complex "showwavespic=s=640x120" -frames:v 1 output.png
The image you'll get back will look similar to:
There are a variety of customizations you can create for waveform image as detailed in the ffmpeg waveform documentation. Take some time to experiment with all of the features provided by ffmpeg -- you can do amazing things with media!
![Create a Sheen Logo Effect with CSS]()
I was inspired when I first saw Addy Osmani's original ShineTime blog post. The hover sheen effect is simple but awesome. When I started my blog redesign, I really wanted to use a sheen effect with my logo. Using two HTML elements and...
![Being a Dev Dad]()
I get asked loads of questions every day but I'm always surprised that they're rarely questions about code or even tech -- many of the questions I get are more about non-dev stuff like what my office is like, what software I use, and oftentimes...
![Telephone Link Protocol]()
We've always been able to create links with protocols other than the usual HTTP, like mailto, skype, irc ,and more; they're an excellent convenience to visitors. With mobile phone browsers having become infinitely more usable, we can now extend that convenience to phone numbers:
The tel...
![9 Mind-Blowing Canvas Demos]()
The <canvas> element has been a revelation for the visual experts among our ranks. Canvas provides the means for incredible and efficient animations with the added bonus of no Flash; these developers can flash their awesome JavaScript skills instead. Here are nine unbelievable canvas demos that...
How do you get a transparent background?
Is it possible to build waveform image using
offlineAudioContext? Seems like the exact tool for the job.