管理者blog

アクションカメラやドライブレコーダーで撮影した動画って、3分や5分毎の分割ファイルになっていることありますよね。細切れの動画を結合するためだけに、高価な編集ソフトを使ったり、手作業で調整するのは面倒です。動画の結合ぐらい、もっと簡単にやっつけたいですよね！ FFMPEGを使うと、コマンド一発で動画の結合を出来るのですが、結合対象ファイルが多数ある場合はコマンドを記述するのが面倒です。そこで、ドラッグアンドドロップするだけで結合できるバッチファイルを作ってみました。 操作手順 結合したファイルをドラッグで囲みます。この時、最後の動画から最初の動画に向かって選択して下さい。その後、ファイルを纏めてffmpeg-concat.batにドラッグアンドドロップするとバッチが起動します。バッチが起動すると、結合するファイルの一覧が表示されるので、問題なければ、何かキーを押すと結合が始まります。 バッチダウンロード https://quizgenerator.net/wp-content/uploads/bat/ffmpeg-concat.bat ソースコード @echo off set FILES= set N=0 :REPEAT set /a N=N+1 set FILES=%FILES% -i %1 if "%~2"=="" GOTO EXIT shift GOTO REPEAT :EXIT echo %FILES% pause ffmpeg %FILES% -filter_complex "concat=n=%N%:v=1:a=1" %1.merged.mp4 pause まとめ バッチかいて楽しようぜ！

・マニュアル動画を作成したい。 ・静止画を入れて加えてアレンジしたい。 ・説明文を加えてもっとわかりやすく視聴してほしい。 だけれど、動画編集はなんだか難しそう・・・。 そのようなときは、iPhoneのiMovieを使って簡単作成できます。 今回は動画＋静止画を使った説明動画を作成します。 下の動画を素材として説明していきます。 事前準備 ・編集用の動画 ・動画の中でより詳しく視聴してほしい部分のスクリーンショット スクリーンショット撮影方法： iPhoneのスリープ/スリープ解除ボタン(電源ボタン)を押しながら、ホームボタンを押します。 「カシャッ」というシャッター音が鳴り、画面が白く点滅したら撮影成功です。 写真を保存してください。 編集 無料で使える動画編集ソフトとしてiMovieを利用します。   ① iMovieを起動して「プロジェクトを作成」をタップします。   ②次に「ムービー」を選択します。   ③編集したい動画をチェックし、「ムービーを作成」をタップして挿入します。   ③「静止画を入れたい部分に白縦線を合わせ」その動画をタップします。 すると、画面下部に操作ツールバーが表示されます。 「分割」をタップしてください。 次に画像が分割されその部分にが画像を挿入していきます。 画面左にある「＋」をタップし、写真の中から挿入したい画像を選択してください。   ここまでくれば下準備完了。 ④あとは挿入した画像に文字を加えていきます。挿入した画像をタップし「 T 」をタップしてください。表示したい文字のスタイル一覧が表示されます。今回は「標準」を使用します。標準をタップし画像の「タイトルを入力」をタップして文字を入力します。標準の場合、大小のタイトルが3つ表示されますのでいらないタイトルは消すことができます。文字の配置も「中央」「下」と指定できますのでお好みの配置を選択しましょう。 あとは画面左上の「完了」を押せば編集完了です。   実際に編集を加えて編集した動画が下記のものです。 この他にも様々な機能があり、組み合わせてオリジナルな編集をすることができます。

FFmpegをインストールしたものの、オプション設定が多すぎて、どのように設定すればよいかわからない。設定は分かるが1ファイルずつコマンドでエンコードするのは面倒だ。そんなときは、以下のようなバッチファイルを作ると、動画ファイルをドラッグ・アンド・ドロップするだけでエンコードできるので便利です。 ※このバッチを使うためには、「Windowsパソコン」をご利用頂く必要があります。また、動画の圧縮（FFmpegのセットアップとエンコード手順)に従って、ffmpegを実行パス上に配置しておく必要があります。 以下のように動画を.batにドラッグするだけでエンコードできます。 複数のファイルを纏めてドラッグできます。また、エンコード後のファイル名は元のファイル名に従って自動設定されます。 エンコード用のバッチファイル 3パターン用意しましたので、用途に合わせてご利用下さい。2番目、3番目のバッチはサイズ変更まで行える優れものですが、元映像の縦横比によっては高さが奇数となり、エンコードできない場合があります。 サイズそのままで容量を削減(↓クリックでダウンロード) https://quizgenerator.net/wp-content/uploads/bat/ffmpeg-noresize.bat learningBOXの標準画質まで容量を削減-幅640(同上) https://quizgenerator.net/wp-content/uploads/bat/ffmpeg-640.bat learningBOXの高画質動画プランまで容量を削減-幅1280(同上) https://quizgenerator.net/wp-content/uploads/bat/ffmpeg-1280.bat バッチファイルの解説 以下のコードはffmpeg-1280.batのものです。ffmepgから始まる行が本体です。 -vf scale=1280:-2 * 映像のサイズを指定しています。幅は1280、高さは自動です。-2を指定すると2の倍数になるように調整されます。 -crf 22 * 画質の設定です。大きな値ほど画質が悪くなります（容量は減ります） -r 30 * フレームレートの指定です。大きな値を指定するとなめらかな動画になります（容量は増えます） -ac 1 * オーディオのモノラル化の指定です。モノラルで良い場合はこの指定をすると容量が減ります。 ECHO OFF :REPEAT ffmpeg.exe -i %1 -vcodec libx264 -vf scale=1280:-2 -crf 22 -r 30 -y -ac 1 "%~n1.w1280.mp4" if "%~2"=="" GOTO EXIT shift GOTO REPEAT :EXIT pause 改訂履歴 2018.1.19 初版公開 2018.4.2 高さ指定を-1から-2に変更／映像サイズによってエラーになる場合があったので-2に変更しました

