動画ソフト・アプリ

動画編集ソフトの作り方 開発日誌

掲載・更新日

現在個人で動画編集ソフトの開発を開始しました。以前、動画変換ソフトを作りましたが、動画編集ソフトはさらに難しそうです。果たして公開までできるのか!


動画編集ソフトを作る理由

株式会社ドウガテック内村航です。


今まで40以上の動画編集ソフトをレビューしてきましたが、どれもこれも似たようなものばかり。私としては初心者、高齢者、パソコン操作が苦手な人でもカンタンに使えかつ無料の動画編集ソフトがあればな、と思っていました。


前はMicrosoftのフォトという簡易的なアプリがあったのですが、まさかの突然の廃止。その代わりのソフトもリリースされたのですが、これが初心者用としては中途半端なソフトなのです。


色々悩んだ結果「もう自分で作ったれ!」と、前から考えていた初心者に優しいパソコン用の無料動画編集ソフトを開発してみることにしました。



動画編集ソフト開発計画

目指す動画編集ソフトの内容は以下の通りです。


・ソフト名称:ドウガテックビデオエディター
・ターゲット:初心者、高齢者、操作が難しい動画編集ソフトが合わない人
・できること:動画の入力、タイムラインでの簡易的な動画編集、音楽挿入、テロップ挿入、動画の書き出し、短い動画編集
・言語/ツール:C#、VisualStudio、WPF App (.NET Core)

機能・構成イメージ

以下、こんな感じの動画編集ソフト、というイメージ図です。シンプルでわかりやすく、なるべく1画面ですべて完結できるようにしています。

動画編集ソフト開発イメージ

開発備忘録2023/10/17

そして、さっそく開発スタート!しかしそもそもの設計が甘く、途中でエラーのループ状態に突入。アイテムボックス内の動画とタイムライン内の動画を1つの再生ウィンドウで再生できるようにしたのがややこしかった!途中で進路変更するも、コードがごちゃごちゃになり、泣く泣く破棄。その日は終了!

動画編集ソフト開発日誌

開発備忘録2023/10/18-19

気を取り直して、再度1から開発を始める。今回はシンプルな設計で挑むのと、前回の失敗があるので、わりとスムーズに進む。アイテムリスト、タイムライン、プレビュー画面を設置、タイムラインに読み込んだ動画をD&Dで挿入、タイムラインの動画をプレビュー再生、プレビューボタンの設置、動画読み込みのシークバー設置、ハードウェアアクセラレーションの設置、動画のプレビューをシームレス化、などなど、かなり進みました。


初号機失敗の反省から、まずはシンプルに機能をひとつずつ追加していく。デザインなど細かいところは後回し!

動画編集ソフト開発日誌

開発備忘録2023/10/20

本日は我が社6周年記念日。すごい! えらい! 本日の開発ですが、動画の削除ボタンの設置、動画をD&Dするルールの改善など、なかなか進まなかった難問が解決。よくわからないまま作っているので、色々なところが競合してエラーがでます。しかしなんとか進んで嬉しい。ここからはいよいよ動画のトリミング機能の追加。シンプルな方法が良いのだけど、なかなか難しく進まない。これが済んで、一旦書き出し機能を付ければ、もう動画編集ソフトといっても良いのではないか、というところまできそう。明日もがんばろう。

動画編集ソフト開発日誌

開発備忘録2023/10/21-23

プレビュー画面に音量調整コントローラーの設置。そしていよいよ読み込んだ動画のトリミング。これは難しい。色々な方法があるけど、結局もっともシンプルな方法でいくことに。もう少し時間かかるかも。


開発備忘録2023/10/24-26

トリミングの実装でかなりてこずってます。とりあえず現状、タイムライン内の動画ボックス下にトリミングできるカスタムコントロールを設置。それで開始・終了時間を制御・取得できるところまできました。いやぁ、ここが難しかった!もうダメかと思ったけど、がんばればどうになるもんですね。えらい!次はタイムライン内の動画のトリミングデータをプレビューに回すところですね。これはそれほど時間かからないんじゃないかと勝手に思っております。ちなみに青と赤のハンドルデザインは暫定です。

