dnjiro’s 9VAe blog

誰でもアニメが作れる無料ソフト9VAeきゅうべえ開発者のブログ

Chromebookで口パク動画が作れる無料アプリ:9VAeきゅうべえ

Chromebookで口パク動画を作る方法を説明します。作業時間は10分ぐらいです。口パク動画素材にもなります

f:id:dnjiro:20210531110100g:plain

他のアニメの作り方はこちら9VAeの質問はこちら

 

内容:10分程度

 

■ 9VAeきゅうべえのダウンロード


www.youtube.com

■ 無料口パク素材

 

Chromebook に パソコンからデータを送る方法

  1. パソコンのブラウザで、ChromebookGoogleアカウントにログイン
  2. はじめての方はGoogleアカウント(無料)を作成し、ログインしてください。
  3. 右上の9点アイコン(下図A)をクリック

    f:id:dnjiro:20210530151714g:plain

  4. ドライブアイコン(上図B)をクリック
  5. 転送したいファイルをマイドライブ(上図C)の中にドラッグして入れます。
  6. Chromebookでファイルアプリを開きます。
  7. 左側の「Googleドライブ」「マイドライブ」(上図D)をクリック。転送したいファイルが見えるはずです。 
  • Chromebook版 9VAeは「ダウンロード」フォルダのデータが読み込めます。 
  • 上図のファイルを左側の「マイファイル」「ダウンロード」にドラッグすれば、9VAeきゅうべえの「ファイル>開く」や「画像」「音」で読み出せます。

それでは口パク動画をつくってみましょう。 

以下の説明では、図のABCDの順番に操作してください。

 

1.9VAeの「1.」を押して、ひとコマアニメ作成開始

  • スマホ版で画面がせまい場合、パレットの右下(下図A)をタッチすればパレットがON/OFFできます。画面が黒い場合(iPhone版)、「表示メニュー」から「ダークモード」でバックを白にできます。
  1. 「1.」(下図B)をタッチしてください。「書き順アニメの作り方、線を書いたあともう一度「1.」を押してください」と表示されます。「OK」をタッチすると、ページの時間が「ひとコマ」に変わります。

f:id:dnjiro:20201015125339g:plain メモ:1コマで書き順アニメをつくるとき、最初に「1.」を押します。画面が小さい場合、右下すみのタッチでパレットをON/OFFできます。

f:id:dnjiro:20210531111143g:plain

 

2. 文字を入れる

  1. 文字入力ボタン「A」(上図C)をタッチし、ツィートしたい文章を入力します。 
  2. 文字を入れたあと「1.」(上図D)をタッチすれば書き順アニメが作成され一度再生されるはずです。もし「1.」が見えなかったら、画面右下すみを2回タッチして「1.」をタッチしてください。

 これで文字がでてくる動画ができたわけですが(なんと簡単な!)、さらに吹き出しや口パクするキャラクタをつけてみましょう。なお、文字の先頭に「#」があると、特別な意味になり、動きません。「#」の前に半角スペースをいれてください。

f:id:dnjiro:20201015125339g:plainメモ:最初に「1.」を押して、最後にもう一度押すと書き順アニメができます。

  

3.吹き出しを入れる

  1. 文字(下図E)をタッチして文字を選択。もしパレットが見えていなかったら右下すみをタッチしてパレットを表示

    f:id:dnjiro:20210531111359g:plain

  2. 右側のパレットのタブ3(上図F)をタッチすると、基本図形が入力できます。文字を選んだ状態で、吹き出し(上図G)をタッチすれば、文字の背後に文字の大きさにあわせた吹き出しが入ります。
  3. 吹き出しを入れたあと、点の選択ボタン(上図H)をタッチ。吹き出しの点(上図I)を外からドラッグして選びます。ドラッグして位置を調整します(上図J)。
  4. 線の色は、図形タブ1(上図K)をタッチ。線の色ボタン(上図L)で設定できます。線の太さは太さボタン(上図M)で変更できます。

f:id:dnjiro:20201015125339g:plainメモ:何か選んで吹き出しをいれると、吹き出しがサイズ調整されます。

 

文字と吹き出しをグループ化

  1. 選択ボタン(上図N)をタッチし、画面の外からドラッグしながら 文字と吹き出し同時に選びます。下図

    f:id:dnjiro:20210531113545g:plain

  2. 選択枠の中央の「+」(上図O)をタッチ。メニューから「グループ化」をタッチ。 これで、文字と吹き出しがグループ化されます。
  3. 文字と吹き出しをグループ化しておけば、文字の内容を変更したときに、 文字の外接矩形の大きさの変化に応じて、吹き出しのサイズが変化するため とても便利です。
  4. 文字の内容を変更したい場合は、文字の上を2回タッチ。パソコン版なら選択してから「Return」キーを押しても 変更できます。上図左下が変更した例です。
  5. 一度文字の内容を変更して、吹き出しの大きさがかわるか試してみてください。

f:id:dnjiro:20201015125339g:plainメモ:文字と図形をグループ化しておくと、文字変更で図形のサイズもかわります。

  

4.9VAeきゅうべえにSVGキャラクタを読み込む

  1.  OpenclipartにあるフリーのSVG(miku usagi hat Animation)を読み込みましょう。
  2. スマホの場合、上のリンクをひらき、DOWNLOADの下にある、「SVG(Vector)」ボタン(ここでもよい)を長押し(下図P)し、メニューから「コピー」(「リンクアドレスをコピー」)をタッチします。次に、9VAeきゅうべえを開き、「ファイルメニュー>新規作成」のあと「ツールメニュー>ネットからダウンロード」(下図Q)を実行し、http 入力欄を長押しして「ペースト(「貼り付け」)をタッチ(下図R)。
    OKをタッチすれば、キャラクタが入力されます(下図)。
  3. パソコン版の場合、DOWNLOADの下にある、「SVG(Vector)」ボタン(ここでもよい)を右ボタンでクリック(下図P)し、メニューから「リンク先を保存(または対象を保存)」をクリックして保存します。次に、9VAeきゅうべえを開き、「ツールメニュー>9VA/SVG/WMFを入れる」(下図Q)でダウンロードしたSVGファイルを読み込んでください。

    f:id:dnjiro:20210531142350g:plain
     

5.キャラクタの位置、サイズ調整 

  1. 左下の「ー」(上図S)を何回かタッチすれば全体が見えます。(iPhone版横画面で虫眼鏡ボタンが見えない場合は縦画面にしてタッチしてください。画面右下をタッチすればパレットのON/OFFができます。Android版は回転後、画面タッチで回転します)
  2. キャラクタを囲んでいる選択枠の角のハンドル(上図T)のドラッグでサイズ変更。中心や枠線(上図U)で移動ができます。キャラクタを文字の右に移動させましょう。 
  3. 左下の虫眼鏡ボタン(上図V)タッチで全体が表示されます。
  4. 線の太さが太すぎる場合、線の太さボタンをタッチし、メニューの一番下の「太くする・細くする」で調整できます。(イラストの作り方によっては線の太さが変化しないものもあります。)

    f:id:dnjiro:20210531142621g:plain

 

口パク素材

f:id:dnjiro:20201015125339g:plainメモ:口パク素材はOpenclipartにあります。9VAeで自作、修正できます。

 

6. キャラクタに口パクをつける

キャラクタは何も設定しなければ「んあいうえお」としゃべっています。これをせりふにあわせて口パクさせましょう。

  1. キャラクタ(下図W)をタッチして選択。選択枠の中心メニュー「+」(下図W)から「ローマ字で動かす」を実行。

    f:id:dnjiro:20210531142921g:plain

  2. 「5.8:kurombukku de kutipaku douga ga tukureru yoo 」とせりふをローマ字で入力してください。これの意味は
  • 最初の「5.8:」は5.8秒でしゃべるという意味です。秒数は「ひとコマ」機能で設定されたページの時間です。短い数字にすれば早口になります。
  • それにつづくローマ字にしたがって口パクします。「.」は口を閉じた状態を表します。
  • 読み込んだ miku usagi がローマ字で口パクするのは、SVGの中に「.aiueo」の順番に口の形が登録されているからです。アニメキャストの中身については、あとで説明します。口パクするキャラクタの作り方はこちらをご覧ください。
  • このまま出力すれば、背景透明のアニメGIFを出力できますが、クロマキー合成したい場合は、ページの左側(上図Y) をタッチし「グリーンの背景」をいれるとよいでしょう。

  • プレイボタン(上図Z)でアニメーションが再生できます。

    f:id:dnjiro:20210531143912g:plain

f:id:dnjiro:20201015125339g:plainメモ:アニメキャストの中のページが「んあいうえお」の順番にならんでいると、ローマ字にあわせて口パクします。記法は「秒:ローマ字」。ローマ字の時間がページの時間より短ければ最初の一部しか再生しません。

 

7. アニメGIF出力

  1. ここまでできたら「ファイルメニュー>名前を付けて保存」で名前をつけて保存しておきましょう。スマホ版では「9VAe」または「9VAe(Dangla/Pro)」フォルダに保存されます。
  2. ファイルメニュー>アニメGIF出力」を実行。
  3. 動画素材を作る場合、画面サイズは、幅を空白、高さを720、コマ/秒を30にするとよいでしょう。「OK」ボタンで動画を作成します。

    f:id:dnjiro:20200813233556p:plain

 MP4動画を作りたい場合

  1. 変換サイト:GIF to MP4 - Ezgif.com を開く
  2. 「ファイルの選択」ボタンで、出力したアニメGIFを選び、「Upoad!」ボタンで送信。
  3. Convert GIF to MP4!」ボタンでMP4動画に変換
  4. Save」ボタン(フロッピーディスクアイコン)でMP4動画をダウンロード
  5. ダウンロードフォルダにダウンロードされます。

 

f:id:dnjiro:20201015125339g:plainメモ:9VAe iPhone/iPad/Mac 版は、MP4動画が出力できます。ezgif.com でアニメGIFをMP4に変換できます。9VAeを保存しておけば、次回は文字をいれかえるだけで動画がつくれます。

 

9VAeを使えば口パク動画がすぐ作れる 

  • 9VAeきゅうべえを使えば、口パク動画が簡単に作れます。作成した9VAeデータはそのままテンプレートになり、文字を入れ替えて、簡単に別の動画が作れます。
  •  Openclipart や  FreeSVG など多くのSVGイラストをつかって動くキャラクタ素材が作れます。動画作成にご利用ください。
  • TikTokYoutube に投稿するには、MP4動画にします。

