8 ms·

Show HN: FFmpeg Command Visualizer and Editor

279 points by zackoverflow 4y ago

kretaceous 4y ago
I think this is the best take among any ffmpeg GUIs I've seen. Good job! Gonna take this for a spin.
- xuhu 4y ago
  I really wish someone makes an ffmpeg GUI that gives you a visual editing timeline but also allows you to use filtergraphs.
  - jcelerier 4y ago
    i've been thinking on having an ffmpeg filter object in https://ossia.io https://ossia.io for quite some time, which would give the timeline aspect for free (and wouldn't be too hard to integrate as ffmpeg is already used for decoding A/V and we have a very very simple plug-in API which supports audio, video and GPU processing : https://celtera.github.io/avendish https://celtera.github.io/avendish ). Just not a priority... but if someone is interested in contributing it I can definitely mentor.
- swyx 4y ago
  what other ffmpeg GUIs are there?
shireboy 4y ago
One thing I wish ffmpeg tools - including this one- would do better is account for live inputs and outputs. I’ve come up with the incantations to do live rtsp to hls, webcam to hls and more, but it’s always something I have to relearn.
- zackoverflow 4y ago
  I haven't played much with live IO with ffmpeg. Tell me more about the difficulties of this usecase, I'd love to make it a better experience
  - shireboy 4y ago
    The main thing I’ve done is take RTMP/RTSP from network cameras (im doing this for traffic cameras) and push to HLS. This is very powerful as you can take a camera that otherwise would require a special viewer and play in any modern browser with no plugins. Also HLS is over HTTP, so it’s cacheable. I have to craft the ffmpeg arguments fresh each time I do this, but the main reason I commented was because many ffmpeg tools - like handbrake and jmeter load testing plugins etc are geared towards fixed length inputs, not indefinite live streaming cameras. There are plenty of streaming servers etc, but just seems like there is a missing niche for lightweight ffmpeg tooling that helps do this.
zackoverflow 4y ago
Hey OP here, I spend a significant amount of time generating complex FFmpeg filtergraphs for my project. They can get really long and cumbersome, so I made this tool that lets you visualize and edit them, and generates the FFmpeg command string for you. It sort of became an IDE/LSP for FFmpeg filters. My biggest problems were having to constantly to flip to FFmpeg documentation and errors in my filters. So I added autocomplete and embedded the FFmpeg docs. It also verifies the correctness of filters/arguments, and does an analysis on the graph to verify connections/etc.
- irthomasthomas 4y ago
  Looks great. Should be a big help. Can I check out the code?
  - deleted 4y ago
    [deleted]
- heavyset_go 4y ago
  What's your opinion on libraries like python-ffmpeg that allow you to build filter graphs programmatically with tree-like data structures?
  - zackoverflow 4y ago
    I haven't played around much with ffmpeg-python, I used to use fluent-ffmpeg for a bit. They're an improvement over writing raw command strings, but they lack static analysis features to verify the correctness of your command at compile time. There's only so much you can do with the constraints of general programming languages. I'm going to add the ability to export graphs as ffmpeg-python/fluent-ffmpeg code, and to import a graph from ffmpeg-python/fluent-ffmpeg code as well.
    - TsiCClawOfLight 4y ago
      In something like Haskell or OCaml, it would be possible to verify the tree/graph at compile the time. That's why functional languages with powerful (or even dependent) type systems are so popular!
leros 4y ago
This is really cool. Ffmpeg is really suited for this type of visual programming flow. Is this code open source? I could use something like this in one of my own projects.
- cryogenicplanet 4y ago
  Nope this is not open source, but the flow interface is made with react-flow which is https://reactflow.dev/ https://reactflow.dev/