動画編集ソフト開発日誌

開発備忘録2023/10/27

トリミングした動画のプレビュー再生だけど、予想よりややこしいです。元はタイムラインの動画を連結してラグを無くす方法を取っていましたが、頻繁にトリミングや位置を変える動画編集ソフトで、そのやり方はちょっと厳しいなとなり変更。プリローディングで対応することにしたのだけど、なかなかうまくいかず。もうちょっと時間かかりそうです。


開発備忘録2023/10/28-29

プリローディングは成功したものの、MediaElementでの動画再生にラグが発生するのをどうやっても修正できない!色々方法を探して試したものの、結局動画編集ソフトのプレイヤーとしては厳しいかなと判断。一旦、別プレイヤーに変更して進めることにしました。初めから知っていれば、こんなに変更せずによかったのに!若干のラグは後から修正できるでしょ!と思っていたのが甘かった!動画編集ソフトあなどれず!


開発備忘録2023/10/30

別プレイヤーに変更したのだけど、今度は連続再生に問題が発生。あれをなおせばこれがダメ、の繰り返し。


開発備忘録2023/11/1-2

プレイヤー問題、VLCやWindowsMediaPlayerやら色々比較検討したけど、結局一番シンプルなやつにすることにしました。動画間のラグもなくなりました。プレビューに関してはもう少し改良加えれば完成です。これが終われば後はわりと楽だと思うんだけど、テキスト、音声、そして書き出し機能で、それぞれ難しいことが発生するんだろうなぁ!プログラミングむずかしい!

動画編集ソフト開発日誌

開発備忘録2023/11/3-4

ようやくトリミング、移動、上書き、削除、新規追加などを検知しプレビュー再生を更新するデバッグが完了!ここが一番の難関だった気がするので、ほっと一息。次は各動画の音量調整。


開発備忘録2023/11/5-7

各動画の音量調整スライドバー設置。予想以上にてこずりました。次は音量調整後のプレビュー更新、音量調整の幅修正、もしカンタンそうであれば音量の波形表示など追加したいです。

動画編集ソフト開発日誌

開発備忘録2023/11/8

動画にテキストをオーバーレイする機能を追加中。指定文字数、2行のみ入力すれば自動でテキストがオーバーレイするシンプルな仕様を目指しています。少しエラーがでているので修正中。

動画編集ソフト開発日誌

開発備忘録2023/11/9

動画へのテキストオーバーレイがうまくいかない!ffmepgを使っているのだけど、なぜかうまくいかない!コマンドプロンプトでのテストはうまくいくので、アプリの問題っぽい。そんな難しくなさそうなのに、なぜだ!一旦、古いコードに戻ってもう一度再考してみます。


開発備忘録2023/11/20

一週間遅い夏休み取得。福井、石川、富山、長野、静岡、東京をウロウロしてきました。そしてさっそく開発再開!なかなかうまくいかなかったテキストオーバーレイですが、なんとか成功しました!そんな難しいはずないのに、なぜできんのじゃ!と悩んでいましたが、急にあっさり解決。プログラムってそういうとこありますよね。次にテキスト変更によるプレビュー更新、サムネイル上へのテキスト表示、文字数制限など追加します。ここを突破できたので、完成までもう少し!といっても、作っている間に色々アイデアが浮かんだので、一旦完成後に色々追加していきます。

動画編集ソフト開発日誌

開発備忘録2023/11/21-23

テキストボックスにテキスト入力すると、サムネイル上にテキストがリアルタイムで表示されるように修正しました。なかなか難しかったけれどクリア!次は全体にかかるBGM音楽と音量調整ですね。完成までだいぶ近づいてきた!

動画編集ソフト開発日誌

開発備忘録2023/11/24

