Timeline cropping after capture is made

[jlmitch5]

Awesome tool!

A cool feature would be cropping of the timeline to remove parts of the capture that are not important to the flow you are trying to show in the gif (things like "moving your mouse to a button", "time it takes to get back to the menu bar to click to stop recording").

The use case I'm thinking about is using screen captures for blog posts that explain a new feature of a web app. See the gif I put in here for an example. If I would have had an easy tool for cropping off the "stall" at the end of the loop, it would have improved the quality of the gif.

Thinking from a ux-perspective, it seems it would make sense if the bar giving loop position was able to deal with user interaction to set these "time-line crop" points. Screen shot shows this idea.

[stursby]

@jlmitch5 are you referring to something like the "Trim" feature in Quicktime?

[jlmitch5]

@stursby exactly 👍

[skllcrn]

Thank you @jlmitch5! We are really cautious about moving into anything related to editing, see my reply on #104. That being said trimming (and cropping) in the editor is something we're actively considering, though it might be split out as an optional plugin. We've even gone as far as exploring design solutions for it!

[jlmitch5]

Very nice! Random thoughts for consideration.

• should the interface allow cropping something out of the middle of the recording, instead of just at the beginning and the end? I would assume that beginning/end crops would probably cover a large number of the cases people will want to crop.
• do you need to provide the action buttons in your screenshot? They seem like they might imply destructive editing of the recording, so if you do include them, you'll probably want to include "undo" functionality (as users will inevitably make a crop that they didn't want to do). An alternative would be to provide the trimming handles in the editor pane you have now (not make trimming a separate "flow"), and have the trim applied only when the user clicks save. This alternative may be more in line with the "we're not an editor" mantra. The trade-off is that it could clutter up the interface.
• Something that I think could be improved on from the quicktime screenshot @stursby posted is that when the user moves the handle, the preview window "scrubs" through the recording to show the start/end points you're about to set. That way you can be more surgical about what you're trying to trim out.
• I like that you included start/end times. I think that provides the benefit of allowing the user to easily trim the recording to an exact length if that is a requirement for them.

[iansinnott]

Just throwing my two cents in here: This would be a tremendous feature for Kap.

I've been using Kap for a while now and it is great (really good job), but the first thing I tried to do after taking a screencap was to trim it. There is always a bit of lagtime in my gifs where I set up the scene or move the mouse into the right position.

Not turning into an editor is very wise. Kap is great for its simplicity. But trimming would be an excellent exception, and as mentioned above Quicktime is a good example of software that wouldn't be considered a video editor but does support trimming.

[timothyis]

I believe we're going to go ahead and make this a feature for Kap 🎉

An addition to this could be that you could make multiple files out of the same recording via trimming. (Source: https://twitter.com/Stammy/status/851944793404047360)

[codeluggage]

Can I read about the latest developments on this somewhere? Would love this feature/plugin 💯

[albinekb]

Started prototyping this: https://trimline.now.sh/

[Hum4n01d]

Can’t wait! Until then, Kap isn’t very useful to me.

[lukasoppermann]

Hey, is there a status for this anywhere? The problem is that it is very hard to capture something currently because the shortcuts clash for example with framer and if I use the stop button it is visible in the video. While it is easy to crop mp4 with quickTime, if you want to create gifs you are at a loss as nearly no tool is capable of cropping gifs nicely.

[Hum4n01d]

Same @lukasoppermann

[sindresorhus]

@codeluggage @lukasoppermann @Hum4n01d https://twitter.com/slicknet/status/782274190451671040

This is something we also really want to see exist, but it's summer, and all of us has been busy in real life. Contributions are always welcome. Remember that this is a free open-source project. We work on it for fun when we can.

[lukasoppermann]

Hey @sindresorhus I did not mean in any way to suggest you are not caring or that you need to work more on the project. I was merely wondering if there is a status from which one could guess when a feature like this might be available.

I have seen other projects for example gulpjs, where more detailed road maps exist but are not easy to find.

[skllcrn]

Hi @lukasoppermann, you can follow our projects and milestones. If you'd rather get email updates, you can sign up for those on getkap.co

[Hum4n01d]

Thanks @sindresorhus for sharing that tweet; never seen that one before. I'll keep that in mind for the future 😃

[evansalter]

I've started working on this. So far I have the UI completed, allowing you to select a portion of the kapture to keep, and the preview will only show that part. Here's a gif of it:

The trimmer handles I currently have in there are just placeholders for now. I'm not much of a designer, so if someone could provide SVGs for the in/out marker icons that would be fantastic. If not, I'll do my best to make it look decent.

Next step is update the conversion to only use the selected part of the video. This is done. I will be opening a PR soon!