HAL9OOO 4y ago
This is a godsend considering I'm just starting an FFMPEG project right now. Do you have any other resources you recommend to fully grasp FFMPEG and even what it's capable of? This website is awesome btw!
- dylan604 4y ago
  practice practice practice. if you're using ffmpeg as a one of project, then you'll never grok it. if you're using ffmpeg as a daily tool doing many things, you'll almost start to think you grok it, but then still learn something new about it. whatever your current need of ffmpeg is right now, it is probably such a small subset of what it can do that you'll forever be amazed at what other people are doing with it. if you're stuck on something and can't find an answer, keep trying to rephrase your question. i'd put money down that it is highly unlikely you are the first person attempting whatever you are doing, and it is very likely someone else has had issues like you. sometimes, searching for the exact error message isn't as useful as one would hope, but with enough time you'll start to recognize how/why those errors are what ffmpeg is struggling with but it is actually something related that you need to address.
- swyx 4y ago
  hopping on to this - i'm interested in doing my own audio waveforms, but the only documentation on this I can find is https://trac.ffmpeg.org/wiki/Waveform https://trac.ffmpeg.org/wiki/Waveform wondering if theres a standard set of tooling for creating audio waveform videos?
- asicsp 4y ago
  Here are some resources that may help: * https://ffmpeg.org/ffmpeg.html https://ffmpeg.org/ffmpeg.html * https://github.com/mpenkov/ffmpeg-tutorial/blob/master/README.md https://github.com/mpenkov/ffmpeg-tutorial/blob/master/READM... * https://wiki.archlinux.org/index.php/FFmpeg https://wiki.archlinux.org/index.php/FFmpeg
rychco 4y ago
Seems like a really great idea, and the few times I used ffmpeg I could have really benefited from this. That being said, I almost exclusively prefer email signup over Google sign-in.
- poisonborz 4y ago
  I can understand not wanting to create an email-password login, but imagine for a moment losing your Google account for any reason, and losing all your accounts associated with it.
- l0b0 4y ago
  I don't want any kind of sign-in for stuff like this. Just send me straight to the interface.
  - cryogenicplanet 4y ago
    You can go to https://ffmpeg.guide/demo https://ffmpeg.guide/demo
- cryogenicplanet 4y ago
  Will add a email auth provider and ship that in a couple of hours, made it Google only cause it was the fast way to ship. Will probably add Github oauth too
  - altbdoor 4y ago
    Probably caught you guys on a bad time. The GitHub OAuth is redirecting to localhost:3000 on success :-P
    - cryogenicplanet 4y ago
      Oh shit, I forgot to change that back my bad. Should be fixed!
ChrisMarshallNY 4y ago
That's awesome! Thanks so much! People make entire careers off tuning ffmpeg.
cyberphobe 4y ago
Why is it asking me to sign into my Google account?
- KMnO4 4y ago
  Surely you’ve heard of OAuth. But if that’s rhetorical/curt, then the answer can also be found on the home page of the site: it’s a service with a paid component and the login is to associate the purchase with your account. Very common across the web.
  - onion2k 4y ago
    That explains signing in to pay for the service or to access the paid tier options, but why do you need to sign in before that?
    - thrdbndndn 4y ago
      So they can track their users? The free tier users are still users.
    - cryogenicplanet 4y ago
      You don't, go to https://ffmpeg.guide/demo https://ffmpeg.guide/demo you can use the free version without signing in
Xenoamorphous 4y ago
ffmpeg is such a great tool, it’s complex but because video stuff is complex. Shoutout to llogan and gyan in StackOverflow, I don’t think I could’ve done a few things without their help.
crazygringo 4y ago
First of all, I love this. ffmpeg is the closest to magic, with the arguments the closest to Harry Potter-type spells, I've ever seen. Second... I swear it makes me want something like this for shell commands in general. The amount of time I've wasted trying to fix nightmare quoting and spacing issues when passing arguments (containing spaces) that get to a command that will run ssh to run a command remotely that needs those original arguments... I swear if there were a visual command-line builder that guaranteed quotes and spaces and variables were always printed and escaped correctly, together with a visual reminder of what the -akxlIEJC flags all mean... in other words, I want this but for way more than just ffmpeg! :)
- RupertEisenhart 4y ago
  Hard agree until-- Copilot changed all this for me. Even using ffmpeg, now I just open a .sh and describe the functions that I want in comments and fiddle with what copilot gives me. Copilot is at it's best writing dumb little shell scripts. Just today I was asking it to help me extract gps coords from a json with jq. A dream.
  - deleted 4y ago
    [deleted]