BGM挿入ボタン、音楽ファイル名表示、音楽クリアボタン設置、音楽と動画の結合、再生を導入完了!ここは思ったより早く完成しました。あとは音声のラストにフェードアウトを付けて、標準のサンプル音楽を選択できるようにしたいです。ソフトは配布するのでサンプル音楽の著作権には注意が必要です。自分で作るのか、流行りのAIで作って権利を買うのか、色々選択肢があります。一旦、フリー音楽をあてがって、次の動画の書き出し機能を付けようと思います。それができたら、編集データをプロジェクトとして保存、ソフトのホーム画面の作成など、細かいデザイン調整などやることはまだまだあります。年内には完成させたい!がんばるぞ!

動画編集ソフト開発日誌

開発備忘録2023/11/25-29

書き出しボタンの設置、高画質動画をもとにエンコード成功。というわけで一応、完成しました!といいたいところですが、フレームレートによる新たな問題が発生!動画読み込み時に30fpsに変換して編集するようにしているのですが、最後の書き出し時はオリジナル動画から変換します。オリジナル動画のfpsが30以外、もしくは複数ある場合、動画間にずれが発生する場合があるのです。これはけっこう大変なことになりそう。すべての動画を高画質+30fpsに変換して保存して使う方法もありますが、なんか嫌だ…。もうちょいかかりそうです。

動画編集ソフト開発日誌

追加・Ver.1.0完成!

トリミングスライダーをフレームベースから時間ベースへ変更することで、動画間の遅延を解消できました!これで複数のfpsが混ざった動画も問題なく編集することができます。わー、ここに時間かかった!でもできたよかったぁ!開発は2023/10/17開始なので、休みもあったけど44日かかりました!

あとはここから細かい修正、機能追加、デザイン変更などですね。たぶんそんなに時間かからない、はず!あー、嬉しい!


開発備忘録2023/11/30

完成!と思ったらまだだった!フレームレートの関係で、稀に書き出し後の動画に遅延が発生することが判明。色々やった結果修正完了!さらにタイムラインへの動画挿入にバグがあったのでそれも修正。これで基本的には完成ということにしましょう!つまり完成に45日かかったことになりますね。

あとはデザインの修正、そして実装したい機能がいくつかあるのでさらに進めていきます!


開発備忘録2023/12/1-2

デザインの整理、プレビューにシークバー、音量スライダー設置。あと諸々バグ修正。もうちょい追加したい機能があるので、それができたらデザイン最終調整。来週中には完成か!?

動画編集ソフト開発日誌

開発備忘録2023/12/3-5

色々細かい機能追加で時間かかっています。アイテムボックス内の動画削除とタイムライン内での連動削除機能、音楽のループ機能、テキストボックス内のテキストサイズを大きく変更など。あとは音楽自体の音量調整、タイムライン音声の一括調整スライダーの設置、プロジェクトの保存、そしてすっかり忘れていたHOME画面の設置など。基本機能は完成といえど、まだまだ時間かかりそうです!

動画編集ソフト開発日誌

開発備忘録2023/12/6-8

タイムライン挿入時のタイムラインの動きの制御、書き出しプログレスバー、再生、閉じるボタンの設置、その他バグ修正をしました。思ったより時間かかりました!次はトリミングハンドルを触った時にプレビュー再生して確認できる機能をつけようと思っています。ここはちょっと時間かかりそうです。

動画編集ソフト開発日誌

開発備忘録2023/12/9-11

かなり苦労しましたが、プロジェクトの保存ボタンと機能を設置しました。以下のような形式で保存されます。


C:\Users\hamochiku\AppData\Local\Temp\tmpFFA5.tmp.mp4,00:00:04,00:00:09.4330000,43.5736677115987,上野動物公園だ!
C:\Users\hamochiku\AppData\Local\Temp\tmp585.tmp.mp4,00:00:02.5670000,00:00:04.6670000,90,黒い鳥!
かわいいね!
C:\Users\hamochiku\AppData\Local\Temp\tmpA38.tmp.mp4,00:00:05.8000000,00:00:09.4330000,153.291536050157,たのしかった!