サービス

MP4

アニメGIF

Tiktok / Youtube 

OK

X

Twitter / Facebook

OK

OK(注意:TwitterFacebookの「写真」ボタンから入れると動く。カメラロールから送ると動かない)

Instagram

OK

投稿できるが静止画になる

 

  • もっと長いアニメを作ることもできます。以下をご覧ください。

9VAeきゅうべえ:長いアニメを作る方法 - Qiita

 

9VAeきゅうべえに関する質問

 

簡単エンドロール動画が作れる無料アプリ :9VAeきゅうべえ

9VAeきゅうべえアンドロイド版でもPC版iPad版でもつくれます。

f:id:dnjiro:20190426092918g:plain

作業時間は10分から15分程度です。

他のアニメの作り方はこちら9VAeの質問はこちら

内容:

■ 9VAeきゅうべえのダウンロード


9VAeきゅうべえの使い方

 

1. 文字をいれる

  1. f:id:dnjiro:20190426101709g:plainをクリックして文字を入れる

  2. 文字は250文字以内で区切って入れる
  3. f:id:dnjiro:20190426102049g:plainの右側の「-」をクリック。画面の外が見えるので、画面の下に後から出てくる文字を入れる。

文字を整列させるには次のようにします。

  1. 文字を全部選ぶ。「編集>選択する>全て」。(スマホ版は「編集>すべて選択」)
  2. 「調整>整列>縦軸を合わせる」(スマホ版は「配置>縦軸を合わせる」)
  3. 「調整>整列>上下のすきまを均等に」。(スマホ版は「配置>上下のすきまを均等に」)f:id:dnjiro:20190426102824p:plain

 

2. 背景をいれる

  1. 先頭ページの左側の「<」をクリック>メニューから「グリーンの背景を入れる」(これがない場合、最新版に入れ替えてください)
  2. グリーンの四角を選んで色をつける。色は右側のパレットで選ぶ。

  • 背景に写真を入れてもかまいません。メニューから「ツール>絵・写真を入れる」をクリック。(スマホ版の場合、ファイルマネージャアプリを使って写真を「9VAe」フォルダに入れておきます。)
  • 文字の色を変更したい場合、2ページをクリックして移動し、文字を全部選んでから、f:id:dnjiro:20190426104430g:plainをクリックし「タブ2」の中の色ボタンで変更します。

    f:id:dnjiro:20190426105009p:plain


     

3. 続きのページを作成

  1. 2ページの後ろのf:id:dnjiro:20181221171302g:plainをクリック。「続きのページを作る」をクリック
  2. 文字を全部選び、ドラッグして上に移動。(選んだあと中心の「+」>「移動」でもかまいません。「Shift」キーを押しながら移動させれば、まっすぐ上に移動します。スマホ版は「Shift」ボタン)

 

4. 時間調整、プレイして確認

  1. 2ページの上の「〇〇秒」をクリック。メニューから「1秒長くする」で時間を調整。
  2. 3ページの時間で、エンドロール終了後の文字の停止時間を調整できます。
  3. プレイボタンf:id:dnjiro:20181029083754g:plainで動作を確認

    f:id:dnjiro:20190426110623p:plain

 

 

5.アニメGIF出力

  • ファイルメニュー>「アニメGIF出力」
  • 出力画面サイズの「高さ」を720に設定。スマホ版の場合、幅を空白にすれば同じ比率で「幅」が自動的に設定される。
  • 「OK」ボタンでアニメGIFファイルができる

 もし、音、音楽を入れた場合、iPhone / iPad /Mac で MP4 に変換できます(こちら)。

 

6.ezgif サイトで、MP4動画に変換

  1. ezgif.com ( Online GIF to MP4 Video converter ) を開く
  2. 「ファイルを選択」をクリック > 作成したファイルを選ぶ。(Android版の場合、「ファイル」をクリックし、出力されたアニメGIFを選ぶ)
  3. Upload!」ボタンをクリック
  4. Convert GIF to MP4!」ボタンをクリック
  5. Save」ボタン(フロッピーディスクアイコン)をクリック
  • これで、MP4ファイルが保存できます。

 

9VAeでエンドロール動画がすぐ作れる 

  • 9VAeきゅうべえと ezgif を使えば簡単にエンドロール動画が作れます。
  • この方法は、自由度が非常に高く、文字の位置、文字サイズ、エンドロールがでてくる場所、タイミングなど自由自在に作成できます。
  • アニメーションをいれたり様々なエンドロールが作れます。
  • 9VAeは各ソフトにあわせて、いろんなフォーマットでクリップ動画を出力できます。