- olex 4y ago
  Something like this for ImageMagick would be awesome. Its CLI syntax is not quite as arcane as FFmpeg, but the sheer breadth of available options and the power of possible combinations is similarly insane.
throwoutway 4y ago
This looks great. What was the graphing made of? I think I recognize the library but can't remember the name
- cryogenicplanet 4y ago
  react-flow
manca 4y ago
This is brilliant. A long time ago when I worked on Windows video apps, I used to use Graph Studio[1] to visualize the video graph comprised of countless DirectShow filters. It occurred to me multiple times that such a tool would be super useful for ffmpeg as well. It really helps visualize your filter graphs, especially when building complex video processing pipelines. Too bad this is not open source... I'd be more than happy to contribute. [1] https://github.com/cplussharp/graph-studio-next https://github.com/cplussharp/graph-studio-next
cloudking 4y ago
Nice idea! Does this handle transcoding parameters for MPEG-DASH?
imbnwa 4y ago
I'm working on video capture automation with ffmpeg.wasm and was just looking for something like this
deleted 4y ago
[deleted]
deleted 4y ago
[deleted]
andrewstuart 4y ago
And just for fun - an interview with an ffmpeg enthusiast: https://www.youtube.com/watch?v=9kaIXkImCAM https://www.youtube.com/watch?v=9kaIXkImCAM
RMPR 4y ago
Doesn't seem to work on Firefox mobile.
qwerty456127 4y ago
How do I tweak the output encoding parameters? Will this help by suggesting possible parameters, values and meanings for specific codecs?
Rovoska 4y ago
Holy hell, this is beautifully done. A great way for me to get a feel of what I'm actually writing, and faster too. 5/5

279 points by zackoverflow 4y ago

kretaceous 4y ago

I think this is the best take among any ffmpeg GUIs I've seen. Good job! Gonna take this for a spin.

xuhu 4y ago
I really wish someone makes an ffmpeg GUI that gives you a visual editing timeline but also allows you to use filtergraphs.
- jcelerier 4y ago
  i've been thinking on having an ffmpeg filter object in https://ossia.io https://ossia.io for quite some time, which would give the timeline aspect for free (and wouldn't be too hard to integrate as ffmpeg is already used for decoding A/V and we have a very very simple plug-in API which supports audio, video and GPU processing : https://celtera.github.io/avendish https://celtera.github.io/avendish ). Just not a priority... but if someone is interested in contributing it I can definitely mentor.
swyx 4y ago
what other ffmpeg GUIs are there?

shireboy 4y ago

One thing I wish ffmpeg tools - including this one- would do better is account for live inputs and outputs. I’ve come up with the incantations to do live rtsp to hls, webcam to hls and more, but it’s always something I have to relearn.

zackoverflow 4y ago
I haven't played much with live IO with ffmpeg. Tell me more about the difficulties of this usecase, I'd love to make it a better experience
- shireboy 4y ago
  The main thing I’ve done is take RTMP/RTSP from network cameras (im doing this for traffic cameras) and push to HLS. This is very powerful as you can take a camera that otherwise would require a special viewer and play in any modern browser with no plugins. Also HLS is over HTTP, so it’s cacheable. I have to craft the ffmpeg arguments fresh each time I do this, but the main reason I commented was because many ffmpeg tools - like handbrake and jmeter load testing plugins etc are geared towards fixed length inputs, not indefinite live streaming cameras. There are plenty of streaming servers etc, but just seems like there is a missing niche for lightweight ffmpeg tooling that helps do this.

zackoverflow 4y ago

