Giter VIP home page Giter VIP logo

framecrafter-logo-banner

Fast, extensible, video editor in the browser.


Warning This project is very early and most code here might be WIP, POC, or simply non-functional. For up-to-date information about the project status, please join us on Discord.

πŸ€” Motivation

Video is becoming the most important medium for sharing information online. Apps like TikTok and YouTube Shorts have dramatically democratized the production and publishing process. Tools like automagic background removal, facetracking, filters and effects come standard in these in-app editors.

However, the production process in traditional, industry-standard NLEs like Final Cut, Premiere, and Resolve has not caught up. For example, keying out a greenscreen is still a highly manual, repetitive, three or four step process.

Framecrafter is on a mission to change that. We're building an industry leading video editor from the ground up that pushes the boundaries of what's possible with today's current technology.

Our goal is for Framecrafter to be a blazingly fast and highly extensible NLE with a rich plugin ecosystem that allows creators everywhere to work at the speed of thought.

Oh, and did I mention we plan to have Framecrafter run entirely in the browser and be free to anyone with an internet connection?

It's going to be a wild ride. So, star the project and join us on Discord. We're going to need all the help we can get πŸ’ͺ.

πŸ’» Tech Background

Up until now, in-browser video editors have been implemented using the popular ffmpeg library either server-side or in-browser using Web-Assembly (WASM). However, these strategies come with serious UX and performance tradeoffs.

Encoding server-side means that creators have to upload their footage before working with it. And WASM implementations currently can't utilize the dedicated encoding hardware that modern computers come with.

However, with the new WebCodecs API, we can dramatically increase the UX and performance of in-browser video editing.

The WebCodecs API gives web developers low-level access to the individual frames of a video stream and chunks of audio. It is useful for web applications that require full control over the way media is processed. For example, video or audio editors, and video conferencing.

In a few experiments done by Christopher Chadeau (vjeux) and Vani (vanilagy), we've seen WebCodecs to provide similar encoding/export performance to Final Cut Pro...in the freaking browser!

Levaraging this new technology, we believe we can build something that provides a great UX and performance that rivals truly native applications.

πŸ—ΊοΈ Roadmap/Scope

The surface area for this project is vast. Video editors must provide a ton of standard functionality and support hundreds of video formats to be used in major productions.

And although our goal is to provide a featureset that gos beyond the standard, we can't try to boil the ocean.

So, we're planning to provide a useful featureset and proof-of-concept by the end of 2023 that includes the following capabilities:

  • Import media1
  • Playback timeline
  • Trim clips
  • Export timeline2

Although that scope might seem small, these fundamental features will provide the scaffolding for everything else to come.

πŸ™Œ Contributing

Thanks for your interest in contributing to this project! You can get more information on how to do so by joining us in the Discussions tab on GitHub or on Discord.

License

This project is licensed under the MIT License.

πŸ™ Prior Art / Parallel Projects

Footnotes

  1. Will only support importing videos with the .mp4 container type. ↩

  2. Will only support exporting videos with H.264 encoding. ↩

Framecrafter's Projects

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    πŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. πŸ“ŠπŸ“ˆπŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❀️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.