アプリ クリップ形式 作り方
PowerPoint
LibreOffice
Keynote
アニメGIF 背景を透明にして出力(PowerPointの例
iMovie
PowerDirector
グリーンバック動画 先頭にグリーンバック背景を入れる。(iMovieの例PowerDirectorの例
AviUtl 連番PNG 背景を透明にして出力(AviUtlの例

 

  • もっと長いアニメを作りたい場合、以下をご覧ください。

9VAeきゅうべえ:長いアニメを作る方法 - Qiita

  

9VAeきゅうべえに関する質問

 

解説動画・動くマニュアルが作れる無料ソフト「9VAeきゅうべえ」

フリーソフト9VAeきゅうべえを使ってキャプチャ画像から動画マニュアルや解説動画を作る方法を説明します。作業時間は15分くらいですイラストを動かす方法はこちら動画素材サムネイルもつくれます。音声合成はこちら

f:id:dnjiro:20210421073844g:plain

他のアニメの作り方はこちら9VAeの質問はこちら

 

内容:

 

■ 9VAeきゅうべえのダウンロード


www.youtube.com

1.「ひとコマアニメーション」で解説動画を作ると簡単

「ひとコマアニメーション」は、キッズプラザ大阪で開発されたアニメーション手法です。静止画を作るのと同じコストで動画が作成できます。

 

9VAeきゅうべえ Ver.0.8.0 (210201) から、各ページでひとコマアニメーションが作成できるようになりました。ページの時間メニューに「ひとコマ」の項目がない場合、9VAeを最新版にしてください

 

「ひとコマアニメーション」は簡単です。

  1. 描いた順番にアニメーションが再生されます。
  2. 線や文字の長さに応じて再生時間が自動的に調整されます。
  3. 単なる動きの録画ではなく、動きの調整が自由にできます。

 ひとコマアニメーションで作成した解説動画は、あとから文字や画像の差し替えが簡単にでき、保守性の高い動画になります。

 

解説動画は、次のパーツで作成します。

  1. キャプチャー画像
  2. 縁つき矢印
  3. 縁つき文字

 静止画画面をつくれば、そのまま動画になります。9VAeのキーフレーム補間を組み合わせると複雑な動きも表現できます。

 

画面キャプチャ方法

 

OS
画面キャプチャ方法
保存先
 Windows
クリップボード
 Mac
  • Shift + Command + 4 
デスクトップ
 Android
  •  電源 + 音量Down
 adbコマンド (開発者向け)
  •  adb shell screencap -p /sdcard/screen.png
     adb pull /sdcard/screen.png
フォトアプリ>
スクリーンショット
 
iPhone / iPad
  •  ホームボタン + 電源ボタン
  • サイドボタン + 音量UP
写真>
アルバム>
スクリーンショット
 Linux Mint
  • Print Screen キー
クリップボード
ファイル
 Amazon Fire
  • 電源 + 音量Down 1秒長押し
  • USBケーブルでPCと接続し、
    設定>接続デバイス>USB>ファイル転送
ピクチャ >
スクリーンショット

 

2.説明したい画面をキャプチャし、連番をつける

まず解説したい画面を必要な枚数だけ画面キャプチャし、ファイル名を連番にします。

f:id:dnjiro:20210420070006g:plain

9VAeは連番画像をまとめて読み込むことができ、読み込んだあとはファイル番号の指定だけで、画像を読み出せます。

 

 

3.スマホの場合、連番画像を9VAeきゅうべえフォルダに集める

スマホ版の9VAeきゅうべえは連番画像を9VAeフォルダにいれておく必要があります。キャプチャ画像は最初カメラロールにはいるため、カメラロールの画像をファイルマネージャなどでコピーします。こちらの記事も参考にしてください。

パソコン版では、連番画像用フォルダを作成し、その中に連番画像を集めるとよいでしょう。

 

f:id:dnjiro:20201015125339g:plainメモ:9VAeに連番画像を読み込んだ場合、9VAeのファイルには連番画像のファイルパス名だけが記録されます。従って、9VAeは連番画像と同じフォルダに保存するのがよいでしょう。

 

4. 9VAeで連番画像を読み込む。アニメを画像サイズにする

以下、説明画面で、ABCDの順番に操作していきます。 

f:id:dnjiro:20210420072026g:plain

  1. 画像入力ボタン(上図A)をクリック。用意した連番画像の最初の画像を選びます。「すべて読み込みますか」と表示されるので「OK」をクリックします。
  2. 入力した画像の選択枠の中心の「+」(上図B)をクリック。メニューから「ステージの大きさにする」をクリック。これで画像が全体に広がります。
  3. 選択枠の中心の「+」(上図B)をクリック。メニューから「ページを画像に合わせる」をクリック。これでステージのサイズが画像サイズになります。
  4. 選択枠の中心の「+」(上図C)をクリック。メニューから「連番()-()」をクリック。開始、終了番号が「-1」「-1」(-1は自動設定の意味)になっています。これを先頭の画像番号(001なら1)にします。1番なら「1 」「1」とします。

f:id:dnjiro:20201015125339g:plainメモ:連番画像は、初期設定(開始番号と終了番号が−1)になっていると、再生時に連番画像が順に表示されます。開始番号と終了番号をどちらも1に設定すれば、1番の画像だけが再生されます。

 

5. 先頭ページにタイトル文字を入れる

f:id:dnjiro:20210420083045g:plain

  1. ページ左側の「<」(上図D)をクリック。「空白ページを作る」で新しいページを作ります。
  2. 文字入力ボタン「A」(上図E)をクリック。タイトル文字「9VAeで解説動画の作り方」を入れます。
  3. 文字の選択枠の角のハンドル(上図F)をドラッグすれば、文字を拡大できます。
  4. 線の種類を設定するボタン(上図G)をクリック。メニューから「縁をつける」をクリックすると文字に縁がつきます。同様にメニューから「影をつける」をクリックすると文字に影がつきます。メニューから「太く」を何回かクリックすれば、縁や影を太くできます。
  5. 塗り色2ボタン(上図H)をクリック。ここで縁の色を変更できます。ここでは白にしました。

  6. 文字タブ(上図I)をクリック。パレット2(文字属性)に切り替えます。
  7. 文字色ボタン(上図J)をクリック。文字の色をピンク色に設定しました。

f:id:dnjiro:20201015125339g:plainメモ:線の属性ボタンをつかって、矢印や文字に縁取り、影がつけられます。縁どりの色は図形パレットの色2で設定します。

 

6. 矢印を入れる

f:id:dnjiro:20210420110028g:plain

  1. 2ページ(上図K)をクリックして2ページに移動。
  2. パレットのタブ1(上図L)をクリックしてパレット1(図形属性)を表示。
  3. 線の種類ボタン(上図M)をクリック。メニューから矢印を選択
  4. 多角形入力ボタン(上図N)をクリック。このモードでは頂点を順番にクリックして入力します。
  5. 最初の点(上図O)をクリック
  6. 終了点(上図P)をクリック
  7. 選択ボタン(上図Q)を2回クリック。線の入力が終了し、矢印が入ります。
  8. 線の太さボタン(上図R)をクリック。メニューの「太くする」を数回クリックし、矢印を太くします。
  9. 線の色ボタン(上図S)をクリック。矢印の色を赤にしました。

 

f:id:dnjiro:20201015125339g:plainメモ:多角形を入力するボタンでは点を順番にクリックして入力します。最初か最後の点と同じ点、もしくは、選択ボタンをクリックすれば入力が終了します。

 

7. ページに「ひとコマ」を設定。プレイする。

f:id:dnjiro:20210420142728g:plain

  1. 2ページの時間(上図T)をクリック。メニューから「ひとコマ」をクリック。
  2. プレイボタン(上図U)をクリック。これで矢印がのびていく「ひとコマアニメーション」が作成されます。 

f:id:dnjiro:20201015125339g:plainメモ:「ひとコマ」に設定したページは、プレイボタンを押すたびに、描いた順番に絵ができるアニメーションが作成されます。ページの時間は毎回自動設定されます。

 

8. 次ページを作成。連番画像を次の番号にする

f:id:dnjiro:20210420162328g:plain

  1. ページの右側の「+」(上図V)をクリック。メニューから「続きのページを作る」。これで次のページができます。
  2. 画像をクリック。選択枠中心の「+」(上図W)をクリック。メニューから「連番 (1)-(1) 」をクリック。開始番号、終了番号の入力画面になります。
  3. 開始番号、終了番号を次の番号「2」に変更します。これで、次の画像に変わります。
  4. ページの時間(上図X)をクリック。「ひとコマ」に設定します。

f:id:dnjiro:20201015125339g:plainメモ:連番画像の開始番号、終了番号を変更すれば、画像の切り替えができます。

 

9.矢印をカットして複製

f:id:dnjiro:20210420165413g:plain

  1. 矢印をクリックして選択(上図Y)。
  2. 切り取りボタン(上図Z)をクリック。矢印を記憶ツールに入れます。
  3. 貼り付けボタン(上図a)をクリック。メニューから「複製する」をクリック。矢印を元の位置に戻します。
  4. 点選択ボタン(上図b)をクリック。矢印の点が表示されます。
  5. 矢印の先(上図c)をドラッグして矢印の向きを次の操作の位置に変更します。

f:id:dnjiro:20201015125339g:plainメモ:矢印をいったん切り取って複製するのは前のページとのリンクをきりはなすためです。続きのページ作成では、前のページとリンクした図形になり、再生すると形が変化します。いったん削除して「複製する」を行うとリンクしていない別の図形になり形が変化しなくなります。

 

10.説明用文字を入力

f:id:dnjiro:20210420173317g:plain

  1. 文字入力ボタン(上図d)をクリック。ここでは「ステージの大きさにする」と入力しました。
  2. 線の種類のボタン(上図e)をクリック。メニューから実線を選ぶと文字に枠線がつきます。
  3. 塗り色ボタン(上図f)をクリック。文字背景色を指定すると、文字背景に色がつきます。ここでは水色にしました。
  4. 文字(上図g)をドラッグして位置を合わせます。

f:id:dnjiro:20201015125339g:plainメモ:線の種類ボタンで文字枠、塗り色ボタンで文字背景に色がつけられます。

 

11.続きのページ作成、切り取り、複製、ひとコマに設定

f:id:dnjiro:20210420184552g:plain

  1. 最後のページの右側の「+」(上図h)をクリック。メニューから「次のページを作る」。次のページを作ります。
  2. 画面全体をドラッグして選択(上図i)。
  3. 切り取りボタン(上図j)をクリックして全部切り取ります。
  4. 貼り付けボタン(上図k)をクリック。メニューから「複製する」。これで前のページにリンクしていない図形になります。
  5. 文字(上図l)をクリックして選択。中心の「+」をクリック。メニューから「文字の内容変更」をクリック。文字を「ページを画像に合わせる」に変更します。
  6. ページの時間(上図m)をクリック。「ひとコマ」にします。

f:id:dnjiro:20201015125339g:plainメモ:ページを複製し、文字、矢印、画像を修正していきます。

 

12.空白ページを作成、ページを複製、内容変更

f:id:dnjiro:20210420234434g:plain

  1. 最後のページの右の「+」(上図n)をクリック。メニューから「空白ページを作る」を実行。次のページを作ります。
  2. 貼り付けボタン(上図o)をクリック。メニューから「複製する」。
  3. ページの時間(上図p)をクリック。「ひとコマ」に設定します。
  4. 矢印(上図q)を2回クリック。矢印内部の点が表示されるので、ドラッグして矢印の向きを変更。
  5. 文字(上図r)をクリックして選択。中心の「+」メニューから「文字の内容変更」をクリック。文字を「空白ページを作る」に変更します。ドラッグして位置を矢印の近くに移動します。

f:id:dnjiro:20201015125339g:plainメモ:空白ページに複製して、内容を修正していきます。

 

f:id:dnjiro:20210420233714g:plain

  1. 最後のページの右の「+」(上図s)をクリック。メニューから「空白ページを作る」で次のページを作ります。
  2. 貼り付けボタン(上図t)をクリック。メニューから「複製する」。
  3. ページの時間(上図u)をクリック。「ひとコマ」に設定。
  4. 矢印(上図v)を2回クリック。矢印内部の点が表示されるので、ドラッグして矢印の向きを変更。
  5. 文字(上図w)をクリックして選択。中心の「+」メニューから「文字の内容変更」をクリック。文字を「9VAeで解説動画の作り方」に変更します。

f:id:dnjiro:20210420235121g:plain

  1. 最後のページの右の「+」(上図x)をクリック。メニューから「空白ページを作る」。次のページを作ります。
  2. 貼り付けボタン(上図y)をクリック。メニューから「複製する」。
  3. ページの時間(上図z)をクリック。「ひとコマ」に設定します。
  4. 連番画像(上図A)をクリックして選択。選択枠中心の「+」をクリック。メニューから「連番 - 」をクリック。開始番号を次の番号にして画像を変更します。
  5. 文字(上図B)をクリックして選択。
  6. 削除ボタン(上図C)をクリックして文字を削除。
  7. 矢印(上図D)を2回クリック。矢印内部の点が表示されるので、ドラッグして矢印の向きを変更します。

f:id:dnjiro:20210421001400g:plain

  1. 最後のページの右の「+」(上図E)をクリック。メニューから「空白ページを作る」。次のページを作ります。
  2. 貼り付けボタン(上図F)をクリック。メニューから「複製する」。
  3. ページの時間(上図G)をクリック。「ひとコマ」に設定します。
  4. 連番画像(上図H)をクリックして選択。選択枠中心「+」メニューから「連番 - 」をクリック。開始番号を変更して次の画像にします。
  5. 矢印(上図I)を2回クリック。矢印内部の点が表示されるので、ドラッグして矢印の向きを変更します。
  6. 文字(上図J)をクリックして選択。中心の「+」メニューから「文字の内容変更」をクリック。文字を「縁をつける」に変更します。
  7. 画面全体をドラッグして選択(上図K)。
  8. コピーボタン(上図L)をクリックして全部コピー。

f:id:dnjiro:20210421002819g:plain

  1. 最後のページの右の「+」(上図M)をクリック。メニューから「空白ページを作る」。次のページを作ります。
  2. 貼り付けボタン(上図N)をクリック。メニューから「複製する」。
  3. ページの時間(上図O)をクリック。「ひとコマ」に設定します。
  4. 文字(上図P)をクリックして選択。中心の「+」メニューから「文字の内容変更」をクリック。文字を「影をつける」に変更します。

 

13.ページを増やすためにアニメキャストにする

f:id:dnjiro:20210421061204g:plain

  1. 最後のページのページ番号(上図Q)をクリック。メニューから「ページ指定ここから」をクリック。
  2. 先頭ページ移動ボタン「<<」(上図R)をクリック。
  3. 先頭ページのページ番号1(上図S)をクリック。メニューから「ページ指定ここまで」をクリック。
  4. 選択範囲のページ番号(どれでもよい)(上図T)をクリック。「まとめて切り取る」をクリック。これで全部のページが記憶ツールにはいります。
  5. アニメキャストにするボタン(上図U)をクリック。適当な名前をいれて「OK」。これで切り取ったページが1つのアニメキャストになります。
  6. 先頭ページの時間(上図V)をクリック。メニューから「アニメキャストの時間」をクリック。これで、1ページの時間がアニメキャストの再生時間になります。

f:id:dnjiro:20201015125339g:plainメモ:9VAeきゅうべえは9ページ単位で動画をつくるのが基本です。8ページ程度になったらまとめてアニメキャストにすれば長いアニメが作れます。

 

14.次のページにアニメキャストを複製。別のアニメにする

f:id:dnjiro:20210421062908g:plain

  1. アニメキャストが選択された状態で、コピーするボタン(上図W)をクリック。
  2. ページの右側の「+」(上図X)をクリックし、メニューから「空白ページを作る」。新しいページを追加します。
  3. 貼り付けボタン(上図Y)をクリック。メニューから「複製する」。これでアニメキャストが複製されます。
  4. アニメキャスト中心の「+」(上図Z)をクリック。メニューから「別の名前にして修正」をクリック。アニメキャストの名前を入力して「OK」。これでアニメキャストが複製され、中身のページが開きます。

f:id:dnjiro:20201015125339g:plainメモ:アニメキャストを複製した場合、元のアニメキャストを残しておきたい場合は、中心メニューから「別の名前にして修正」を行います。これで別のアニメキャストになります。これを行わずにアニメキャストを修正すると、複製したアニメキャストは同じものなので中身が同時に変わります。 

 

15.アニメキャストの中を修正

f:id:dnjiro:20210421065829g:plain

  1. 最初のページは不要なので、1ページのページ番号1(上図a)をクリック。メニューから「ページを切り取る」を実行してページを削除します。
  2. 連番画像(上図b)をクリックして選択。選択枠中心の「+」をクリック。メニューから「連番 - 」をクリック。開始番号を変更して次の画像にします。
  3. 矢印(上図c)を2回クリック。矢印内部の点が表示されるので、ドラッグして矢印の向きを変更します。このページはこれで完了です。
  4. 次のページ(上図d)をクリックして移動。
  5. 連番画像(上図e)をクリックして選択。選択枠中心の「+」をクリック。メニューから「連番 - 」をクリック。開始番号を変更して次の画像にします。
  6. 矢印(上図f)を2回クリック。矢印内部の点が表示されるので、ドラッグして矢印の向きを変更します。このページはこれで完了です。

f:id:dnjiro:20201015125339g:plainメモ:アニメキャストの中から元のアニメに戻るにはステージの上の太字の「ファイル名>アニメキャスト名」リストを使います。

  • アニメキャストの修正を終了し、元のアニメに戻るには、ステージの上の太字の「ファイル名>アニメキャスト名」リスト(下図h)の先頭の太字をクリックします。メニューから「このアニメにもどる」で元のアニメに戻ります。
  • また、同じく太字(下図i )をクリックすると、そこにアニメキャストの名前のリストが表示されるので、クリックすれば、アニメキャストの中身を修正できます。

 

f:id:dnjiro:20210421104422g:plain

 

16.ひとコマアニメーションの時間調整

ひとコマアニメーションはプレイボタンを押すごとに時間が自動計算されます。これで大体の時間設定をおこなってから、ページの時間を調整するとよいでしょう。

 

ページの時間をクリックし、秒を指定して細かく調整できます。

ページ番号から複数ページを範囲指定して、まとまったページの時間をまとめて変更することもできます。

f:id:dnjiro:20201015125339g:plainメモ:ページの時間を変更すると「ひとコマ」設定が解除されます。

 

17. アニメーションを動画にする

  1. 出力する前に「ファイルメニュー>名前を付けて保存」で名前をつけて保存しておきましょう。
  2. 「ファイルメニュー>アニメGIF出力」でアニメGIFが出力できます。スマホ版では、「9VAeフォルダ」と「カメラロール」に保存されます。パソコン版では最初に保存場所を選びます。
  3. 動画素材を作る場合、画面サイズは、幅を空白、高さを720、コマ/秒を30にするとよいでしょう。「OK」ボタンでアニメGIFが出力されます。

     

     

 動画(MP4)の作成

  1. Mac/iPhone/iPad /Android/Amazon Fire の場合、ファイルメニュー「動画出力」で、MP4動画を作成できます。

  2. Windows/Linuxの場合、FFmpegが必要、Youtube解説

 

ezgif.comでMP4動画を作成する方法 

  1. GIF to MP4 または、APNG to MP4 を開く
  2. アニメGIFまたはAPNGファイルを指定(背景は透明にしない)

  3. 「Upload!」をクリック > 「Convert GIF to MP4!」をクリック > 「Save」(フロッピーディスクアイコン)をクリック。MP4をダウンロードできます。

 

f:id:dnjiro:20201016170757g:plainメモ:Mac版、 iPhone版は、MP4動画が出力できます。iPhoneを使った音入りアニメの変換方法はこちら

  

 

9VAeをつかえば素材動画が作れる 

  • 9VAeきゅうべえを使えば、オリジナルの素材動画が簡単に作れます。
  •  Openclipart や  FreeSVG など多くのSVGイラストをつかって動くキャラクタ素材も作れます。
  • 動画編集ソフトで動画に合成できます。

OS

フリーソフト

9VAeで作成する素材動画

Windows

AviUtl

連番PNG または MP4(Ezgifで変換)

Mac/iPhone/iPad

iMovie

MP4 または QuickTime(古いMac)

Android

PowerDirector

GIF

作り方

 

  • もっと長いアニメを作ることもできます。以下をご覧ください。

9VAeきゅうべえ:長いアニメを作る方法 - Qiita

 

 

サムネイル画像の作成

  • 9VAe Ver.0.8.5 (スマホ Ver.1.5)から各ページを任意サイズのPNG画像に出力する機能がつきました。
  1. ファイルメニュー>画像出力。パソコン版は先に保存フォルダと保存名を指定します。
  2. 画像設定画面で、画像サイズ(縦横ドット数)を指定します。Youtube サムネイルは 1280x720 推奨。 サムネイルの場合「背景を透明にする」にはチェックをいれないほうがよいでしょう。
  3. 原稿の縦横比率を変更したい場合は、「ページメニュー>ページ設定」でステージのサイズを変更します。

 

 

9VAeきゅうべえに関する質問

 

 

半透明グラデーションが動く動画が作れる無料アプリ:9VAeきゅうべえ

9VAeきゅうべえアンドロイド版でもPC版iPad版でもつくれます。

f:id:dnjiro:20200719174639g:plain





作業時間は10分程度です。[完成データはこちら]

他のアニメの作り方はこちら9VAeの質問はこちら

このアニメはグラデーションのキーフレーム補間をつかっており、9VAe以外のフリーソフトで作るのは難しいでしょう。

 

■ 9VAeきゅうべえのダウンロード


9VAeきゅうべえの使い方

 

1. SVGイラストのダウンロード

  1. 以下のイラストを開く (開かない場合こちらから「ダウンロード」
    Openclipart - Red Onsen Mark
  2. スマホの場合は、「ダウンロード」ボタンを長押し。メニューから「リンクアドレスをコピー」をタッチ。9VAeきゅうべえのツールメニュー>「ネットからダウンロード」のあと、http:入力エリアを長押しして「貼り付け(ペースト)」。
  3. パソコンの場合は「ダウンロード」ボタンを右ボタンでクリック。「対象をファイルに保存」または「リンク先のファイルをダウンロード」。9VAeきゅうべえメニューから「ファイル>開く」をクリック。ダウンロードしたファイルを選ぶ。SVGが読めない場合はバージョンが古いので最新版にしましょう。
これで、9VAeにSVGイラストが読み込まれます。
左下の「虫眼鏡」ボタンをクリックすると全体が見えます。 

f:id:dnjiro:20190405095741p:plain

 

2. アニメキャストの中身を保存(スマホの場合)

よみこんだイラストはアニメキャストという部品のアニメになります。静止画として使う場合はアニメキャストにしておくほうが便利ですが、動きをつけたい場合は、アニメキャストの中身を開きます。
 
  1. 選択枠の中心の「+」をクリック。メニューの上から2番目「アニメ(...)を修正」をクリック。アニメキャストの中が開きます。

  2. ねんのため「ファイル>名前をつけて保存」で「onsen」と名前をつけて保存しましょう。

  3. メニューバー「ファイル>閉じる」をクリック。
  4. メニューバー「ファイル>開く」をクリック。「onsen」を開く。
  5. これに動きをつけていきましょう
  6.  

 

3. 点の数を減らして、グループ解除

(1)点の数を減らす

  1. 画面をタッチして図形を選択。
  2. メニューバー「編集>点を減らす」をクリック。これで点の数が減り、編集しやすくなります。(パソコンの場合は、編集>効果>点を減らす)

 

(2)グループの解除

  1. 画面の図形をクリック。中心の「+」をクリック、メニューから「グループ解除」をクリック。もう一度湯気をクリック。中心の「+」をクリック、メニューから「グループ解除」をクリック。これで図形がばらばらになります。

 

4.湯気をのばして透明グラデーションをつける

(1)湯気3本を複製して下につなげる

  1. 3本の湯気をいっしょに選択。中心の「+」をクリック、メニューから「複製」をクリック。
  2. 複製した湯気を下に移動し、長い湯気を作ります。中央の湯気は少し下に移動させましょう。

    f:id:dnjiro:20190405141536p:plain

(2)6本の湯気をグループ化し「いっしょに塗る」ようにしてグラデーションをつける

  1. 6本の湯気を同時に選択。中心の「+」をクリック、メニューから「グループ化」をクリック。湯気をひとつのグループにまとめます。
  2. 中心の「+」をクリック、メニューから「いっしょに塗る」をクリック。
  3. 右上のパレットからグラデーションのパレットをクリック。上から4番目のかまぼこ型グラデーションをクリック。下のようなグラデーションになります。

「いっしょに塗る」がでてこない場合、グループ化されていないかもしれません。もしくはグループの中にグループが含まれると表示されません。「いっしょに塗る」は特別なグループ化(図形だけがはいっているグループ)にだけ存在するオプションです。また、「いっしょに塗る」にチェックをつけると、1つの図形とみなされるようになり、チェックをはずすまでグループ解除ができなくなります。

  1. f:id:dnjiro:20190405143106p:plain

(3)グラデーションの制御点◇を選んで右上に移動させる

  1. 点選択ボタンf:id:dnjiro:20181027163024g:plainをクリック。湯気の点が表示されるので、右端の◇、または左上の湯気の点を1点だけ選んで、もう一度f:id:dnjiro:20181027163024g:plainをクリック。これで下図のようにグラデーションの点が選びやすくなります。
  2. グラデーションの点◇4点を選んで、右上に移動。選択枠の角のハンドルをドラッグして、サイズを半分に縮めます。

    f:id:dnjiro:20190405144401p:plain

    グラデーションの点の意味は、緑色の◇がグラデーションの範囲、オレンジ色の◇を結ぶ線がグラデーションの方向になります。

(4)グラデーションの色2を透明にする

  1. カラーパレットの色2ボタン(上図の黄色いボタン)をクリック。色を赤にし、カラーパレットの上の透明度を一番左側(透明)にします。虫眼鏡ボタンを押して再描画すると下図のようになります。

    f:id:dnjiro:20190405150010p:plain

 

5.続きのページを追加

動きをつけるために続きのページを作りましょう。

  1. ページの右側の f:id:dnjiro:20181221171302g:plain をクリック。メニューから「続きのページを作る」をクリック。2ページができます。

 

6.前後のページを表示し、下の湯気を前のページの上の湯気に合わせる

  1. メニューバー「表示>前後のページを重ねて表示」をクリック。前のページの湯気の場所が水色で表示されます。
  2. 2ページの湯気を選び、下の湯気が前のページの上の湯気に重なるように移動させます。
  3. 中心の湯気の位置も合わせましょう。湯気を選んで、点選択ボタンf:id:dnjiro:20181027163024g:plainをクリック。中心の湯気の点を一部選んで、2回f:id:dnjiro:20181027163024g:plainをクリック。これで中心の湯気だけ選ばれるので前のページの湯気の位置にあわせます。

    f:id:dnjiro:20190405152638p:plain

7.2ページのグラデーションを1ページと同じ位置にする

  1. 2ページのグラデーションの点を選んで、1ページのグラデーションの点と同じ位置に移動させます。

    f:id:dnjiro:20190405153815p:plain

8.1ページに「繰り返し」をいれる

  1. 1ページに移動。メニューバー「ツール>繰り返し」をクリック。これで1ページと2ページの間を繰り返します。
  2. プレイボタンf:id:dnjiro:20181029083754g:plainをクリックし、下から湯気があがっていくアニメーションをみてください。

 

9.アニメGIF出力

  • ファイルメニュー>「アニメGIF出力」で、好きなサイズのアニメGIFが作成できます。
  • 「繰り返し」を入れているため、アニメーションの時間が無限になっています。アニメGIFの時間は、「1」を入力し、繰り返し1秒のアニメGIFをつくりましょう。
  • 画像サイズについて、スマホ版では、幅、高さのどちらかを空白にしておけば、比率を保った数値が自動設定されます。MP4動画を作る場合は高さ「720」に設定するとよいでしょう。
  • Androidの場合、完成したファイルは、端末内の「9VAe」フォルダの中に、指定した名前、例えば「onsen.gif」という名前で出力されます。フォトアプリで、「端末内の写真>9VAe」で見ることができます。

 

10.ezgif サイトで、MP4動画に変換

アニメGIFは簡単にMP4動画に変換できます。

  1. ezgif.com ( Online GIF to MP4 Video converter ) を開く
  2. 「ファイルを選択」をクリック > 作成したファイルを選ぶ。(Android版の場合、「ファイル」をクリックし、出力されたアニメGIFを選ぶ)
  3. Upload!」ボタンをクリック
  4. Convert GIF to MP4!」ボタンをクリック
  5. Save」ボタン(フロッピーディスクアイコン)をクリック
  • これで、MP4ファイルが保存できます。

 

11.SVGアニメ出力

  • Ver. 0.6.6 以上のバージョンでSVG出力してください。
  • 9VAeきゅうべえ(スマホ版)は、SVG形式で保存されます。ChromeFirefox ではプラグインなしでアニメーションになります。(Internet Explorer や Edge では静止画になります。)
  • 9VAeきゅうべえ(Windows版、Linux版)では、保存するときに、SVG形式で保存できます。Mac版では、ファイルメニューの中に、SVG出力があります。

 

12.完成したSVGアニメの読み込み

  • 9VAeきゅうべえで保存したSVGアニメーションは、9VAeで読み込めば、自由に編集できます。
  • こちら(完成データ)を長押し、もしくは右ボタンメニューでダウンロードし、9VAeきゅうべえで開いてみてください。

 

9VAeでイラストからループアニメーションがすぐ作れる 

  • 9VAeきゅうべえを使えば、SVGイラストから絵をかかずにループアニメが作れます。FreeSVG などネット上には100万点ぐらいSVGイラストがあります。そのまま静止画として使うのはもったいない。ぜひ動きをつけてご利用ください。
  • もっと長いアニメや動画を作ることもできます。以下をご覧ください。

9VAeきゅうべえ:長いアニメを作る方法 - Qiita

 

9VAeきゅうべえに関する質問

 

 

ACイラストに動きがつけられる無料アプリ「9VAeきゅうべえ」

フリーソフト9VAeきゅうべえを使ってイラストレータ形式のイラストから動画を作る方法を説明します。作業時間は15分くらい。いらすとやから作る方法はこちらSVGイラストはこちら音声合成はこちら

f:id:dnjiro:20210328120307g:plain

他のアニメの作り方はこちら

9VAeの質問はこちら

 


9VAeでイラストレータに動きをつける

 

内容:15分程度

 

■ 9VAeきゅうべえのダウンロード


www.youtube.com

1.「イラストAC」からイラストをダウンロード

  • 「イラストAC」を開きましょう。フリーイラスト素材が多数掲載されています。下の画面は「踏切」で検索した結果です。

 以下、説明画面では、ABCDの順番に操作していきます。

f:id:dnjiro:20210328123506p:plain

 

  1. ダウンロードユーザーでログイン

    f:id:dnjiro:20210511194052g:plain

  2. ダウンロードボタン(上図B)をクリック。イラストを評価するとダウンロードできるようになります。

  3. AI形式(上図C])をクリックしてダウンロード。(イラストによっては、AI形式のダウンロードボタンがないものもあります。)

 

2.inkscape   や  Vectornator でイラストをSVGに変換

inkscape  / Vectornator のダウンロード

  1. inkscape を起動し、ダウンロードした Ai ファイルを開きます。(下図OKボタン)

    f:id:dnjiro:20210328152217p:plain

  2. 「ファイル」メニュー「コピーを保存」で保存すれば、SVGファイルができます。

 Vectornator ( Mac / iPad / iPhone )

  1. Vectornator でダウンロードしたイラストを開く。
  2. iPadの場合は、ファイルアプリを起動し、ダウンロード(下図D)をタッチ。

    f:id:dnjiro:20210511195001g:plain

  3. ダウンロードしたファイルを長押し(上図E)メニューから「共有」(上図F)をタッチ。
  4. 共有アプリから「Vectornator」(上図G)をタッチ

Vectornator から SVG 保存

  1. 左上のボタン「X>」(下図H)をタッチ。ツールボタンが現れます。

    f:id:dnjiro:20210511195829g:plain

  2. 「↑」ボタン(上図I)をタッチ。
  3. 書き出しメニューから「SVG」(上図J)を選んで、「書き出し」(上図K)をタッチ。
  4. 書き出し先は「ファイルに保存」(上図L)
  5. 「このiPad内」(上図M)をタッチ
  6. 「9VAe」(上図N)フォルダを選んで「書き出し」(上図O)。これで、9VAeフォルダにSVGファイルが保存され、9VAeで読み出せます。

 

3.9VAeを起動し、SVGイラストを読み込む

  1. 9VAeを起動。
  2. 「ファイルメニュー」>「開く」(下図P)で保存したSVGイラストを開きます。

    f:id:dnjiro:20210511200750g:plain

  3.  

    列車が見えない場合、タッチして選択し(上図Q)、点選択ボタン(上図R)をタッチ。

  4. 右上の角の点(上図S)をタッチ。点選択ボタン(上図T)を2回タッチします。1回タッチすると、選んだ点を含む図形の点だけになり、もう一度タッチするとその図形だけ選択された状態になります。
  5. そして削除ボタン(上図U)をタッチすれば、列車が見えるようになります。

f:id:dnjiro:20201015125339g:plainメモ:9VAeはSVG形式のイラストが読み込めます。

 

4. グループ解除して踏切をコピー

  1. 読み込んだイラストはグループ化されています。読み込んだイラストを選択し(上図V)選択枠中心の「+」(上図W)をクリック。メニューから「グループ解除」をクリック。
  2. もう一度踏切を選択(上図X)し、中心「+」(上図Y)をクリック。メニューから「グループ解除」をクリック。
  3. 踏切を選択し(上図Z)、コピーするボタン(上図a)をクリック。これで踏切が記憶ツール(上図aの下の箱)に入ります。

f:id:dnjiro:20201015125339g:plainメモ:記憶ツールをつかって図形をコピーできます。グループ解除のあと、踏切が選択できない場合は9VAeを最新版(Ver.0.7.9-210123以上)にしてください。

 

 

5. 新しいファイルに踏み切りを入れる

  1. 「ファイルメニュー」>「新規作成」(下図b)で新しいファイルを開きます。

    f:id:dnjiro:20210511202056g:plain

  2. 記憶ツールから取り出すボタン(上図c)をクリック。メニューから「ステージにもどす」をクリック。踏切が入ります。ただし画面外に配置されるので見えません。
  3. 表示縮小ボタン(上図d)を何回かクリックすれば見えるようになります(上図)
  4. 選択枠中心「+」(上図e)を上にドラッグし、ステージ(上の白い領域)に移動します。
  5. 選択枠の角(上図f)のドラッグでサイズを調整しましょう。
  6. 虫眼鏡ボタン(上図g)でステージ全体が表示されます。

f:id:dnjiro:20201015125339g:plainメモ:SVGから読み込んだファイルの画面サイズが大きい場合、新しいファイルに取り出したときに画面外に入力されることがあります。選択枠のドラッグで位置、サイズを変更します。

 

6. 踏切のバーをアニメキャストに変更

  1. 踏切のバー(上図h)をドラッグして選択。
  2. 切り取りボタン(上図i)をクリック。記憶ツールにバーをいれます。
  3. アニメキャストにするボタン(上図j)をクリック。「barR」といった名前をつけてアニメキャストにします。
  4. 重なりを下にするボタン(上図k)をクリック。
  5. 点選択ボタン(上図l)をクリック。制御点が表示されます。
  6. 中心の◇(支点上図n)を右側にドラッグ。支点を右端に移動します。
  7. シフトボタン(上図m)を押せば、水平に移動できます。

f:id:dnjiro:20201015125339g:plainメモ:記憶ツールにいれた図形はアニメキャストにできます。アニメキャストは支点を中心に正確に回転できます。

 

7. 左側のバーをアニメキャストに変更

  1. 左側のバー(下図o)もアニメキャストにしましょう。図形を選んで、表示倍率変更ボタン「+」で選んだ図形を中心に拡大できます。

    f:id:dnjiro:20210511205936g:plain

  2. 左側のバーを選んで切り取りボタン(上図p)をクリック。記憶ツールにバーをいれます。
  3. アニメキャストにするボタン(上図q)をクリック。「barL」といった名前をつけてアニメキャストにします(上図)。
  4. 重ね順を下にするボタン(上図r)をクリック。
  5. 点選択ボタン(上図s)をクリック。制御点が表示されます。
  6. 中心の支点◇(下図u)を左側にドラッグ。支点を左端に設定します。Shifitボタン(上図t)を押せば水平に移動できます。

 

8. ライトをアニメキャストにして点滅させる

  1. 赤いライト2つを選択。ライト近くの図形を選んで表示拡大「+」ボタンで拡大できます。
  2. ライトひとつをクリック(上図v)して選択し、Shiftボタン(上図w またはシフトキー)をおして、もうひとつクリック(上図x)。これでライトが2つ選択できます。
  3. 切り取りボタン(上図y)をクリック。記憶ツールにライト2ついれます。
  4. アニメキャストにするボタン(上図z)をクリック。「light」といった名前をつけてアニメキャストにします(上図)。

f:id:dnjiro:20201015125339g:plainメモ:Shiftボタンを押せば、離れた図形を複数選択できます。

 

 

9.右側のライトを黒、ページの時間を0.5秒にする

  1. アニメキャスト選択枠中心の「+」(下図A)をクリック。メニューから「アニメ(:light)を修正する」をクリック。アニメキャストの中が開きます。

    f:id:dnjiro:20210511205445g:plain

  2. 表示拡大ボタン(上図B)をクリックしてライトを拡大します。
  3. 何もないところをクリックして選択解除してから、右側のライト(上図C)をクリックして選択。
  4. 塗り色ボタン(上図D)をクリックし、色を黒に変更。
  5. ページの上の時間(上図E)をクリック。メニューから「0.1秒短くする」を5回クリックし、時間を0.5秒にしましょう。

f:id:dnjiro:20201015125339g:plainメモ:ページの時間を0.5秒にすれば0.5秒間隔で点滅します。

 

10.2ページの左側のライトを黒にする

  1. ページ右側の「+」(上図F)をクリック。メニューから「続きのページを作る」。これで2ページ目ができます。
  2. 左側のライト(上図G)をクリックして選択。塗り色ボタン(上図H)をクリックし、色を黒に変更。
  3. 右側のライト(上図I)をクリックして選択。塗り色ボタン(上図J)をクリックし、色を赤に変更。
  4. 1ページと2ページの間(上図K)をクリックし、メニューから「空白ページを入れる」をクリック。
  5. 入れたページの時間(上図L)をクリック。時間を0秒にします。
  6. 左下の虫眼鏡(上図M)をクリック。これで画面全体が見えるようになります。
  7. ステージの上にある太字(new)をクリック(上図N)。メニューから「このアニメにもどる」をクリック。これで元のアニメに戻ります。

f:id:dnjiro:20201015125339g:plainメモ:1ページと2ページの間に0秒のページを入れると、ライトの赤と黒が瞬時に切り替わります。もし0秒のページを入れなければ色が徐々に変化します。

 

11.ライトを複製し、右側のライトに重ねる

  1. ライトの中心「+」(下図P)をクリック。メニューから「複製する」をクリック。もし、Shiftキー(下図O)を押してから複製すれば、アニメキャストが同じ位置に複製されます。

    f:id:dnjiro:20210511213632g:plain

  2. シフトボタン(上図Q)をクリックし、複製したライトの中心「+」(上図R)をドラッグして右側に移動
  3. 表示倍率ボタンの「-」「+」で見える範囲を調節して右側の遮断機まで移動させましょう。
  4. 右側の元のライト(上図S)をクリックして選択。削除ボタン(上図T)で削除。同様に右のライト(上図U)をクリックして選択。削除ボタン(上図V)で削除します。この上に点滅するライトを重ねます。
  5. 複製したライトをクリックして選択(上図W)し、中心「+」(上図Y)をドラッグしてライトの位置に移動
  6. 虫眼鏡ボタンをクリックしてから、プレイボタン(上図Z)で動きをみてみましょう。

f:id:dnjiro:20201015125339g:plainメモ:左右のライトが0.5秒間隔で点滅します。

f:id:dnjiro:20210329163013g:plain


 

12.角度を指定して遮断機を上にあげる

  1. ページの時間(下図a)をクリック。メニューの「1秒長くする」を2回クリックし3秒にします。

    f:id:dnjiro:20210511215806g:plain

  2. 先頭ページの左側の「<」(上図b)をクリック。「前に続いたページを作る」」をクリック。先頭ページを複製します。
  3. 左側のバー(上図c)を選択。中心「+」(上図d)をクリック。メニューから「支点を回る角度」をクリック。数字を0に設定します。バーが上に上がります。
  4. 右側のバー(上図e)を選択。中心「+」(上図f)をクリック。メニューから「支点を回る角度」をクリック。数字を360に設定します。バーが上に上がります。
  5. プレイボタンで動きを見てみましょう(下図)。
  6. 先頭ページ左側「+」(上図g)をクリック。「前に続いたページを作る」」をクリック。先頭ページを複製します。もう一度プレイボタンを押してみてください。

f:id:dnjiro:20201015125339g:plainメモ:アニメキャストの支点を左右に移動させたため、その回りの角度を指定することでバーが回転するアニメができました。

 

f:id:dnjiro:20210329164912g:plain

 

13.最後のページに先頭ページをコピーする

  1. 最後のページの右側「+」(上図h)をクリック。「続きのページを作る」」をクリック。最後のページを複製します。遮断機がおりたページを2ページ作成します。
  2. 先頭ページのページ番号1(上図i)をクリック。メニューから「ページを記憶する」をクリック。
  3. 最後のページの右側「+」(下図j)をクリック。「記憶したページを入れる」」これで先頭ページが最後のページにコピーされます。

f:id:dnjiro:20201015125339g:plainメモ:「記憶したページを入れる」でページをコピーした場合、前後に同じ図形があれば、自動的にリンクされ、なめらかに動くようになります。

 

14.通過する列車をコピーする

  1. 「9VA」ボタン(下図k)をクリック。メニューの下のダウンロードしたSVGファイルをクリック。SVGイラストを開きます。

    f:id:dnjiro:20210511221841g:plain

f:id:dnjiro:20201015125339g:plainメモ:9VAeは複数のファイルを同時に編集ででき、「9VA」ボタンで切り替えできます。

  1. 列車をクリックして選択(上図l)。グループ化されているため、4つの列車が同時に選択されます。
  2. 点選択ボタン(上図m)をクリック。 
  3. 一番下の列車の点を囲んで選びます(下図n)。
  4. 点選択ボタン(上図o)をもう一度クリック。この操作で選択された点を含む図形だけが選択されます。
  5. コピーボタン(下図p)をクリック。これで一番下の列車だけが記憶されます。

f:id:dnjiro:20201015125339g:plainメモ:図形の点を一部選んでからもう一度点選択ボタンを押す方法は、図形のグループ化の構造を無視して必要な図形だけ選択できるので便利です。

 

 

15.踏切が降りている4ページに列車を入れる。

  1. 「9VA」ボタン(上図q)をクリック。メニューの下の「(new 」から始まるファイルをクリック。踏切のファイル(下図)を読み出します。
  2. 踏切がおりている4ページ(上図r)をクリックして4ページに移動。
  3. 貼り付けボタン(上図s)をクリック。メニューから「ステージにもどす」をクリック。4ページに列車がはいります。
  4. 表示縮小ボタン「ー」(上図t)を何回かクリックすれば列車が見えます。
  5. 選択枠の枠線(下図u)をドラッグし、踏切の位置に列車を移動(下図)
  6. シフトボタン(下図v)をクリックし、重なりを下げるボタン(下図w)をクリック。これで列車の重なりが一番下に下がります。

    f:id:dnjiro:20210511222829g:plain

f:id:dnjiro:20201015125339g:plainメモ:Shiftボタンを押して重なり順位を変更すれば一番上、もしくは、一番下にできます。Shiftキーを押してもかまいません。

 

16.列車をコピーし前後に移動する

  1. 列車が選択された状態で、前のページにリンクコピーするボタン(上図x)をクリック。3ページに列車がコピーされます。
  2. シフトボタン(上図y)をクリック。列車の選択枠の枠線(上図z)を左に移動させましょう。シフトボタンを押していれば、正確に水平に移動できます。
  3. 4ページ(上図A)をクリックして4ページに移動
  4. シフトボタン(上図B)をクリックして、列車の選択枠の枠線(上図C)を右に移動。
  5. 虫眼鏡ボタン(上図D)をクリックしてから、プレイボタン(上図E)を押して動きを見てみましょう。

f:id:dnjiro:20210329202648g:plain

 

 

17. アニメーションを動画にする

  1. 出力する前に「ファイルメニュー>名前を付けて保存」で名前をつけて保存しておきましょう。
  2. 「ファイルメニュー>アニメGIF出力」でアニメGIFが出力できます。スマホ版では、「9VAeフォルダ」と「カメラロール」に保存されます。パソコン版では最初に保存場所を選びます。
  3. 動画素材を作る場合、画面サイズは、幅を空白、高さを720、コマ/秒を30にするとよいでしょう。「OK」ボタンでアニメGIFが出力されます。

     

     

 動画(MP4)の作成

  1. Mac/iPhone/iPad の場合、ファイルメニュー「動画出力」で、MP4動画を作成できます。

  2. Windows/Linux/Android/Amazon Fire の場合、変換サイト:Online GIF to MP4 Video converter - Ezgif.comでアニメGIF を MP4 動画に変換できます。

  3. Windows/Linux の場合、 APNG to MP4 Video converter - Ezgif.com を使えば、APNG をMP4 動画に変換できます。時間がかかりますがGIFよりきれいです。

 

ezgif.comでMP4動画を作成する方法 

  1. GIF to MP4 または、APNG to MP4 を開く
  2. アニメGIFまたはAPNGファイルを指定(背景は透明にしない)

  3. 「Upload!」をクリック > 「Convert GIF to MP4!」をクリック > 「Save」(フロッピーディスクアイコン)をクリック。MP4をダウンロードできます。

 

f:id:dnjiro:20201016170757g:plainメモ:Mac版、 iPhone版は、MP4動画が出力できます。iPhoneを使った音入りアニメの変換方法はこちら

  

 

9VAeをつかえば素材動画が作れる 

  • 9VAeきゅうべえを使えば、オリジナルの素材動画が簡単に作れます。
  •  Openclipart や  FreeSVG など多くのSVGイラストをつかって動くキャラクタ素材も作れます。
  • 動画編集ソフトで動画に合成できます。

OS

フリーソフト

9VAeで作成する素材動画

Windows

AviUtl

連番PNG または MP4(Ezgifで変換)

Mac/iPhone/iPad

iMovie

MP4 または QuickTime(古いMac)

Android

PowerDirector

GIF

作り方

 

  • もっと長いアニメを作ることもできます。以下をご覧ください。

9VAeきゅうべえ:長いアニメを作る方法 - Qiita

 

 

9VAeきゅうべえに関する質問

 

 

CapCut 用動画素材が作れる無料アプリ:9VAeきゅうべえ

動画編集アプリ CapCut 用のはめ込み合成素材を無料アプリ9VAeきゅうべえで作る方法を説明します。作業時間は15分くらいです。サムネイルもつくれます。iMovieの人はこちらAviUtl(Windows)はこちらPowerDirectorはこちら音声合成はこちら

f:id:dnjiro:20220211083402g:plain

他のアニメの作り方はこちら9VAeの質問はこちら

内容:

 

■ CapCut のダウンロード

 

■ 9VAeきゅうべえのダウンロード

↑これを見るとダウンロード、キーフレーム補間、SVGイラストをパーツ化して口パクさせる方法がわかります。パソコンでもiPadでも同じ操作です。

 

CapCutと9VAeの関係

    • CapCut はスマホ用の動画編集アプリです。無料でいろんな動画編集ができます。
    • 9VAeをつかうと、上の「カニとたたかう」のような自由に動く素材を自作できます。CapCut付属とは異なる効果を使いたい場合や素材が見つからない場合、9VAeで自作するとよいでしょう。プロは Adobe Premiere で作成できないときに After Effects を使いますが、CapCut と 9VAe もそのような関係です。
    •  
      9VAeきゅうべえ
      CapCut
      方式
      図形のすべての点の対応関係をもったベクトル方式
      タイムラインに画像を並べるビットマップ方式
      修正
      形を後から自由に修正できる
      画像を描き直す
      補間
      変形した形はなめらかに変化する
      形の補間は苦手
      データ量
      中間がないので小さい
      何枚も画像が必要で重い
      階層化
      9VAeの中に30階層まで
      9VAeがはいる。全て編集できる
      はめ込み合成1階層
      中身は編集できない

1.サンプル動画を作成(自分で撮影した動画でもOK)

作り方を説明するために、9VAeきゅうべえで、サンプル動画を作成します。自分で撮影した動画をつかってもかまいません。

  1. 9VAeを起動。iPhone版9VAeDanglaの場合、表示メニュー「ダークモード」で白バック画面になります。ここでは白バック画面で説明します。

    f:id:dnjiro:20210607175459g:plain

  2. 「ヘルプメニュー>(かおであそぼう(練習用))>変身」をタッチ。下画面のようになります。

    f:id:dnjiro:20200813102654p:plain

  3. iPhone版の場合、「ファイルメニュー>動画出力」で、MP4動画ができます。動画の設定は、幅を空白(自動設定)、高さを720、コマ/秒を30で出力しましょう(下図)。9VAeインストール直後はカメラロールに保存できません。カメラロールへのアクセスを許可して、もう一度実行してください。

    f:id:dnjiro:20200813103545p:plain

  4. Android版9VAeXの場合、「ファイルメニュー>動画出力」で、MP4動画ができます。動画出力がない場合「アニメGIF出力」でアニメGIFを作成し、ezgif.com で、MP4 に変換します。この記事の後ろで作り方を説明します。PowerDirectorなら、アニメGIFでも読み込めます。

 

2. CapCut で新規プロジェクトを作成、MP4動画を入れる

  1. CapCut を起動
  2. 「+」新しいプロジェクトをタッチ
  3. 「アルバム」「動画」の中からサンプルにする動画(下図A)をタッチ

    f:id:dnjiro:20201016161824p:plain

  4. 右上(下図B)をタッチして選択。追加ボタン(下図C)をタッチ

    f:id:dnjiro:20201016162121p:plain

  5. プレイボタンで再生してみましょう。

 

この動画にしゃべるキャラクタと吹き出し文字をいれてみましょう。Openclipartに商業利用可能な口パク素材が登録されています。

 

■ 無料口パク素材

 

3.9VAeきゅうべえに無料口パクキャラクタを読み込む

  1.  OpenclipartにあるフリーのSVG(miku usagi hat Animation)を読み込みましょう。
  2. スマホの場合、上のリンクをひらき、DOWNLOADの下にある、「SVG(Vector)」ボタン(ここでもよい)(下図D)を長押しし、メニューから「コピー」(「リンクアドレスをコピー」)(下図E)をタッチします。次に、9VAeきゅうべえを開き、「ファイルメニュー>新規作成」のあと「ツールメニュー>ネットからダウンロード」(下図G)を実行し、http 入力欄を長押しして「ペースト(「貼り付け」)をタッチ(下図H)。OK(下図I)をタッチすれば、キャラクタが入力されます。f:id:dnjiro:20210512211616g:plain
  3. パソコン版の場合、DOWNLOADの下にある、「SVG(Vector)」ボタン(ここでもよい)を右ボタンでクリックし、メニューから「リンク先を保存(または対象を保存)」をクリックして保存します。次に、9VAeきゅうべえを開き、「ファイルメニュー>新規作成」のあと「ツールメニュー>9VA/SVG/WMFを入れる」でダウンロードしたSVGファイルを読み込んでください。

f:id:dnjiro:20201015125339g:plainメモ:9VAeは、Openclipart のSVGイラストを素材として読み込めます。スマホ版は「ネットからダウンロード」、パソコン版はどこかに保存して「9VA」ボタンから入力。

 

4.キャラクタの位置、サイズ調整

  1. 左下の虫眼鏡(上図J)をタッチすれば全体が見えます。(iPhone版横画面で虫眼鏡ボタンが見えない場合は縦画面にしてタッチしてください。画面右下をタッチすればパレットのON/OFFができます。Android版は回転後、画面タッチで回転します)
  2. キャラクタを囲んでいる選択枠の角のハンドル(上図K)のドラッグでサイズ変更。枠線または中心(下図L)のドラッグで移動ができます。キャラクタを右下に移動させましょう。
  3. 文字を入れましょう。 文字入力ボタン「A」(下図M)をタッチ。
  4. 「9VAeで作りました」と入力。「OK」ボタンで入力完了。左上に移動させましょう(下図N)。

    f:id:dnjiro:20210512212649g:plain

f:id:dnjiro:20201015125339g:plainメモ:文字やイラストは選択枠の角のハンドルで拡大縮小、枠線または中心「+」のドラッグで移動できます。

 

5.文字に吹き出しをつける

  1. 上の図形タブ3(上図P)をタッチすると、基本図形が入力できます。文字を選んだ状態で、吹き出し(上図Q)をタッチすれば、文字の背後に文字の大きさにあわせた吹き出しが入ります。iPhone版で図形タブが見えない場合、右下すみ(上図O)で見えるようになります。
  2. 吹き出しの選択枠の左辺のハンドル(下図S)をタッチ。メニューから「反転」。画面を1回タッチ。
  3. 吹き出しの選択枠の上辺のハンドル(下図T)をタッチ。メニューから「反転」。画面を1回タッチ。

    f:id:dnjiro:20210512213701g:plain

  4. ドラッグして位置を調整(上図U)。
  5. 点選択ボタンをタッチして、吹き出しの尖った部分をキャラクタの位置に移動させることもできます。

f:id:dnjiro:20201015125339g:plainメモ:選択枠の辺のハンドルをタッチするといろんな変形のメニューがでてきます。

 

6. 文字と吹き出しに、書き順エフェクトを追加

  1. ページの上の時間(上図W)をタッチしメニューから「ひとコマ」をタッチ。これで、プレイ(上図X)をタッチすれば吹き出し、文字が順番にでてくるアニメーションになります。「ひとコマ」機能がない場合、9VAeを最新版にしてください。(Ver.0.8.0(210201)で追加されました。) f:id:dnjiro:20210129143358g:plain

f:id:dnjiro:20201015125339g:plainメモ:ページに「ひとコマ」を設定すれば順番に出てくるアニメーションができます。

 

7. キャラクタに口パクをつける

最初、キャラクタは「んあいうえお」としゃべっています。これに口パクをつけましょう。

  1. キャラクタをタッチして選択。選択枠の中心メニュー「+」(下図Y)から「ローマ字で動かす」を実行。
  2. 「3.1:kyuubee de tukuri masitaa.... 」と入力してください(下図Z)。これの意味は
  • 最初の「3.1:」は3.1秒でしゃべるという意味です。
  • それにつづくローマ字がしゃべる言葉で、これにしたがって口パクします。「.」は口を閉じた状態を表します。
  • 読み込んだ miku usagi がローマ字で口パクできるのは、SVGの中に「.aiueo」の順番に口の形が登録されているからです。アニメキャストの中身については、あとで説明します。口パクするキャラクタの作り方はこちらをご覧ください。

    f:id:dnjiro:20210512220523g:plain

f:id:dnjiro:20201015125339g:plainメモ:「んあいうえお」の順番にならんだ口パク素材アニメキャストの中心メニューから「秒数:ローマ字」 を設定すると、口パクします。

  

8.グリーンバック背景ページをいれる、位置、サイズ調整

  1. ページの左側の「<」(上図b)をタッチ。メニューから「グリーンの背景をいれる」をタッチ。メニューにこの項目がない場合、9VAeを最新版にしてください。緑色の背景ページが入ります。

f:id:dnjiro:20201015125339g:plainメモ:9VAeの出力範囲は「ページ設定」で変更できます。

 

 

9. 素材を動画出力

  1. ここまでできたら「ファイルメニュー>名前を付けて保存」で名前をつけて保存しておきましょう。スマホ版では、「9VAe(Dangla/Pro)」フォルダに保存されます。
  2. ファイルメニュー>動画出力」で、好きなサイズの MP4動画 が作成できます。
    Win / RaspberryPi / Linux版 でMP4動画を作るには FFmpeg が必要です
  3. スマホの場合、端末内の「9VAe」フォルダの中に出力されます。フォトアプリで、「端末内の写真>9VAe」で見ることができます。
  4. 動画素材を作る場合、画面サイズは、幅を空白、高さを720または1080、コマ/秒を30にするとよいでしょう。「OK」ボタンで動画を作成します。f:id:dnjiro:20200813233556p:plain

 「動画出力」ができない場合(Android5-6)

  1. 9VAe「ファイルメニュー>アニメGIF出力」
  2. 動画素材を作る場合、画面サイズは、幅を空白、高さを720または1080、コマ/秒を30にするとよいでしょう。「OK」ボタンでアニメGIFを作成します。
  3. 変換サイト:GIF to MP4 - Ezgif.com を開く
  4. 「ファイルの選択」ボタンで、出力したアニメGIFを選び、「Upoad!」ボタンで送信。
  5. 「Convert GIF to MP4!」ボタンでMP4動画に変換
  6. 「Save」ボタン(フロッピーディスクアイコン)でMP4動画をダウンロード
  7. ダウンロードフォルダにダウンロードされるので、これをCapCutで読み込みます。

f:id:dnjiro:20201016170757g:plainメモ:ezgif.com でアニメGIFをMP4に変換できます。

 

 

10. CapCut でグリーンバック素材を入れる

f:id:dnjiro:20201016162901p:plain

  1. 入力した動画を右にドラッグ(上図a)して先頭に移動します。
  2. 「はめ込み合成」ボタン(上図b なければ「オーバーレイ」の中)をタッチ 。グリーンバック動画を追加します。

    f:id:dnjiro:20201016163405p:plain

  3. グリーンバック動画が選ばれた状態で、下のメニューを左にドラッグ(上図h)し、「クロマキー」ボタン(上図i)をタッチ
  4. 「カラーピッカー」ボタン(下図j)をタッチ。

    f:id:dnjiro:20201016163906p:plain

    上のプレビュー画面の緑色の部分をタッチ(上図k)すれば、カラーピッカーの右側に「濃度」「シャドウ」ボタンが現れます。
  5. 「濃度ボタン」(上図l)をタッチし、上のスライダー(上図m)を右側に移動させると。緑色の部分が透明になります。(上図)
  6. 動画トラックを左側にドラッグし、後ろを削除したい部分(下図n)をタッチ

    f:id:dnjiro:20201016164644p:plain

    下の「分割ボタン」(上図o)をタッチ。これで上の動画分割されます。
  7. 後ろの部分(下図p)をタッチし「削除ボタン」(下図q)で後ろが削除されます。

    f:id:dnjiro:20201016165032p:plain

 

11. CapCut で動画出力

  1. 画面上の出力ボタン(上図r)をタッチ
  2. 「エクスポートボタン」で動画が出力されます。

 

12.サムネイル画像の作成

  • 9VAe Ver.0.8.5 (スマホ Ver.1.5)から各ページを任意サイズのPNG画像に出力する機能がつきました。
  1. 9VAe>ファイルメニュー>画像出力。パソコン版は先に保存フォルダと保存名を指定します。
  2. 画像設定画面で、画像サイズ(縦横ドット数)を指定します。Youtube サムネイルは 1280x720 推奨。 サムネイルの場合「背景を透明にする」にはチェックをいれないほうがよいでしょう。
  3. 原稿の縦横比率を変更したい場合は、「ページメニュー>ページ設定」でステージのサイズを変更します。

 

 

おまけ、アニメ素材の修正

  • 9VAeきゅうべえを使えば、グリーンバック素材が自分で作れるのが利点です。キャラクタ(アニメキャスト)を修正する方法を説明しましょう。
  1. まず2ページのキャラクタを選び、選択枠中心の「+」(下図s)をタッチ。メニューから「アニメ(...)を修正」を実行。これでアニメキャストの中が開き、修正できるようになります。f:id:dnjiro:20200814010847p:plain
  2. 右側の登録パレットにある「帽子」(下図t)をタッチ。メニューから「選択する」。これで帽子が選択されます。
  3. 選択枠中心の「+」(上図u)をタッチ。メニューから「つながった図形を選択」。これで全部のページの帽子が選択されます。

    f:id:dnjiro:20200814011850p:plain

  4. 削除ボタン(上図v)これで、帽子を取り除くことができます(下図)。

    f:id:dnjiro:20200814012325p:plain

  5.  

    同様に、うさぎ(上図w)をタッチして「選択する」。選択枠中心「+」(上図x)「つながった図形を選択」。削除(上図y)で以下のようになります。

    f:id:dnjiro:20200814012755p:plain

  6. ここに新しい図形を追加していくこともできます。こちらを参考にして試してみてください。

 f:id:dnjiro:20201016170757g:plainメモ:9VAeで口パク動画素材をいくらでも作成できます

 

 

9VAeをつかえばグリーンバック動画がすぐ作れる 

  • 9VAeきゅうべえを使えば、グリーンバック動画が簡単に作れます。
  •   や  FreeSVG など多くのSVGイラストをつかって動くキャラクタ素材が作れます。動画作成にご利用ください。
  • なお、このサイトの一番上にある動画はアニメGIFで、9VAeきゅうべえで作成したものです。アニメ素材の合成なら9VAeだけでできます。動画と合成するときにCapCutを使うとよいでしょう。
  • もっと長いアニメを作ることもできます。以下をご覧ください。

9VAeきゅうべえ:長いアニメを作る方法 - Qiita

 

 

9VAeきゅうべえに関する質問

「9VALきゅうべえラーニング」の仕様検討

フリーソフト9VAeきゅうべえを開発しています。9VAeは、作りたい動画がなんでも作れるように設計した結果、わかりにくいという声もききます。そこで、もっと簡単な「9VALきゅうべえラーニング」の開発をはじめました。ここでは、その仕様をどうするのがよいか、オープンにして検討します。

f:id:dnjiro:20210531152405p:plain

アニメの作り方はこちらをご覧ください

 

内容:

1.9VAe各ソフトの違い、特長

  • 自分がアニメを作りたかったので、最初に 9VAe を開発しました。アニメーションを作りたいなら、9VAeを理解して使うのがよいです。
  • つぎに、キッズプラザ大阪という子供向け施設に設置するために、PEAS motch! one を開発しました。大勢の子供たちが訪れるので、最短5分でアニメ制作が完了するという条件があったため「ひとコマアニメーション」だけにしました。
  • 5分よりもっと時間がある人には、ひとコマアニメーションは物足りないでしょう。しかし9VAeは難しいという人むけに、9VALラーニングの開発をはじめました。
  • 9VALは9VAeの機能を選んでわかりやすく搭載する。という設計方針になります。

 

 各ソフトの特長をまとめます。

 

項目 9VAeきゅうべえ PEAS motch! one 9VAL ラーニング
ソフトの目的 作りたい動画がつくれる 5分でアニメが完成  学習用、わかりやすい
ユーザー 誰でもアニメを作りたい人 幼児、小学生 小中学生、先生
使用場所 自宅、職場 子供向け施設、イベント 学校、ワークショップ
作れるもの

アニメーション素材

トレス動画他なんでも

ひとコマアニメ

ひとコマアニメ、

教材、動画素材

使える機能 全部 ひとコマアニメ

ひとコマアニメ

素材入力

---使える機能
---    
 ひとコマアニメ  〇    〇  〇
---オブジェクト
---    
 線(色、太さ、種類)  〇  〇  〇
 文字(色、左右中寄せ)  〇    〇
 写真(透明度)  〇    〇
 連番画像  〇    
 消しゴム  〇(白い塗りつぶし)  〇  〇
 矢印・縁取り・半透明  〇    〇
 筆・ぼかし  〇  〇  
 影・ぶれ  〇  〇  〇
 図形スタンプ  〇    〇
 動きパス  〇    〇
 塗りつぶし図形  〇    
 穴あき図形  〇    
 グラデーション  〇    
 SVGイラスト入力  〇    
 音・音楽  〇    
 アニメキャスト作成  〇    〇?
---編集機能
---    
 選択  〇    〇
 制御点の移動  〇    〇
 点属性(曲線・直性)  〇    
 回転、拡大縮小、引き伸ばし、反転  〇    〇
 いろんな変形  〇    
 図形コピー・カット・ペースト  〇    〇
 重ね順変更  〇    〇
 グループ化  〇    
 レイヤ登録  〇    
 動きグラフ  〇    
 点の結合  〇    
 整列、配置、グリッド、吸着  〇    
---ファイル
---    
 保存・開く  〇  〇Android  〇
 アニメGIF出力  〇  〇Android  〇
 複数ファイル編集  〇    
---ページ処理
---    
 グリーンバック背景  〇    〇
 背景スクロール  〇    〇
 ページ選択・コピー  〇    
 ページの時間  〇    
---その他
---    
 往復、繰り返し  〇    
 ボタン分岐、一時停止  〇    
 ラベルジャンプ  〇    
 日英切り替え、多国語  〇    
 検索  〇    
 口パク制御  〇    
       

 

 

2.9VAeの機能を簡単にする工夫

  • ひとコマアニメーションとキーフレームアニメーションの両立が難しい。
  • キーフレームアニメーションをやるためには、「続きのページをつくる」もしくは「リンクコピー」「きおくツール」などの方法がある。リンクコピー、ページ間でつながった図形、といった概念が、難しい。そのため「動き」ページをつくった。
  • ひとコマアニメーション(ホワイトボード)1枚に動き1枚背景1枚だけつけられるように限定。ホワイトボードに書いた絵はすべて動きページにもコピーされ、動かすことができ、動きページに描いた絵は動かない(動いた後のポーズ) になるようにした。
  • 動きページで、移動、拡大などのイフェクトをつける使い方に限定した。リンクがわからなくても使える。



3.コピーペーストの考え方>次のバージョンで搭載予定

  • 複製して修正、過去に作成したデータをコピーペーストする機能はつけたい。
  • 素材のやりとりができるとうれしい
  • きおくツールに図形を入れる、リンクの概念が難しいので「複製する」だけつける。
  • きおくツールをつかうと、複数ファイル間のデータコピーもできる。
  • きおくツールからアニメキャストにする機能は、図形パレットにつける。これでアニメキャストが自作できる。
  • アニメキャストの中身の修正は最初は搭載しない。

 

 

9VAeきゅうべえに関する質問

  • 9VAeとかいて、Yahoo知恵袋で質問すれば情報が得られます。
  • 本記事の文章、図、アニメは複製自由です。教材、解説記事にご利用ください。