Hey OP here, I spend a significant amount of time generating complex FFmpeg filtergraphs for my project. They can get really long and cumbersome, so I made this tool that lets you visualize and edit them, and generates the FFmpeg command string for you. It sort of became an IDE/LSP for FFmpeg filters. My biggest problems were having to constantly to flip to FFmpeg documentation and errors in my filters. So I added autocomplete and embedded the FFmpeg docs. It also verifies the correctness of filters/arguments, and does an analysis on the graph to verify connections/etc.

irthomasthomas 4y ago
Looks great. Should be a big help. Can I check out the code?
- deleted 4y ago
  [deleted]
heavyset_go 4y ago
What's your opinion on libraries like python-ffmpeg that allow you to build filter graphs programmatically with tree-like data structures?
- zackoverflow 4y ago
  I haven't played around much with ffmpeg-python, I used to use fluent-ffmpeg for a bit. They're an improvement over writing raw command strings, but they lack static analysis features to verify the correctness of your command at compile time. There's only so much you can do with the constraints of general programming languages. I'm going to add the ability to export graphs as ffmpeg-python/fluent-ffmpeg code, and to import a graph from ffmpeg-python/fluent-ffmpeg code as well.
  - TsiCClawOfLight 4y ago
    In something like Haskell or OCaml, it would be possible to verify the tree/graph at compile the time. That's why functional languages with powerful (or even dependent) type systems are so popular!

leros 4y ago

This is really cool. Ffmpeg is really suited for this type of visual programming flow. Is this code open source? I could use something like this in one of my own projects.

cryogenicplanet 4y ago
Nope this is not open source, but the flow interface is made with react-flow which is https://reactflow.dev/ https://reactflow.dev/

HAL9OOO 4y ago

This is a godsend considering I'm just starting an FFMPEG project right now. Do you have any other resources you recommend to fully grasp FFMPEG and even what it's capable of? This website is awesome btw!

dylan604 4y ago
practice practice practice. if you're using ffmpeg as a one of project, then you'll never grok it. if you're using ffmpeg as a daily tool doing many things, you'll almost start to think you grok it, but then still learn something new about it. whatever your current need of ffmpeg is right now, it is probably such a small subset of what it can do that you'll forever be amazed at what other people are doing with it. if you're stuck on something and can't find an answer, keep trying to rephrase your question. i'd put money down that it is highly unlikely you are the first person attempting whatever you are doing, and it is very likely someone else has had issues like you. sometimes, searching for the exact error message isn't as useful as one would hope, but with enough time you'll start to recognize how/why those errors are what ffmpeg is struggling with but it is actually something related that you need to address.
swyx 4y ago
hopping on to this - i'm interested in doing my own audio waveforms, but the only documentation on this I can find is https://trac.ffmpeg.org/wiki/Waveform https://trac.ffmpeg.org/wiki/Waveform wondering if theres a standard set of tooling for creating audio waveform videos?
asicsp 4y ago
Here are some resources that may help: * https://ffmpeg.org/ffmpeg.html https://ffmpeg.org/ffmpeg.html * https://github.com/mpenkov/ffmpeg-tutorial/blob/master/README.md https://github.com/mpenkov/ffmpeg-tutorial/blob/master/READM... * https://wiki.archlinux.org/index.php/FFmpeg https://wiki.archlinux.org/index.php/FFmpeg

rychco 4y ago

Seems like a really great idea, and the few times I used ffmpeg I could have really benefited from this. That being said, I almost exclusively prefer email signup over Google sign-in.

poisonborz 4y ago
I can understand not wanting to create an email-password login, but imagine for a moment losing your Google account for any reason, and losing all your accounts associated with it.
l0b0 4y ago
I don't want any kind of sign-in for stuff like this. Just send me straight to the interface.
- cryogenicplanet 4y ago
  You can go to https://ffmpeg.guide/demo https://ffmpeg.guide/demo