なかなかファイルパスがうまく同期せず3日間くらいかかりました…。しかしどうにか完成。次は保存した.dteファイルを読み込む機能の設置です。これができたらHOME画面を設置。そこに作ったすべてのプロジェクトをサムネイル表示して、そこからプロジェクトを開く形式にしたいです。

動画編集ソフト開発日誌

開発備忘録2023/12/12-13

プロジェクト保存形式の変更、読み込みボタン、機能の設置、バグ修正など。前に作った保存形式だとうまくいかず変更。細かい不具合ありましたが、なんとか保存したデータを復元することができました。あとは同じ動画の読み込み禁止、ファイルがない場合の修復、HOME設置、細かいデザイン修正など。後すこし!といいつつ、まだかかりそうです。

動画編集ソフト開発日誌

開発備忘録2023/12/14-18

アプリ・書き出し窓お知らせ欄追加しました。サーバにアップロードしたテキストを読み込んで更新します。そしていよいよHOME画面設置!HOMEでプロジェクトを新規作成し、プロジェクトウィンドウで編集。まだ途中ですが、HOMEに保存したプロジェクトをサムネイル一覧で表示します。あとは自動保存機能、バックアップ機能を追加しようと思います。

これができたら、いよいよ会員登録システムを構築します。メールアドレスとパスワードのみ登録し、アプリにログインすると使えるようにします。ログインなしでの利用も考えたのですが、後々のことを考えるとやはり会員登録は必要だと判断しました。

ここまでくると、なんだか公開に向けて緊張してきました。素人がここまで作ったものを利用者や専門職の方々がどう受け止めてくれるか。怒られそうで怖いですよね。正直コードなんて、ぐちゃぐちゃのスパゲッティコードなんだろうし。素人だからそんなことすら判断できないので余計に怖い!でも、初期コンセプトのパソコン初心者、高齢者でもカンタンに使えるというのは守れていると思います。

それもこれも2012年からカンタン動画入門というウェブメディアを1人で作ってきた知識と経験による集大成だと思っています。僕を応援してくれる愛する妻にも感謝。猫にもね。

では、もう少しがんばります!


開発備忘録2023/12/18-20

HOME画面設置しました!新規プロジェクトボタン、過去プロジェクト一覧、お知らせ欄、使い方記事へのリンクなど。お知らせや画像リンクなどはサーバ上から取得するので随時変更可能です。最初に編集画面から作ったので、遷移方法がよくわからず時間かかりました。まだまだ細かい修正あります!

動画編集ソフト開発日誌

開発備忘録2023/12/20-28

アスペクト比が違う動画の処理を行っています。新規プロジェクト作成でプロジェクト自体のアスペクト比を設定します。

動画編集ソフト開発日誌

プロジェクトのアスペクト比に合っていない動画は読み込み時に変換され黒帯をいれます。

動画編集ソフト開発日誌

ここの処理がかなりややこしくて時間かかっています。書き出し時の修正でもう少し時間かかりそうです。


開発備忘録2023/12/29-2024/01/10

細かいバグを修正しました。動画編集ソフトとしての機能としてはこれでほぼ完了です!ここからはGoogleアナリティクスを使っての利用データ取得、ロゴ作成です。


開発備忘録2024/1/11-21

ソフトの利用解析ですが、色々検討した結果、GoogleアナリティクスではなくMicrosoftのAzureを使うことにしました。アプリを開いた時、終了時、書き出し時などのデータを取得できるようになりました。

動画編集ソフト開発日誌

そして一週間くらい進んでいないのが動画の開始・終了時間を調整するハンドルを動かすとそれにあわせて動画がプレビューする機能です。ほぼ完成しているのですが、ある条件で微妙におかしな動きをしてしまうのです。ここだけがなかなか直らない!これが終わらないと次へ進めない…。早く完成させて次へすすみたい!


開発備忘録2024/1/22-23

ハンドルプレビューのバグを解決!すごい時間かかりました。ようやく直った!