以下のように指定すると、リンクをEdgeで開けます！ <a href="microsoft-edge:https://quizgenerator.net">Edgeで開く</a> Edgeで開く 特定のブラウザでしか動作しないようなサービスを運用している場合にはブラウザを指定してリンクできると便利な場合もあるかもしれませんね。    

社内の某案件にて簡単な円グラフを表示したいという要件が発生したのですが、ちょうどいいライブラリを見つけることができなかったので、Canvasに描画してみました。外部ライブラリとしてはjQueryだけをつかています。配色、値、枠線の太さを指定すると円グラフが描画されます。

正答は1つしか存在しない、けれど、複数選択問題として出題したい。そんなときは、問題種別にma:を指定することで、強制的に複数選択問題として出題することができます。 問題文 ma: o:正答 x:誤答1 x:誤答2 Iframe対応ブラウザでご覧ください。

learningBOXより使用可能になった教材として動画をアップロードする機能。 便利になったけどそもそも動画の作り方が分からない人も居るのではないでしょうか？ スマホで動画を撮ってアップロードするだけなら出来るけど、手ブレが...... 解説を入れたいけど、顔を映したり声を入れたくない。 色々あると思います。 これから何回かに分けて、動画マニュアルの作成方法をご紹介していきます。 最終的には下のような動画が作成出来るようになります。 編集 無料で使える動画編集ソフトとしてiMovieを利用します。Macの場合、標準でインストールされている場合もあります。 iMovieを起動して新規作成をクリックします。 iMovieでは普通の動画と映画の予告編のような物を作ることが出来ます。 今回は普通の動画を作成しますのでムービーを選択します。予告編での作成は別の機会に。 ムービーを選択すると下の画像のように表示されます。 iMovieは大きく分けて三箇所のグループに分かれています。左上の素材置場、右上の画面効果編集場、下のタイムラインの三箇所です。左上の素材置場から下のタイムラインに素材をドロップし、素材を切り貼りすることで動画を編集していきます。 まずは前回撮影を行った動画を素材置場に登録します。メディアを読むこむをクリックしファイルを選択する、または範囲内に動画ファイルをドラッグ＆ドロップすることで素材として扱うことが出来ます。 素材には動画ファイル以外にも画像ファイルも登録することが出来ます。 次に、素材置場のファイルを下のタイムラインに左から時系列順にドラッグ＆ドロップで登録します。タイムラインには幾つでもファイルを置くことが出来ます。 タイムライン上のファイルは command + b　で分割することが出来ます。 分割後に削除したりすることでファイルの中から欲しい部分だけを抽出することが出来ます。 ファイルとファイルの間にはトランジションと呼ばれるファイルからファイルへと移り変わる瞬間の特殊効果を挿入することが出来ます。 この特殊効果によって全く別のファイルが続いていても、自然に違和感なく動画を見ることが可能になります。 トランジションは素材置場上の下の画像の部分からタブを切り替えると選択することが出来ます。 次回予告 次回は一歩踏み込んだ動画の編集です。

SVG形式の画像は、拡大しても荒れないだけでなく、画像内にリンクを埋め込むこともできます。ただし、imgタグで画像を表示した場合は、リンクが無効化されてしまいます。objectタグを用いて画像を表示することで、リンクが有効な状態でsvg画像を表示できます。 上記のsvg画像は、Googleスライドにて作成しました。スライド内でオブジェクトにリンクを指定した状態でsvg形式に出力することで、上記のような画像が作成できます。

learningBOXより使用可能になった教材として動画をアップロードする機能。 便利になったけどそもそも動画の作り方が分からない人も居るのではないでしょうか？ スマホで動画を撮ってアップロードするだけなら出来るけど、手ブレが...... 解説を入れたいけど、顔を映したり声を入れたくない。 色々あると思います。 これから何回かに分けて、動画マニュアルの作成方法をご紹介していきます。 最終的には下のような動画が作成出来るようになります。 撮影 第一回は撮影方法です。 今回はパソコン上での画面の撮影を紹介します。 QuickTime Playerで撮影を行います。 QuickTime Playerのメニューを開くと下の３つの収録ボタンが表示されていると思います。 上記の３つを説明すると 新規ムービー収録・・・PCに接続している機器からの出力映像と出力音声を収録する。 新規オーディオ収録・・・PCに接続している機器からの出力音声を収録する。 新規画面収録・・・PCの画面を収録する。 です。上にある動画は新規画面収録から撮影を行っているので新規画面収録をクリックします。 そうすると下の画像のような物が表示されます。 この中央の赤いボタンをクリックすると、撮影を行う範囲を指定するように指示されます。画面全体ならそのままクリック、画面の一部の場合はドラッグで範囲を指定します。 撮影が終了すれば名前を付けて保存を行います。以上で撮影は終了です。 次回予告 次回は撮影した動画の編集です。

先日のアップデートにて、QuizGenerator(β)はlearningBOXに生まれかわりました。 それに伴い、製品パンフレットも一新しました。既に資料請求された方も、まだ資料請求されていない方も、既に導入済みの方も、ぜひ資料請求いただければと思います。また、弊社は11月15日～11月17日の期間、インテックス大阪で行われるEDIXに出展しております。資料請求の際に、展示会の招待券も欲しいと伝えていただければ併せて送付いたします。