cryogenicplanet 4y ago
Will add a email auth provider and ship that in a couple of hours, made it Google only cause it was the fast way to ship. Will probably add Github oauth too
- altbdoor 4y ago
  Probably caught you guys on a bad time. The GitHub OAuth is redirecting to localhost:3000 on success :-P
  - cryogenicplanet 4y ago
    Oh shit, I forgot to change that back my bad. Should be fixed!

ChrisMarshallNY 4y ago

That's awesome! Thanks so much! People make entire careers off tuning ffmpeg.

cyberphobe 4y ago

Why is it asking me to sign into my Google account?

KMnO4 4y ago
Surely you’ve heard of OAuth. But if that’s rhetorical/curt, then the answer can also be found on the home page of the site: it’s a service with a paid component and the login is to associate the purchase with your account. Very common across the web.
- onion2k 4y ago
  That explains signing in to pay for the service or to access the paid tier options, but why do you need to sign in before that?
  - thrdbndndn 4y ago
    So they can track their users? The free tier users are still users.
  - cryogenicplanet 4y ago
    You don't, go to https://ffmpeg.guide/demo https://ffmpeg.guide/demo you can use the free version without signing in

Xenoamorphous 4y ago

ffmpeg is such a great tool, it’s complex but because video stuff is complex. Shoutout to llogan and gyan in StackOverflow, I don’t think I could’ve done a few things without their help.

crazygringo 4y ago

First of all, I love this. ffmpeg is the closest to magic, with the arguments the closest to Harry Potter-type spells, I've ever seen. Second... I swear it makes me want something like this for shell commands in general. The amount of time I've wasted trying to fix nightmare quoting and spacing issues when passing arguments (containing spaces) that get to a command that will run ssh to run a command remotely that needs those original arguments... I swear if there were a visual command-line builder that guaranteed quotes and spaces and variables were always printed and escaped correctly, together with a visual reminder of what the -akxlIEJC flags all mean... in other words, I want this but for way more than just ffmpeg! :)

RupertEisenhart 4y ago
Hard agree until-- Copilot changed all this for me. Even using ffmpeg, now I just open a .sh and describe the functions that I want in comments and fiddle with what copilot gives me. Copilot is at it's best writing dumb little shell scripts. Just today I was asking it to help me extract gps coords from a json with jq. A dream.
- deleted 4y ago
  [deleted]
olex 4y ago
Something like this for ImageMagick would be awesome. Its CLI syntax is not quite as arcane as FFmpeg, but the sheer breadth of available options and the power of possible combinations is similarly insane.

throwoutway 4y ago

This looks great. What was the graphing made of? I think I recognize the library but can't remember the name

cryogenicplanet 4y ago
react-flow

manca 4y ago

This is brilliant. A long time ago when I worked on Windows video apps, I used to use Graph Studio[1] to visualize the video graph comprised of countless DirectShow filters. It occurred to me multiple times that such a tool would be super useful for ffmpeg as well. It really helps visualize your filter graphs, especially when building complex video processing pipelines. Too bad this is not open source... I'd be more than happy to contribute. [1] https://github.com/cplussharp/graph-studio-next https://github.com/cplussharp/graph-studio-next

cloudking 4y ago

Nice idea! Does this handle transcoding parameters for MPEG-DASH?

imbnwa 4y ago

I'm working on video capture automation with ffmpeg.wasm and was just looking for something like this

deleted 4y ago

[deleted]

deleted 4y ago

[deleted]

andrewstuart 4y ago

And just for fun - an interview with an ffmpeg enthusiast: https://www.youtube.com/watch?v=9kaIXkImCAM https://www.youtube.com/watch?v=9kaIXkImCAM

RMPR 4y ago

Doesn't seem to work on Firefox mobile.

qwerty456127 4y ago

How do I tweak the output encoding parameters? Will this help by suggesting possible parameters, values and meanings for specific codecs?

Rovoska 4y ago

Holy hell, this is beautifully done. A great way for me to get a feel of what I'm actually writing, and faster too. 5/5