ソフト用のアイコンを作成しました。誰がみても動画関係のソフトがあることがわかる、無料だということがわかる、非常にシンプルなデザインにしてみました。色々考えたけど、こういうのでいいんですよ。

ドウガテックビデオエディターフリーアイコン

そしてデザインを微修正。まだ修正箇所ありますが、あとちょっと!!

動画編集ソフト開発日誌

これが終わったら起動時に表示されるスプラッシュ画面。あ、あともうひとつバグがあったんだった!もうちょいかかりますね。


開発備忘録2024/1/24-27

細かいバグ修正。赤い縦線位置で動画を分割できる分割ポイントと分割ボタンの設置、分割ハンドル移動でのプレビュー再生の実装。


ここまでくると、もうちょっと機能を追加したくなって、時間かかっています。「まあ、なんか難しいからいいや!」と思っていた機能も、最近は「どうにかなるんじゃない?」となって、どんどん増えていきます。もうリリースできるくらい完成しているのですが、ここまで頑張ったのでもうちょい改修しようと思います。

動画編集ソフト開発日誌

開発備忘録2024/1/28-2/5

プレビューウィンドウに開始点、終了点で動画を再生しつつトリミングできる機能追加。開始・終了マーカー、範囲ラインの表示。

動画編集ソフト開発日誌

ソフト起動時のスプラッシュ画面表示。初回起動時にメルマガ登録ダイアログ表示。

動画編集ソフト開発日誌

他にも修正追加したいところありますが、時間がかかりすぎているので、とりあえずリリースに向けて動き出しました。メルマガシステム構築、使い方記事作成、QA掲示板の設置、外部への告知などなど。他にもやることたくさんです!


開発備忘録2024/2/6-2/13

細かいバグ修正、インストールできるようパッケージ化、ビデオカードなしの別パソコンでの動作チェックなどなど。Vectorさんに提出し、一週間程度審査待ちです。うまくいくと良いのですが。


開発備忘録2024/2/213

Vectorさんの審査が通り、掲載開始されました!長かったけど頑張って良かったです!あー、うれしい。


以下のリンクからダウンロードしてください。

・ドウガテックビデオエディターフリーダウンロード(Vector)

関連記事

Adobe Premiere Elements2021の使い方(1) 機能の紹介 動画編集ソフト アドビプレミアエレメンツ入門

Adobe Premiere Elements使い方BGM音楽の挿入と音量調整 フェードイン・アウトの方法 動画編集ソフト

動画編集ソフトAdobe Premiere ElementsのBGM音楽の挿入と音量調整 フェードイン・アウトの使い方などを解説をします。

動画編集ソフトVideoPadの使い方

VideoPadの使い方(2)基本的なカット編集の方法 動画編集ソフト

Windows/Mac用動画編集ソフトVideoPadの基本的なカット、トリミング編集の方法を解説していきます。

動画編集ソフトCorel VideoStudio 2021の使い方

VideoStudioの使い方(5)タイトル(テキストテロップ)の挿入方法 動画編集ソフト

動画編集ソフトCorel VideoStudioのタイトル(テキストテロップ)の作り方や、デザインの編集方法などを解説をします。

q?_encoding=UTF8&ASIN=4798045489&Format=_SL250_&ID=AsinImage&MarketPlace=JP&ServiceVersion=20070822&WS=1&tag

Windowsムービーメーカーの使い方(3) テロップのつけ方

ムービーメーカーを使ったテロップのつけ方などについて解説していきます。 はじめてのWindowsムービーメーカーWindows10/8/7対応

エッジのぼかしの効果・使い方 Adobe Premiere Pro動画エフェクト

エッジのぼかしの効果・使い方 Adobe Premiere Pro動画エフェクト

動画や画像などの周囲をぼかす動画編集ソフトAdobe Premiere Proの動画エフェクト『エッジのぼかし』の効果と使い方を解説します。 Adobe CC/Premiere Proを格安で購入する ...

-動画ソフト・アプリ