世界を動かす技術を、日本語で。

ブラウザ内でのプロフェッショナルな動画編集、WebGPUとWASMを使用して

概要

  • ブラウザ上で動作するプロフェッショナル向けビデオ編集
  • インストール不要 で即利用可能なNLEエディター
  • GPUアクセラレーション によるリアルタイムプレビューと高速書き出し
  • 多機能タイムライン と直感的なキーフレームアニメーション
  • ローカルファースト設計 でメディアファイルはPC内に保存

ブラウザで完結するプロフェッショナルビデオ編集

  • Tooscut Editor は、インストール不要で ブラウザ内 で動作するNLE(ノンリニアエディター)
  • WebGPURust/WASM 技術により、 ネイティブアプリ並みのパフォーマンス を実現
  • GPUアクセラレーション によるリアルタイムプレビューと高速書き出しが可能
  • File System Access API を活用し、 メディアファイルはローカルPC内 で安全に管理

主な機能

  • マルチトラックタイムライン
    • 無制限のビデオ・オーディオトラック追加
    • クリップのリンクやクロストランジション対応
  • キーフレームアニメーション
    • 位置、スケール、回転、不透明度、各種エフェクトを ベジェ曲線 で滑らかに制御
  • リアルタイムエフェクト
    • 明るさ、コントラスト、彩度、ブラー、色相回転 などをGPUで即時反映
  • ゼロインストール
    • Web AudioFile API と連携し、 すべての処理がローカルPC内 で完結

パフォーマンスと安全性

  • WebGPU による GPUコンポジット 処理
  • Rust/WASM の活用で 高速なエフェクト適用
  • ファイルは一切クラウドにアップロードされず、プライバシーを確保

使い方の流れ

  • ブラウザでTooscut Editorを起動
    • 追加したいメディアファイルをドラッグ&ドロップ
  • タイムラインにクリップを配置
    • 必要な数だけトラックを追加
  • キーフレームやエフェクトを設定
    • プロパティや効果を直感的に調整
  • リアルタイムプレビューで確認
    • 書き出しも高速に実行

まとめ

  • インストール不要高機能なビデオ編集 を実現するTooscut Editor
  • セキュアかつローカルファースト な設計
  • プロフェッショナルも納得の操作感とパフォーマンス

Hackerたちの意見

WGPU、WASM、WebGPU、Rust、Tanstack Startを使った無料のオープンソースNLEビデオエディタだよ。

プラグインの計画はある?知らないかもしれないけど、標準があるよ:https://openeffects.org/ 開発経験を共有してくれると嬉しいな。PRを受け入れるつもりなら、CONTRIBUTING.mdを作ってディスカッションを可能にするのを提案するよ。

これは絶対にオープンソースライセンスじゃないよ:https://polyformproject.org/licenses/noncommercial/1.0.0/ オープンソースの定義の1、5、6に違反してるね:https://opensource.org/osd

選んだライセンスが間違ってると思うよ。今のライセンスだと、実際にはソフトウェアを商業目的で使うことを禁止してるから、例えば誰かが君のソフトで編集した動画を収益化したら、ライセンス違反になっちゃう。そんなの望んでないでしょ。ソフトウェア自体の特定の商業化を禁止するライセンスを作る参考に、HashicorpのBSLを見てみて。 [1] https://www.hashicorp.com/en/bsl

無料がいいなら、Resolveは君が見つけられるオープンソースのものよりも圧倒的に優れてるよ。WGPUは必要ないし、GPUをそのまま使えるからね。正直、こういうのはブラウザでコードを動かすっていう概念に対して、あまりいい印象を持てない。バグだらけだし、全てのブラウザで動くわけじゃないし、なんでブラウザでこれを動かそうと思うのか本当に疑問だよ。Javaから始まって、今はブラウザでWASMだけど、対応してるブラウザは限られてるし。

すごくクールだね!プロの編集者向けの専用NLEには勝てないかもしれないけど、動画を扱う既存のウェブアプリに組み込める完全機能のNLEってのがいいね。

そうそう、目指してるのは動画編集のPhotopeaなんだ。ウェブからすぐに立ち上げられて、日常的な使い方の80%をサポートできるようなものだよ。

kdenliveを使ってるけど、オープンソースのビデオエディタとしては機能してるね。kdenliveが共有アセットやプロジェクトをサポートしてるかは分からないけど、これならその機能を提供して期待を超えることができそう。これってロードマップに入ってるの?

そう、それがライセンス選択の背後にあった考えの一部なんだ。エンジン自体はオープンソースのままにして、クラウドファイル管理や共有、AI編集、他の高レベルの機能など、隣接する提供物を収益化する機会を作るのが目標だったんだ。

Firefoxで試してみたけど、数分間は動いてたのに、その後ブラウザ全体がクラッシュしちゃった。これは確実にFirefoxかGPUドライバのバグだね。WebGPUのブラウザ/プラットフォームサポートがもう少し成熟するのが待ちきれないよ、すごくいいからね(ただ、セキュリティの問題にはちょっと不安があるけど)。

そうだね。残念ながら、今のところFirefoxはWebGPUのサポートがあまり良くない。

これ、https://omniclip.app/ と比べてどうなの?

面白そうだね。Omniclipは具体的には見たことなかったけど、今まで見たウェブベースのNLEの中では、UXがちょっと馴染みがない感じ。僕の目標は、Premiere ProやDaVinci Resolve、Final Cut Proみたいな、編集者にとって馴染みのあるデスクトップグレードのプロフェッショナルエディタを作ることだったから、編集体験を再発明するんじゃなくてね。

期待はしてるけど、道のりはかなり厳しいし、ここでの進捗があまり見えないね。すごく期待してるけど、今の状態からもっと先に進んでからこういうのを見たいな。テキストサポートやアニメーション、トランジション、フィルターなんかが揃ったら、また見せてほしい。

実は、もうテキストやトランジション、基本的なプロパティのアニメーション、いくつかのフィルターには対応してるんだ。君のユースケースについてもっと聞きたいし、君が見た中でどの機能が足りないと感じたのかも教えてほしいな。

いいツールだけど、ライセンスがあまり役に立たないね。こういうのをユーザーに追加機能として統合したいけど、間違ってなければ、このライセンスタイプでは完全に禁止されてるよね?

見てみたけど、「プロフェッショナル」って言葉がかなり働いてるね。

ある動画の音を別の動画の映像と組み合わせるのに使ったけど、簡単にできたよ。使い方もすごくシンプルで、ミスする余地があんまりない感じ。これを使うのにすぐ切り替えられそう。ちなみに、Braveブラウザで問題なく使えたよ。

すごい!それを聞いてめっちゃ嬉しい!もし何か問題があったり、機能リクエストがあったらGitHubのイシューで教えてね。

ブラウザの制限でサンドボックスや3Dレンダリングがあるから、これではおもちゃ動画しか扱えないよね。なんでちゃんとしたネイティブアプリの代わりにこれを使うのか、ちょっと疑問だな。

ここでの目標は、すべてのプロのワークフローでPremiere Proを置き換えることじゃないよ。でも、おもちゃの編集ソフトってわけでもない。現代のブラウザとGPUの能力は、実用的な動画編集タスクの大部分には十分なんだ。今のところは大作映画の8Kを狙ってるわけじゃないけど、ソーシャル、商業、非商業の動画制作で人々が日常的にやってる仕事をターゲットにしてるよ。