dnjiro’s 9VAe blog

誰でもアニメが作れる無料ソフト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きゅうべえアンドロイド/ Chromebook版でもPC版iPad/iPhone版でもつくれます動画編集用素材にもなります

 

f:id:dnjiro:20200724223418g:plain


作業時間は10分程度です。他のアニメの作り方はこちらをご覧ください、年賀アニメ:2025へびうさぎとらうしねずみいのしし


9VAeで簡単動く年賀状作成「マウス」

 

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


9VAeきゅうべえの使い方

 

以下の 図のABCDEの順番に操作していきます。完成データはこちら

 

1. 新規作成して、最初に「1.鉛筆」を押す

9VAeきゅうべえで、絵を順番にかいていく「ひとコマアニメーション」を作る場合、絵を描く前に「1.鉛筆」を押す必要があります。制作中の作品が間違えて「ひとコマアニメーション」にならないようにするためにこうしています。

  1. 「ファイルメニュー>新規作成」をクリック
  2. ページの右側のf:id:dnjiro:20190424153550p:plain(下図A)をクリック>「線を書いたあと、もう一度このボタンを押してください」が出たら「OK」
これで1コマアニメーションの作成準備ができました。

 

f:id:dnjiro:20191216174858p:plain

2.「MOUSE」と書いてもう一度「1.鉛筆」を押す

 これで「MOUSE」と書けばひとコマコマアニメーションができます。
  1. 画面に「MOUSE」と書きましょう。
  2. 「<<  <」ボタン(上図B)を押して、左下の虫眼鏡ボタンを押せば描く場所が広がります。
  3. 描けたら「1.鉛筆」をもう一度押します。これでひとコマアニメのできあがり。
  4. 選択ボタン(上図C)を押して、修正したい線を選べば、位置やサイズを調整できます。「1.鉛筆」を押せば、毎回、ひとコマアニメーションを作り直します。
 

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

  1. 以下のイラストを開く 。ダウンロードは「SVG (Vector)」ボタン
  2. Openclipart - Mouse icon

  3. スマホの場合「SVG (Vector) (ここでもよい) 」ボタンを長押し。メニューから「リンクアドレスをコピー」をタッチ。9VAeきゅうべえのツールメニュー>「ネットからダウンロード」のあと、http:入力エリアを長押しして「貼り付け(ペースト)」。
  4. パソコンの場合は「SVG (Vector) (ここでもよい) 」ボタンを右ボタンでクリック。「対象をファイルに保存」または「リンク先のファイルをダウンロード」。9VAeきゅうべえメニューから「ツール>9VAeアニメを入れる」をクリック。ダウンロードしたファイルを選ぶ
これで、マウスのイラストが読み込まれます。

f:id:dnjiro:20191216180304p:plain


4. マウスを小さくしてMの左上に移動

よみこんだイラストはアニメキャストという部品になります。これを動かしてみましょう。

  1. 左下の「-」ボタン(上図D)を何回か押せばマウス全体が見えます。
  2. 選択枠の角のハンドル(上図E)をドラッグして小さくします。
  3. 選択枠の中心のハンドル「+」(上図F)をドラッグしてMの左上に移動します。

 

5. マウスに動き矢印をつける

  1. 選択枠の中心のハンドル「+」(上図F)をタッチ。メニューから「動き矢印を入力」
  2. 矢印の先の点(下図G)をドラッグして「MOUSE」の右下に移動
  3. 矢印の線上をタッチし、ドラッグすれば点(下図H)が追加されるので「M」の左下に移動

    f:id:dnjiro:20191216190106p:plain

 

6. 動き矢印をMOUSEの書き順の形にする

  1. 動き矢印の上に点を追加して、MOUSEの書き順の形にします(下図の矢印)。

    f:id:dnjiro:20191216193941p:plain

 

7. 矢印にそって向きを変えるに設定。登録ボタンに追加

  1. 選択ボタン(上図I)をタッチ
  2. 選択枠の中心の「+」(上図J)をタッチ。メニューから「矢印にそって向きを変える」をタッチ。
  3. 右側の登録エリアのボタン(上図K)をタッチ。メニューから「追加登録する」をタッチ。これで「MOUSE」の書き順と同じタイミングで動くようになります。
  4. ページの時間(上図L)をタッチ。時間を「10秒」程度にしましょう。
  5. プレイボタン(上図M)で動きをみてみましょう。
  6. 書き順とマウスの動きがあわない場合、点の追加ボタン(上図N)をタッチしてマウスが早く動きすぎる場所に点を追加します。点を増やせばその部分を通過するスピードが遅くなります。

 

8. 文字を入れる

  1. 文字ボタン(下図O)をタッチ。文字を入力します。
  2. 文字の選択枠の角のハンドル(下図P)をドラッグすれば、文字サイズを変更できます。中心の「+」または枠線(下図Q)をドラッグすれば場所を変更できます。
  3. プレイボタンで動きを見てみましょう。

    f:id:dnjiro:20191218053516p:plain

     

9. ページの複製

  1. ページ番号「1」(上図R)をタッチ。メニューから「ページを記憶する」。
  2. ページの右側の「+」(上図S)をタッチ。メニューから「記憶したページを入れる」。これで1ページが複製され、2ページができます(下図)。

    f:id:dnjiro:20191218055935p:plain

 

10. 間に0秒のページをいれる

この状態では1ページの文字、図形が2ページの文字、図形とリンクしており、書き順アニメーションが2ページで逆転します。一度、プレイしてみてください。このリンクを切るために0秒のページをいれます。

  1. ページの中間の「>」(上図T)をタッチ。メニューから「空白ページを作る」
  2. 空白ページの時間「〇〇秒」(下図U)をタッチ。メニューの「1秒短くする」を何回もタッチして0秒にします。
  3. これでプレイボタンを押せば、2回書き順アニメが繰り返されます。

    f:id:dnjiro:20191218061546p:plain

 

11. 文字を変更

  1. 3ページ(上図V)をタッチして3ページに移動
  2. 文字をタッチして文字を選択。文字のまわりに選択枠が表示されます。
  3. 選択枠中心の「+」(上図W)をタッチ。メニューから「文字の内容変更...」をタッチ。
  4. 好きな文字に変更し、プレイボタンを押してみましょう。

 

12.アニメGIF・動画MP4出力

  • ファイルメニュー>「アニメGIF出力」「動画出力」で、好きなサイズのアニメGIFやMP4動画が作成できます。
  • Windows・Linux・RaspberryPiの場合は、FFmpegが必要です。Youtube解説
  • 画像サイズについて、スマホ版では、幅、高さのどちらかを空白にしておけば、比率を保った数値が自動設定されます。MP4動画を作る場合は高さ「720」か「1080」に設定するとよいでしょう。
  • Androidの場合、完成したファイルは、端末内の「9VAe」フォルダの中に、指定した名前で出力されます。フォトアプリで、「端末内の写真>9VAe」で見ることができます。

 

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

アニメGIFは簡単にMP4動画に変換できます。(Mac / iPhone / iPadならアニメGIFを介さずに直接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きゅうべえを使えば、短い動画がすぐ作れます。FreeSVG など多くのSVGイラストサイトの素材が使えます。いろんな動画をつくってみてください。
  • 9VAeは各ソフトにあわせて、いろんなフォーマットでクリップ動画を出力できます。
アプリ クリップ形式 作り方
PowerPoint
LibreOffice
Keynote
アニメGIF 背景を透明にして出力(PowerPointの例
iMovie
PowerDirector
グリーンバック動画 先頭にグリーンバック背景を入れる。(iMovieの例PowerDirectorの例
AviUtl 連番PNG 背景を透明にして出力(AviUtlの例

 

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

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

 

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

 

手描きスケッチ風動画が作れる無料アプリ:9VAeきゅうべえ

9VAeきゅうべえを使えば、写真から手描きスケッチ風動画が誰でもつくれます。9VAeきゅうべえアンドロイド版PC版iPhone/iPad版でもつくれます動画素材になります下の作品は15分でできました。 しゃべる解説はこちら

 

f:id:dnjiro:20190207103630g:plain


Youtubeの解説をみる

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

内容:15分程度

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


www.youtube.com

以下の 図のABCDEの順番に操作していきます。

 

1.9VAeの「1.」をクリックしてから、背景ページに写真を入れる

  1. 9VAeきゅうべえを起動。
  2. 「ファイル>新規作成」
  3. ページの右側のf:id:dnjiro:20181221201107p:plain(下図A)をクリック。「線を書いた後もう一度「1.」ボタンを押してください」が出たら、OKをクリック。★この作業は重要でこれをやっておかないと、書き順アニメを作ってくれません。
  4. ページの左側の「<」(下図B)をクリック。メニューから「背景ページを入れる」をクリック。>背景ページが左側にできます。
  5. 写真入力ボタン(下図C)をクリック。好きな写真を入れます。

    f:id:dnjiro:20200114191424p:plain

  6. ★Android版の場合、ファイルマネージャを使って入れたい写真を端末内部の 「9VAe」 フォルダにいれておけば読み込めます。

 

2.画面サイズの調整

  1. 写真を選んで、選択枠の中心「+」(下図D)をクリック。「ステージの大きさにする」をクリックします。これで写真が画面全体に広がります。
  2. もう一度、選択枠の中心「+」(下図D)をクリック。「ページを画像に合わせる」をクリックします。これでステージの縦横比率が写真と同じになります。(★この項目がない場合は最新版の9VAeきゅうべえをダウンロード

    f:id:dnjiro:20200114193454p:plain

3.写真をなぞって絵を描く 

  1. 2ページ(上図E)をクリックして2ページに移動。背景に入れた写真が下に見えるはずです。
  2. 左上のツールパレットから「えんぴつ」ボタンf:id:dnjiro:20190207084344p:plain(下図F)をクリック。上のf:id:dnjiro:20181221201107p:plainをもう一度クリックしてもよいです。これで線を書くモードになります。
  3. 写真の上をなぞります。録画でない(速度は形から自動計算する)ため、ゆっくりなぞってもかまいません。線が太いと感じたら右側のパレット(下図G)で調節できます。4つならんだ箱が線の属性。左から「線の色」「線の太さ」「線の種類」「矢印」。ちなみに上の色は塗り色です。
  4. 失敗したら、f:id:dnjiro:20181023071022g:plain(下図H)または「Backspace」キーで元に戻れます。
  5. スマホ版では「<< <」ボタン(下図I)をタッチし、ピンチアウト、または虫眼鏡ボタン(下図J)で画面が拡大できます。
  6. 描いた線は、あとから選択して、頂点を移動させることもできるので、あまり気にせず入力すればよいです。

    f:id:dnjiro:20200114202113p:plain

     

4.書き順アニメの作成

  1. 絵が完成したら、写真を取り除きます。背景ページの下の番号「1」(上図K)をクリック。メニューから「ページを切り取る」をクリック。写真がきおくツールに入ります。

    f:id:dnjiro:20200114202933p:plain

  2. ここでf:id:dnjiro:20181221201107p:plain(上図L)をクリック。これで絵を描いていく書き順アニメ(ひとこまコマアニメーション)ができます。簡単でしょう。

5.手描きスケッチから写真に変化させる

  1. ページの右側のf:id:dnjiro:20181221171302g:plain(上図M)をクリック。メニューから「続きのページを作る」をクリック。これで2ページ目(下図N)ができます。
  2. 2ページの時間が長すぎるので、2ページの上の時間「xx秒」(下図N)をクリック。一番上の時間をクリックして「2秒」ぐらいにします。ここに写真をいれます。
  3. 右側のf:id:dnjiro:20190110124400p:plain(下図O)をクリック。メニューから「ステージにもどす」をクリック。これで写真が2ページにはいります。

    f:id:dnjiro:20200114203814p:plain

  4. 写真の中心の「+」(上図P)をクリック。メニューから「透明にする」をクリックしてチェック。これで写真が透明になります。(★「透明にする」がない場合は最新版の9VAeきゅうべえをダウンロード
  5. ページの右側のf:id:dnjiro:20181221171302g:plain(上図Q)をクリック。「続きのページを作る」をクリック。3ページ目ができます。

    f:id:dnjiro:20200114204528p:plain

  6. 3ページの透明な写真をクリックして選択。中心の「+」(上図R)をクリック。メニューから「透明にする」をクリックしてチェックをはずせば写真が元に戻ります。これで完成。
  7. プレイボタンf:id:dnjiro:20181029083754g:plain(上図S)をクリックして、スケッチが描かれたあと、写真に変化するアニメを見てください。

 

6.アニメGIF / 動画(MP4)出力

  1. ファイルメニュー>アニメGIF出力」または「動画出力」で、好きなサイズのアニメGIF または MP4動画 が作成できます。
    Win / RaspberryPi / Linux版 でMP4動画を作るには FFmpeg が必要です
  2. スマホの場合、端末内の「9VAe」フォルダの中に出力されます。フォトアプリで、「端末内の写真>9VAe」で見ることができます。
  3. アニメGIFは、背景を透明にできます。音がいれられません。
  4. MP4動画には音が入れられます。Youtubeに投稿できます。Youtubeに投稿する場合、1秒30コマ、高さ720 または 1080 で出力するとよいでしょう。
  5. 上のアニメGIFも、この方法で作りました。

 

7.ezgif サイトで、アニメGIFをMP4動画に変換

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

 

8.応用編

 

  • 9VAeは各ソフトにあわせて、いろんなフォーマットでクリップ動画を出力できます。
アプリ クリップ形式 作り方
PowerPoint
LibreOffice
Keynote
アニメGIF 背景を透明にして出力(PowerPointの例

iMovie
PowerDirector

CapCut

キネマスター

グリーンバック動画 先頭にグリーンバック背景を入れる。(iMovieの例PowerDirectorの例Capcutキネマスター
AviUtl 連番PNG 背景を透明にして出力(AviUtlの例

 

 

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

 

 

たった5枚の絵からすごいショート動画が作れる無料アプリ:9VAeきゅうべえ

下のアニメーションは 動くGIF素材集の Komori が作成した作品です。この動画の作り方を解説します。9VAeきゅうべえ「ヘルプメニュー>(練習)>カニとたたかう」で中身がみえます。つながった図形についてはこちら

f:id:dnjiro:20210723001849g:plain

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

9VAeの質問はこちら

目次

 

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


www.youtube.com

サンプルアニメーションの入手

  • パソコン版9VAe:ヘルプメニュー>サンプル(練習)>カニとたたかう(exampleフォルダ> komo_island にもあります)
  • スマホ版9VAe:ヘルプメニュー>カニとたたかう
  • Openclipart (Big crab island animation)からSVGデータをダウンロードできます。

形が変わる図形で動画を作成

  • 上のアニメーションは、形が変化する図形を重ねて作られています。はさみと人以外を線にかえると下のようになります。

f:id:dnjiro:20210722140611g:plain

  • はさみは3つの図形で作られています。それが(1秒)(0.5秒)(1秒)(1秒)(1秒)(0秒)の以下の6ページに描かれています。f:id:dnjiro:20210722143125p:plain
  • 9VAeはこの6ページの図形から中間の形を自動計算し動画を作成します。6ページは1ページと同じ絵で最初にもどります。

    f:id:dnjiro:20210722152348p:plain

    f:id:dnjiro:20210722155528p:plain

作り方:多角形で形を入力

  1. 多角形入力ボタンを押して、形を入力します。最初の点をタッチすると入力終了します。

グラデーションをつける

  1. 選択ボタンをおします
  2. 外からドラッグして入力した図形を選びます。
  3. 塗り色1をパレットから選びます。パレットが消えている場合は右下の「もどす」を押します。もう一度押すとパレットが消えます。
  4. 真ん中のボタンがグラデーションの種類です。横向きにしました。
  5. 塗り色2を選べばグラデーションになります
  6. 下の「線の種類」で(なし)にすると線が見えなくなります

続きのページをつくる

  1. ページの右側の「+」ボタンのメニューから「続きのページをつくる」で、1ページの内容が2ページにコピーされます。

形をかえる

  1. 選択ボタンを押します
  2. 外からドラッグして入力した図形を選びます。
  3. 点選択ボタンを押せば、図形の点が表示されます
  4. 点をドラッグして形を変えます

さらに続きを作って変形

  1. ページの右側の「+」のメニューから「続きのページをつくる」で2ページが3ページにコピーされます
  2. 点選択ボタンで、点を表示し、点をドラッグして形を変形します

時間の調整

  1. 2ページの上の時間をタッチし、メニューから「0.1秒短くする」を何回かタッチして、ページの時間を0.5秒にします
  2. プレイボタンで動きを見てみましょう

同じように作成していく

同じようにして5ページの絵を作りました。

  1. 1ページのページ番号をタッチ。メニューから「ページを記憶する」
  2. 最後のページに移動するボタンをおします
  3. ページの右側の「+」をタッチ。メニューから「記憶したページを入れる」。これで1ページと同じ内容が最後のページに入ります。これでループアニメーションができます。

 

アニメGIF / 動画(MP4)出力

  • ファイルメニュー>アニメGIF出力」または「動画出力」で、好きなサイズのアニメGIF または MP4動画 が作成できます。
    Win / RaspberryPi / Linux版 でMP4動画を作るには FFmpeg が必要です
  • スマホの場合、端末内の「9VAe」フォルダの中に出力されます。フォトアプリで、「端末内の写真>9VAe」で見ることができます。
  • アニメGIFは、背景を透明にできます。音がいれられません。
  • MP4動画には音が入れられます。Youtubeに投稿できます。Youtubeに投稿する場合、1秒30コマ、高さ720 または 1080 で出力するとよいでしょう。

 

Komoriさんの孤島シリーズ

  • パソコン版の9VAeきゅうべえには、Komoriさんのほかの作品が収録されています。すべて6枚以下のキーフレームで作られています。ご覧ください。


www.youtube.com

9VAeで作れる動画の例

  • 他の作品も紹介します。以下の動画も9VAeきゅうべえで作られています。
  • 作成したパーツをアニメキャストにして、多数複製しています。複数のアニメキャストをまとめてアニメキャストにして使っています。


www.youtube.com

  • Komoriさんとどらごんさんが協力してつくった作品

蜘蛛の糸【Two-Piece 作品】 (Komoriとどらごんのユニット)


救出Part2 Two-Piece(Komoriとどらごんのユニット)

9VAeで動画素材を自作しよう

  • 9VAeきゅうべえを使えば、SVGイラストからいろんな動画素材を作成できます。SVGの静止画のフリー素材イラストがネット上にたくさんあります。いろんな動画素材を作ってみてください。

 

  • 9VAeは各ソフトにあわせて、いろんなフォーマットでクリップ動画を出力できます。
アプリ クリップ形式 作り方
PowerPoint
LibreOffice
Keynote
アニメGIF 背景を透明にして出力(PowerPointの例
iMovie
PowerDirector
グリーンバック動画 先頭にグリーンバック背景を入れる。(iMovieの例PowerDirectorの例
AviUtl 連番PNG 背景を透明にして出力(AviUtlの例

 

  • 9VAeは下のような特長をもった商用利用可能な無料アプリです。
     
    9VAeきゅうべえ
    他のアプリ
    方式
    図形のすべての点の対応関係をもったベクトル方式
    タイムラインに画像を並べるビットマップ方式
    修正
    形を後から自由に修正できる
    画像を描き直す
    補間
    変形した形はなめらかに変化する
    形の補間はできない
    データ量
    中間がないので小さい
    何枚も画像が必要で重い
    階層化
    9VAeの中に30階層まで
    9VAeがはいる。全て編集できる
    できても1階層
    中身は同時に編集できない

 

 

サムネイル画像の作成

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

 

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

Windows タブレットの Cドライブ、ストレージを増やす方法:ひとコマ解説

整備品のWindowsタブレット が安く入手できるようになりましたが、ストレージが少ないのが問題です。低価格Windows にマイクロSDカードを入れて C ドライブの代わりにする方法を解説します。ストレージ 64GBの2in1タブレット mouse E10 に、Unity をいれることができました。

ほかの解説動画はこちら

 SDカードの中にハードディスクのかわり(仮想ディスク)を作成する

  • マウスコンピュータ mouse E10 や、ドン・キホーテ U1C は、メモリ4GB、ストレージ64GB が2万円程度で入手できる激安 Windows パソコンでした。キーボードをはずせばタブレットにもなり、mouse E10 には筆圧ペンまでついていました(販売終了涙)。
  • ただ64GB だと、 C ドライブに Visual Studio や Unity などの開発環境をいれると、容量不足で OSのアップデートができなくなります。しかし、SDカードには、Visual StudioやUnityなど多くのアプリはインストールできません。
  • 1000円程度で入手できる 32GB のマイクロSDカードを、仮想ディスク(VHD)にすると、Cドライブのかわりに開発環境やプロジェクトをいれることができます。その方法を紹介します。
  • (追記)32GBのSDカードを全部VHDにしてつかっていたところ、ファイルがこわれて、データが全滅したことがありました。アプリは再インストールで復元できるので、64GBのSDカードにして、VHDは半分のサイズにしておき、アプリ以外のリムーバブルにいれられるデータは、残りの領域にいれとくのがおすすめです。

 

仮想ディスク(VHD)の作り方

32 / 64GB 以上のマイクロSDカードをセットして以下の操作をします。

  1. Windowsボタンを右クリック(または長押し)から「ディスク管理(Disk Management)」を実行します。Windowsボタン>設定>「ディスク管理(Disk Management)」を検索してもよいです。
  2. 検索した場合、見つかった項目(ハードディスクパーティションの作成とフォーマットなど)をクリックすると「ディスクの管理(Disk Management)」が開きます。
  3. 下にあるSDカード(左側の表示がリムーバブル)のバーを右ボタンクリック。メニューから「フォーマット」を実行。
  4. ファイルシステムは「NTFS」にします。FAT32だと数GBのファイルしか保存できないので、NTFSにしなければいけません。フォーマットにより中身はすべて消去されます。★★かならずリムーバブル(Removable)を確認★★
  5. OKでフォーマットを実行
  6. 「操作メニュー(Action)>VHDの作成(Create VHD)」を実行。
  7. 「参照ボタン(Browse)」でSDカードの中の仮想ディスクのファイル名を設定。
  8. VHDファイルをSDカードの中に作ります。
  9. 短い半角英数名がおすすめ。好きな名前でよいです
  10. 「保存(Save)」
  11. 最大サイズを設定します。32GBのSDだと、28GB、64だと58GBぐらいのファイルが作れます。
  12. 単位を「GB」に変更
  13. 「OK」ボタン
  14. ファイルの作成には時間がかかります。ファイルができると、SDカードの下に「ディスク2」のバーができます。見えなければウィンドウを縦にのばしてください。最初は「初期化されていない(Not Initialized)」「未割り当て(Unallocated)」となっています。左側の「初期化されていない」を、右ボタンクリックし「ディスクの初期化(Initialize Disk)」を実行。
  15. GPTパーティションでかまいません。「OK」で初期化を実行。
  16. 左側の表示が「オンライン(Online)」にかわります。右側の「未割り当て(Unallocated)」を、右ボタンクリック。「新しいシンプルボリューム(New Simple Volume)」を実行。

 

仮想ドライブを作成し、自動的にマウントするよう設定

上の操作につづいて、つぎの操作を実行します。

  1. 「次へ(Next)」を何回かクリックし「NTFS」フォーマットのボリュームを作成します。
  2. 作成が完了(Finish)すると、ドライブが割り当てられ、保存ができるようになります。この中に、Visual Studio をインストールすることができます。

仮想ディスクVHDファイルのショートカットをスタートアップに入れて自動マウント

  • PCを再起動すると、最初、仮想ディスクVHDは単なるファイルです。
  • 仮想ディスクファイルVHDをダブルクリックすれば、マウントされ、仮想ディスクが使えるようになります。
  • VHDファイルを右ボタンでクリックし「ショートカットの作成(Create shortcut)」でショートカットを作ります。これを、スタートアップフォルダにいれて、起動時に実行するようにします。(Windows11では、右ボタン>その他のオプションを確認>ショートカットの作成)
  • スタートアップフォルダは、Windowsボタンと「R」を同時におし、「ファイル名を指定して実行(Run)」で「shell:startup」で開きます。この中に、VHDのショートカットを入れます。
  • パソコンを再起動して、EドライブができればOKです。

ドライブ名変更の注意

  • パソコン再起動時に、VHDにEドライブが割り当てられるのに少し時間がかかります。その前にUSBメモリなどを差すと、USBメモリがEドライブに割り当てられてしまい、VHDドライブが Fドライブになってしまうことがあります。こうなると、Eドライブにインストールしたプログラムが使えません。VHDにEドライブが割り当てられてからUSB機器をさすようにしましょう。
  • Fドライブに割り当てられたVHDを、Eドライブに戻すには、次の様にします。

  1. Windowsボタン>「ディスク管理」を検索します。
  2. 見つかった項目(ハードディスクパーティションの作成とフォーマットなど)をクリック
  3. ドライブ名を変更したいドライブを右ボタンでクリック。「ドライブ文字とパスの変更」
  4. 変更したいドライブ名を選んで「変更」
  5. もし、リストの中に変更したいドライブ名が表示されない場合、先にUSBメモリのドライブを別の名前に変更しましょう

 

■Unity インストール

  • Unityは、初心者でも3次元ゲームがつくれる開発環境です。mouse e10 にも入れることができます。入れ方はこちら
  • 標準では、Cドライブにはいるため、ツールや プロジェクトの保存先を、仮想ディスクに変更しましょう。

 

■Visual Studio インストール

Unityをはじめ、いろんなアプリ開発につかわれるプログラミング開発環境です。

  1. ダウンロードはこちら  
  2. 古い Visual Studio を使っていた場合は、先に削除しましょう。ツールメニュー>「ツールと機能を取得」>Visual Studio Installer が起動します。「閉じる」>「インストール済み」タブ 「その他>アンインストール」
  3. Visual Studio Installer から、Visual Studio Community をインストールします。
  4. 「インストールの場所」タブで、上の2つの場所はCドライブ以外に変更できます。ただし、SDカードのようなリムーバブルディスクは選べません。上のように仮想ドライブを準備しておく必要があります。
  5. インストール場所を設定後、「ワークロード」タブで、言語やツールを選びます。Windows用アプリを作りたい(C++/WinRT)の場合は、「C++によるデスクトップ開発」、「ユニバーサルWindowsプラットフォーム開発」を選びます。
  6. 不足していたモジュールは、あとから「個別のコンポーネント」タブで追加できます。

 

サンプルの動画編集プログラム(MediaEditing) をビルドして実行

  1. ここ GitHub を開く
  2. 「Code」ボタンの右側の▼をクリック。メニューから「Download ZIP」をクリック。Windows-universal-samples-main(.zip) がダウンロードフォルダに入手できます。
  3. ダウンロードフォルダを開く。Windows-universal-samples-main(.zip) を右ボタンでクリック。メニューから「すべて展開」を実行。「展開」ボタンをおすとダウンロードフォルダの中に「Windows-universal-samples-main」ができます。
  4. 「Windows-universal-samples-main」の中の「Samples」フォルダの中にたくさんのサンプルがはいっています。
  5. この中の「MediaEditing」を開きます。「cpp」の中にC++、「cs」の中にC#プログラムがはいっています。
  6. 「cpp」の中の「MediaEditing.sln」をダブルクリックします。
  7. Visual Studio が起動します。
  8. メニューバーの下の「Debug▼」「ARM▼」「リモートコンピュータ▼」がありますが、「ARM」の右側の▼をクリック。「x86」に変更します。「リモートコンピュータ」が「ローカルコンピュータ」に変わります。
  9. 「ローカルコンピュータ」をクリックすると、ビルド(プログラムから実行系を作る作業)が始まります。成功するとアプリがインストールされます。
  10. 初回、「開発者向け設定」画面が開きます。自作アプリをインストールするには「任意のソースからのアプリのインストール(開発者モード)」をオンにします。
  11. ドン・キホーテノートでも「MediaEditing」サンプルが起動しました。1) Trimming and Saving a clip をクリックすると、「1 Choose Video」「2 Trim Video」「3 Save Result」ボタンが表示されます。「1 Choose」ボタンで動画を選択。「2 Trim」で動画の前、後ろを削除。「3 Save Result」で、結果を保存できます。
  12. このサンプルを手掛かりに、WinRT アプリを作っていく過程はこちら

Visual Studioでよく使うキー

  • Alt +B のあと B    ビルド
  • F5  実行、続きを実行
  • F9  ブレークポイント ON/OFF
  • F10  ステップ実行
  • F11  関数の中にはいる
  • Shift+F11  関数から外に抜ける 

Visual Studio メモ

  • 右側がソリューションエクスプローラで、プロジェクトに含まれるファイルなどが表示
  • ソリューションエクスプローラの親を右ボタンでクリックし、「スタートアッププロジェクトに設定」すると、右向き▲ボタンでこのプロジェクトが実行される。
  • ソリューションエクスプローラの親を右ボタンでクリックし、一番下の「プロパティ」を開くと、コンパイラー、リンカーなどの設定がみえる
  • プロパティの $(ProjectDir); はプロジェクトがあるフォルダ(.vcxproj, .sln)ほかの意味はこちら
  • ビルドすると下に結果が表示される。下の「出力」タブを押すとエラーが見える
  • プロパティの $(GeneratedFilesDir); は、x86, x64, ARM などのCPUフォルダ

 


ひとコマ解説動画の作り方

この記事の動画は、フリーソフト9VAeきゅうべえの「ひとコマ機能」で作成しています。

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


使い方.youtube

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

  • 9VAeきゅうべえで、キャプチャー画面に、矢印や説明を加え、ページに「ひとコマ」設定するだけで作れます。
  • Youtube動画より作成が簡単で、スクロールしなくても見えるのが特長です。
  • Youtube 動画にすることもできます。

 

画面キャプチャ方法

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

キャプチャ画像を転送する方法はこちら

キャプチャ画像を9VAeに読みこむ

f:id:dnjiro:20220119095713g:plain

  1. 画像入力ボタン「山」でキャプチャ画像を読み込む
  2. 画像の中心の「+」をクリック。メニューから「ステージの大きさにする」
  3. 画像の中心の「+」をクリック。メニューから「ページを画像に合わせる」

文字、矢印を入れる

f:id:dnjiro:20220119131719g:plain

  1. 文字入力ボタン「A」で数字を入力
  2. 角の■をドラッグでサイズ変更。
  3. 中心の「+」または枠線のドラッグで移動
  4. 線の種類ボタンをクリック。メニューから「→」で矢印に設定
  5. 折れ線ボタンをクリック
  6. 開始点
  7. 終了点
  8. 選択ボタンで入力終了
  9. 太さ設定ボタン。メニューから「太くする」で太くできます。
  10. 文字入力ボタン「A」で説明文章を入力
  11. 背景の色を設定
  12. 線の種類メニューの「ー」で枠線がつきます
  13. 太さ設定ボタン。メニューから「太くする」で太くできます。

文字の色、縁、影をつける

f:id:dnjiro:20220119140955g:plain

  1. 文字を選ぶ
  2. 文字タブ2をクリック
  3. 文字の色をクリック
  4. 赤に設定
  5. 文字と矢印をドラッグして選ぶ
  6. 図形タブ1をクリック
  7. 線の種類から「縁をつける」
  8. 線の種類から「影をつける」、線の種類から「広く」
  9. 線の色「赤」

ひとコマアニメーションにする

  1. ページ時間をクリック。メニューから「ひとコマ」を設定。これでアニメーションができます。
  2. プレイボタンで再生してみましょう。入力した順番に文字、矢印がでてきます。
  3. これで1ページ完成です。続きを作りたい場合は、ページの右側の「+」をクリックし「続きのページを作る」で、2ページ目が作成できます。

アニメGIF、動画出力

  • ファイルメニュー>アニメGIF出力」または「動画出力」で、好きなサイズのアニメGIF または MP4動画 が作成できます。
    Win / RaspberryPi / Linux版 でMP4動画を作るには FFmpeg が必要です
  • スマホの場合、端末内の「9VAe」フォルダの中に出力されます。フォトアプリで、「端末内の写真>9VAe」で見ることができます。
  • アニメGIFは、背景を透明にできます。音がいれられません。
  • MP4動画には音が入れられます。Youtubeに投稿できます。Youtubeに投稿する場合、1秒30コマ、高さ720 または 1080 で出力するとよいでしょう。

 

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

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

OS

無料動画ソフト

9VAeで作れる素材

Windows

CapCut

AviUtl

MP4

連番PNG または MP4

Mac/iPhone/iPad

CapCut

iMovie

MP4 

MP4

Android

CapCut

PowerDirector

MP4

GIF または MP4

作り方

 

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

 

 

X68000 Z 用 MicroPython SDカードの作り方:ひとコマ解説

X68000 Z 実機で、MicroPythonを使う方法を解説します。X-BASICへの変換はこちら

Cコンパイラ用SDカードの作り方はこちら

X68000 Z 資料

参考にした記事はこちらです。

X68000 Z ツール入手先

 

X68000Z MicroPython用SDカードの作り方


音声で解説した動画

  1. DiskExplorer ダウンロード
  2. Lhaplus ダウンロード
  3. ブランクXDFダウンロード
  4. HumanSys ダウンロード
  5. SDカードの直下に「automount.xdf」という名前でいれておく
  6. MicroPython.XをBINフォルダに入れる

空き容量が少ない場合、「SYS」の中の「PRNDRV2.SYS / PRNDRV3.SYS / FLOAT3.X / FLOAT4.X」も削除してかまいません(出典

 

ヒストリー、カーソルキー設定

コマンド入力にものすごく便利です。


音声による解説

key.his を HISフォルダにいれておくと次に起動したときも使えます。

  1. Human68K コマンドで、KEY を実行
  2. U (更新)
  3. 入力は、[KEY.SYS]、(2回目以降は前回作成した key.his )
  4. 出力は、key.his
  5. 処理を開始。次の4つのキーを変更「F」「2」「5」「Ctrl+W同時押し」「Enter」のように押すと設定できます。
    F25 ^W
    F26 ^S
    F27 ^D
    F28 ^E
  6. Enter 2回で終了。KEY.HIS ができます。
  7. KEY.HIS を、\HIS フォルダにコピー。移動でもよいがオリジナルをのこしておくと安心。
  8. 作成した KEY.HIS をSDカードにいれておき、新しいフロッピーのHISフォルダにコピーできるようにしておくと便利です。

 

エディタEDの使い方

X68K標準エディタです。PDFマニュアル(p.296)

EDの機能 キー操作
終了 ESC+Q
上書き保存 ESC+H
全部保存して終了 ESC+E
ファイルを開く ESC+F
ファイルを閉じる ESC+K
ファイル切り替え ESC+AまたはD
指定行に移動 ESC+数字

 

MicroPython サンプルプログラム(マウス左ボタンで線をひく)

import x68k
x68k.crtmod(16, 1)
g = x68k.GVRam(0)
x=0
y=0
print('Draw line with Mouse. Exit=Move to bottom') while y<500: pos = x68k.iocs(x68k.i.MS_CURGT) #マウス座標取得 xx = (pos & 0xffff0000) >> 16 yy = (pos & 0xffff) btn = x68k.iocs(x68k.i.MS_GETDT) #マウスボタン取得 left = btn & 0xff00 right = btn & 0xff if left !=0: #左ボタンが押されていたら g.line(x,y,xx,yy,xx % 16) #線をひく x = xx y = yy

 

記述
意味
import x68k x68k関数を使えるようにする
x68k.crtmod(16, 1) 768 x 512 x 16色(31kHz) mode
g = x68k.GVRam(0) グラフィック画面 g

while y<500:

yが500以下ならループする、下の同じインデントの行がループ範囲
x68k.iocs(x68k.i.MS_CURGT) マウス座標
x68k.iocs(x68k.i.MS_GETDT) マウスボタン
g.line(x,y,xx,yy,c) 画面gに色cで線をひく
  • micropyt test.py  と入力して実行してみましょう。
  • 左ボタンを押しながら線が描けます。
  • マウスを一番下に移動させると終了します。
  • Pythonの特徴として、ループやIF文の範囲を「:」の下の行のインデント(行の先頭からのスペースの数)で表現するというルールがあります。そのためスペースの数にも注意して入力してください。CやBASICだと、スペースはいくついれても同じですが、Pythonは違います

MicroPython で使える x68k 関数

from x68k import *

 

記述
意味
x68k.iocs(x68k.i.B_CLR_ST, 2) 画面のリセット
x68k.crtmod(16, 1) 768 x 512 x 16色(31kHz)
x68k.crtmod(14, 1) 255 x 255 x 65536色
x68k.crtmod(12, 1) 512 x 512 x 65536色
key=x68k.iocs(x68k.i.B_KEYINP) キーを入力待ちして取得
key=x68k.iocs(x68k.i.B_KEYSNS) キー取得(入力待ちしない)
key=x68k.iocs(x68k.i.B_SFTSNS) シフトキー取得(入力待ちしない)
key=x68k.iocs(x68k.i.B_BITSNS, group) キー取得(入力待ちしない)
x68k.dos(x68k.d.KFLUSH, b'¥x00¥x06¥x00¥xfe') キーバッファクリア
x68k.dos(x68k.d.INPOUT,b'\x00\x07')
ビープ音を鳴らす
x68k.iocs(x68k.i.G_CLR_ON) グラフィック表示する
x68k.iocs(x68k.i.B_LOCATE, x, y) カーソルを(x,y)に移動
xxyy = x68k.iocs(x68k.i.B_LOCATE, -1) カーソル位置を取得
x68k.iocs(x68k.i.B_COLOR, d1=pal) 文字の色 pal: 0=black, 1=cyan, 2=yellow, 3=white
x68k.iocs(x68k.i.OS_CURON) カーソル表示
x68k.iocs(x68k.i.OS_CUROF) カーソルを消す
x68k.iocs(x68k.i.MS_INIT) マウス初期化
x68k.iocs(x68k.i.MS_CURON) マウスカーソルON
x68k.iocs(x68k.i.MS_CUROF) マウスカーソルOFF
mcr=x68k.iocs(x68k.i.MS_STAT) マウスカーソルの状態
x68k.iocs(x68k.i.MS_LIMIT,
(x1 << 16) | y1, (x2 << 16) | y2)
マウスの範囲設定
x68k.iocs(x68k.i.MS_CURST,
(x << 16) | y)
マウス位置指定
pos = x68k.iocs(x68k.i.MS_CURGT) マウス位置取得
(x=(pos >> 16) & 0xffff, y=pos & 0xffff)
stat = x68k.iocs(x68k.i.MS_GETDT) マウス位置、ボタン取得 (x, y, btn_l, btn_r)
x68k.iocs(x68k.i.SKEY_MOD,-1) ソフトキーボード ON
x68k.iocs(x68k.i.SKEY_MOD,0) ソフトキーボード OFF
x68k.iocs(x68k.i.TPALET,pal,-2) テキストパレット初期化
x68k.iocs(x68k.i.TPALET,pal,color) テキストパレット設定(colorは16bit:g5r5b5+0,  pal=0-3, 7,8(マウスポインタ))
x68k.iocs(x68k.i.TPALET,pal,-1) テキストパレット取得
x68k.iocs(x68k.i.GPALET,pal,-2) グラフィックパレット初期化
x68k.iocs(x68k.i.GPALET,pal,color) グラフィックパレット設定(colorは16bit:g5r5b5+0, pal=0-15)
x68k.iocs(x68k.i.GPALET,pal,-1) グラフィックパレット取得
x68k.iocs(x68k.i.HSVTORGB,(h<<16)|(s<<8)|v) HSVからRGB変換(h:0-191 0=R 64=G 128=B 32=Y 96=C 160=M  s,v:0-31)

描画関数

記述
意味
g=GVRam(0) グラフィック画面
tx=TVRam(0) テキスト画面
g.line(x1,y1,x2,y2,pal)
g.line(x1,y1,x2,y2,pal,dot)
x1,y1-x2,y2に線をひく。palは色
点線(dot=-1は実線,0は透明)
g.box(x1,y1,x2,y2,pal)
g.box(x1,y1,x2,y2,pal,pal,dot)
x1,y1-x2,y2の四角形を描く。palは色
点線の四角(dot=-1は実線,0は透明)
g.fill(x1,y1,x2,y2,pal) x1,y1-x2,y2の四角形を塗りつぶす。palは色
g.circle(x,y,r,pal)
g.circle(x,y,r,from,to)
中心x,y,半径rの円を描く。palは色
円弧(from,toは角度0-360)

MicroPython 参考資料

 

X68000 Z で Python を勉強してみた

  • 京都大学の Python の教科書(無料) が、microPythonでできるのか試してみました
  • 教科書では、Anaconda で Pythonをインストール。IDLEで入力、実行していますが、microPythonでも ED.x を使って7章まで同じことができました。

Python シェル

micropyt

で、Pythonシェルになります。(>>>と表示)

1+2
a = 1 + 2
a

と入力すると、答え3が表示されます。

終了は Ctrl+D

スクリプトの作成と実行 / Python で使えるデータ型

ED.x で入力。

ed p2-1.py
a = 1
b = 1/2
c = “ABC”
print(a)
print(b)
print(c)
print(type(a))
print(type(b))
print(type(c))

保存終了は ESC E

実行は

micropyt p2-1.py

複数の変数への代入

a = 1
b = 2
c, d = a*2, b*c          #c,d に同時に代入
print(c, d)

b*cはエラーになりました。b*aならOK。

リスト

a = [5, 1, 3, 4]
a
a[0]         #先頭は0
a = [1]*4    #[1,1,1,1]
a = list()   #空のリスト、a=[]でもよい
a = list(range(5))  #[0,1,2,3,4]
a = list('abcde')   #['a','b','c','d','e']
t = "a textbook of Python"
a = t.split()
a = "a textbook of Python".split()

リストの要素へのアクセス

  • [開始:終了]で指定します。先頭は0、終了は含まれません
  • 負の添字は後ろから数えます
a = [5, 1, 3, 4]
a[0]      #先頭の5
a[-1]     #最後の4
a[0:2]    #[5,1]
a[1:3]    #[1,3]

リストへの追加

a = [5, 1, 3, 4]
a.append(2)   #aの最後に2を追加
a
b = [2, 6]
a.extend(b) #aの後ろにbを追加
a.append(b) #aの後ろにb(リスト)を追加

リストの代入と複製

  • リストの代入には注意が必要です
a = [ 1, 2, 3]
b = a    #bはaと同じ
a[1]=0   #a を修正
b        #b も修正されてる
b = a.copy()   #浅いコピー(完全なコピーではない)
a[1]=10   #a を修正
b        #b は aをコピーしたときの値
id(a)
id(b)    #id(a) と id(b)が同じとき、中味は同じ

辞書

  • リストの中身を文字列で指定する仕組み
age = {"yamada":18, "tanaka":19}
age
age["yamada"]
age["sato"]=20      #"sato"が追加される
age
"okada" in age      #"okada"がはいっているか?

繰り返し(for)

xの平方根を求めるプログラム
x = 2
rnew = x
for i in range(10):
    r1 = rnew
    r2 = x/r1
    rnew = (r1 + r2)/2
print(r1,rnew,r2)
for いろんな書き方
a = [5, 1, 3, 4]
for i in range(len(a)):
    print(a[i])

for d in a:
    print(a)

for i, d in enumerate(a):
    print(i, d)

a = [i*i for i in range(5)]
print(a)

if文

  • 複数の条件は、and  or not などと書きます
a = 1
b = 0
if (a == 1) and (b == 0):    #()はなくてもOK
  print("a1 b0")
elif a==1:
print("a1")
else: print("NO")

端末からの入力

  • input で入力。数字をいれても文字列になります
a = input("*** ")
a
x = float(a)
x
x = int(a)
x

s = str(1/3)  #数値を文字列にする
s
s = hex(a)    #16進数
s ='{:04x}'.format(a)  #16進数4桁
s ='{:02x}{:02x}'.format(a,a)  #16進数2桁を2つ並べる

try  except (エラー処理)

  • 数字以外が入力されたときにエラー終了しないようにする
while True: 
    x = input("*** ")
    try:
        x = float(x)
    except:
        print("Not number")
        continue
    print(x)
    break
  • while True は無限ループです。Tは大文字
  • エラーが発生すると、except から実行されます。except: は必ず必要で、何もしないときは pass と書きます
  • continue は、while ループの先頭にもどります
  • break で、whileループを抜けます

数値計算

import math
a = math.pi   #円周率
a = math.sqrt(2)  #ルート

文字列の結合 +

s = "abc" + "def"
s = "abc"+str(1.2)    #数値は文字にしてから結合
s = "abc"*2
s = hex(a)    #16進数
s ='{:04x}'.format(a)  #16進数4桁 {}に数字がはいる :#04x とすると 0xがつく
s ='{:02x}{:02x}'.format(a,a)  #16進数2桁を2つ並べる 
a = len(a)            #文字の長さ、半角も全角も1文字
a.isnumeric(a) #a が数字なら True

フォーマットの使い方(note.nkmk.me)

文字の検索 find、部分文字列

a = "abcde"
a.find("cd")    #結果は 2
a.find("x")     #結果は-1

a[0] #先頭の文字1文字(0が先頭)
a[2:4] #0から数えて文字2から2文字(4は含まれない)
a[2:] #0から数えて文字2から最後まで
a[-1] #最後の1文字

文字の比較 ==   !=

a = "abc"
print(a=="abc") #結果は True
print(a!=a) #結果は False

日付・時間 datetime

import datetime
dt = datetime.datetime.now() #年月日 時分秒(現在時刻)
dt = datetime.date.today() #年月日(今日)
str = '{:04d}-{:02d}{:02d}'.format(dt.year,dt.month,dt.day) 

日時の使い方(note.nkmk.me)

関数 def

def myabs(x):
    if x<0:
        return -x
    return x
while True:
    a = float(input("> "))
    print(a, myabs(a))
関数を引数にした関数
def f1():
    print("f1")
def f2():
    print("f2") 
def F(y):
    y()
F(f2)
F(f1)
グローバル変数

関数の外側で定義された変数をつかいたいとき「global」と宣言します

a=1
def f():
    global a
    print a
デフォルト引数
def f(a,b=2,c=3):
    return a + b + c
f(1,1,1)   #答えは3
f(1)       #答えは6
f(1,c=2)   #答えは5

ファイル入出力

import os
print(os.getcwd())

f = open('test.txt','w')
f.write('111\n 222\n 333\n')
f.close()
f = open('test.txt','r')
s = f.read()
f.close()
print(s)

リネーム、削除、存在チェック、フォルダ作成など

import os
os.rename('変更前ファイル名','変更後ファイル名')
os.remove('ファイル名') 
os.path.exists('ファイル・フォルダ名') #存在チェック
os.path.isdir('フォルダ') #フォルダかどうか
os.path.isfile('ファイル') #ファイルかどうか
os.path.getsize('ファイル') #ファイルサイズ
os.listdir('フォルダ名') #フォルダの中のファイル
os.mkdir('フォルダ名') #フォルダ作成
if os.access('フォルダ名', os.R_OK|os.W_OK) : #読み書きできるか
os.chmod('フォルダ名', 0o777) #アクセス権限の変更(読み書き実行)
autoexec.batを読んでみる
import os
f = open('autoexec.bat','r')
for line in f:
  printf(line)
f.close()

close不要の書き方

import os
with open('autoexec.bat','r') as f:
    for line in f:
        printf(line)

プログラムの終了

import sys
sys.exit()

 

X68000との出会い

  • X68000は、はじめてアニメーションをつくったパソコンです。lanma.x というベクトルアニメエディタを自作し、ASCII や 電脳倶楽部で公開しました。下は、lanmaで作ったアニメに、9VAeきゅうべえでイフェクトをつけた作品。登場人物は実在し、身内で公開したときは、めちゃうけました。

  • 当時、最高のグラフィックス性能があり、簡単に音を鳴らすことができ、gcc コンパイラで高速な処理ができました。
  • それが、X68000Z になって、よみがえるというので、当時を思い出してアプリ開発してみようと思いました。
  • X68000 Z 実機のみでプログラム開発することを目指します。

 

内容:


解説動画の作り方

この記事のひとコマ解説GIFは、フリーソフト9VAeきゅうべえの「ひとコマ機能」で作成しています。

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

 

 

  • 9VAeきゅうべえで、キャプチャー画面に、矢印や説明を加え、ページに「ひとコマ」設定するだけで作れます。
  • FFmpeg を使って Youtube 動画にすることもできます。

 

画面キャプチャ方法

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

アニメGIF、動画出力

  • ファイルメニュー>アニメGIF出力」または「動画出力」で、好きなサイズのアニメGIF または MP4動画 が作成できます。
    Win / RaspberryPi / Linux版 でMP4動画を作るには FFmpeg が必要Youtube解説
  • スマホの場合、端末内の「9VAe」フォルダの中に出力されます。フォトアプリで、「端末内の写真>9VAe」で見ることができます。
  • アニメGIFは、背景を透明にできます。音がいれられません。
  • MP4動画には音が入れられます。Youtubeに投稿できます。Youtubeに投稿する場合、1秒30コマ、高さ720 または 1080 で出力するとよいでしょう。

 

 

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

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

OS

フリーソフト

9VAeで作成する素材動画

Windows

AviUtl

連番PNG または MP4

Mac/iPhone/iPad

iMovie

MP4 または QuickTime(古いMac)

Android

PowerDirector

GIF または MP4

作り方

 

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

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

 

 

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

 

 

ランキング動画、スライド動画が作れる無料アプリ:9VAeきゅうべえ

ランキング動画を作る方法を説明します。作業時間は20分くらいです。Android版 9VAeきゅうべえパソコン版iPhone/iPad版で作れます。動画素材サムネイルも作れます。

f:id:dnjiro:20210107190121g:plain

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

 

内容:20分程度

 

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

f:id:dnjiro:20220214105744g:plain

 

1.ランキングで使う画像を9VAeフォルダにいれる(Android版のみ)

  1. スマホ版9VAeに画像や音をいれるには、あらかじめスマホ内部の「9VAe」(Androidの場合は「ダウンロード」フォルダも可)にファイルをいれておく必要があります。(iPhone版はカメラロールから入力できます)
  2. 画像や音を9VAeフォルダにいれるには、「Simple File Manager」 や「File Manager - Innorriors(Amazon Fire)」 のようなファイルマネージャを使うのが簡単です。以下は、Simple File Manager で、内部/9VAe にランキング用の画像を5枚入れた例です。

    f:id:dnjiro:20201130090810p:plain



  3. Abdroid版への音、画像入力について、こちらもご覧ください。

f:id:dnjiro:20201016170757g:plainメモ:スマホ版9VAeでは、9VAeフォルダに絵や音を入れておけば入力できます。Android版はダウンロードフォルダからでも入力できます。

 

 

2. 基本画面を作る

以下、パソコン版、スマホ版とも共通です。図のABCDの順番に操作していきます。

 

(1)文字、四角形、画像を入力

順位、四角形、名前、画像の順番に入力します。一般的なグラフィックソフトと同様の操作なので簡単にできるでしょう。

  1. 9VAeを起動。(Android版の場合、横にして画面をタッチすれば横画面になります。)
  2. 「文字入力ボタン」(下図A)をタッチ。「5位」と入力。
  3. 角のハンドル(下図B)のドラッグでサイズ変更できます。
  4. 中心の「+」(下図C)のドラッグで位置変更ができます。

    f:id:dnjiro:20210505004637g:plain

  5. 「塗のある四角形入力ボタン」(上図D)をタッチ。四角形(上図E)を描きます。塗色は白にしましょう。選択ボタンをタッチしてから塗色ボタン(上図F)で色が変更できます。
  6. 間違えたときは「元に戻すボタン」で元に戻せます。
  7. 文字入力ボタン(上図G)をタッチし、四角形の上に名前の文字を入れます。
  8. 「写真入力ボタン」(上図H)をタッチ。ランキング5位の画像を入力。
  9. 文字と同じように、選択枠の角のハンドルでサイズを縮小、選択枠中心のハンドルをドラッグすれば移動できます。

f:id:dnjiro:20201016170757g:plainメモ:選択枠の角のドラッグでサイズ変更。中心の+または枠線のドラッグで移動。選択ボタンで選択して色変更できることも覚えておきましょう。

 

(2)位置合わせ

  1. 選択ボタン(下図I)をタッチ。画面を左上から右下にドラッグ(下図J)して、順位、四角形、名前、画像全部を選びます。
  2. メニューバー「配置メニュー>縦軸を合わせる」(下図K)(パソコン版の場合は「調整>配置>縦軸を合わせる」)。これで入力した文字、図形、画像が整列します。

    f:id:dnjiro:20210504132044g:plain

f:id:dnjiro:20201016170757g:plainメモ:入力したあと、配置メニューで正確に位置合わせができます。

 

(3)文字にシンボルをつける、文字の色を変える

  1. 文字「5位」をタッチして選択(上図M)。
  2. 右側のタブ3(上図N)をタッチ。スタンプから六角形(上図O)をタッチ。文字の下に六角形が配置されます。色はタブ1(上図P)をタッチし塗色のカラーパレット(上図Q)から好きな色に設定しましょう。ここでは青色にしました。
  3. 文字の色は文字をタッチ(上図M)して選んでから、タブ2(上図R)をタッチ。文字色ボタン(上図S)で変えられます。ここでは白に変更しました。
  4. これがランキング動画の基本配置になります。シンボルの形、文字の色、画像の配置を変えるとオリジナルのランキング動画が作れます。 

f:id:dnjiro:20201016170757g:plainメモ:タブ1(図形タブ)で図形の塗色、線の色が変更できます。タブ2(文字タブ)で文字の色が変えられます。タブ3で図形シンボルが入れられます。

 

3.前のページを作成し、文字が出てくる動きをつける

(1)前のページを作成、文字を登録

  1.  文字に動きをつけましょう。ページの左側の「<」(下図T)をタッチ。メニューから「前につづいたページを作る」。これでページの内容がコピーされます。
  2. 5位とシンボルをいっしょに選択(下図U)。右側の登録パレットの「+」(下図V)をタッチ。5位とシンボルがパレットに登録されます(下図W)。

    f:id:dnjiro:20210504135941g:plain

f:id:dnjiro:20201016170757g:plainメモ:登録パレットに登録する方法を覚えておきましょう。登録した図形を選択したり、登録した図形を選択できないように設定したり、他のソフトの「レイヤ」に似た機能です。動きグラフもここで付けます。

(2)文字を下に隠す、文字を透明にする

  1. シフトボタン(上図X)をタッチ。選択枠中心の「+」(上図Y)を下にドラッグ。下図のように四角形の下に文字を隠します。
  2. 現在のAndroid版では、文字が最前面になるという制限があります。そのため文字を図形で隠すことができないので、文字の色を透明にします。タブ2(上図Z)にある文字の色ボタン(上図a)をタッチ。カラーパレットの透明度の一番左側(上図b)をタッチし文字を透明にします。

f:id:dnjiro:20201016170757g:plainメモ:シフトボタンを押した状態で図形を移動させると、縦か横にしか移動しません。カラーパレットの上にあるパレットが透明度で、一番左側が透明、一番右側が不透明です。

 

4.文字の動きをグラフで調整

  1. 登録パレット(下図c)をタッチ。メニュ=から「ゆっくり動き出すグラフ」をタッチ。下図のようなグラフが表示されます。
  2. グラフの右側の線の上をタッチして△の点を追加。上にドラッグして下図のような形にします(下図d)。
  3. 図形タブ(下図e)をタッチ。右上の「曲線ボタン」(下図f)をタッチ。追加した点が△(角)から□(曲線)にかわります。
  4. プレイボタン(下図g)をタッチして動きをみてみましょう。

    f:id:dnjiro:20210504143608g:plain

  5. 最初に間をもたせるため、ページの左側の「<」ボタンをタッチ。「前につづいたページを作る」で同じページを追加しましょう。プレイボタンをタッチすると、1秒してから文字が出てくるようになります。
  6. ランクの文字が出たあと、そのまま表示を続けたいので、3ページをタッチ(上図i)して3ページに移動してから、ページの左上(上図j)をタッチ。メニューから「往復」をタッチし、往復命令をいれます。
  7. プレイボタンを押すとランキング「5位」が出た状態を続けます。停止するにはプレイボタンの右側の停止ボタン、スマホの場合はタイトルバーをタッチしてください。

f:id:dnjiro:20201016170757g:plainメモ:登録パレットに動きグラフを追加すれば、グラフの形で動きます。最後のページに往復命令をいれるとそこで再生を続けます。

 

これでランキング動画の基本パーツができました。これをコピーしてランキング動画を作っていきます。

f:id:dnjiro:20201130173721g:plain

 

 

5.基本画面をアニメキャストにする(パーツにする)

(1)全部のページを記憶ツールに入れる

  1. 1ページのページ番号(下図l)をタッチ。メニューから「ページの指定ここから」をタッチ。
  2. 3ページのページ番号(下図m)をタッチ。メニューから「ページの指定ここまで」をタッチ。
  3. 3ページのページ番号(下図m)をもう一度タッチ。メニューから「まとめて切り取る」をタッチ。これで全部のページが記憶ツール(下図n)に入ります。

    f:id:dnjiro:20210504145528g:plain

f:id:dnjiro:20201016170757g:plainメモ:ページ番号のメニューで複数ページの選択ができます。選択したページが全部選ばれたことになり、全部のサイズをいっしょに変更したり、位置を変えたりできます。ここでは全部のページを切り取って、記憶ツールに入れました。  

 

(2)アニメキャストにして取り出す

  1. 記憶ツールの下の「q」ボタン(上図o)をタッチ。
  2. アニメキャストの名前をいれます。ここでは5位なので「005」としてOKボタンを押しましょう。(好きな名前をつけてかまいません)
  3. 上図のように3ページのアニメーションが1つの図形になります。

f:id:dnjiro:20201016170757g:plainメモ:記憶ツールにいれたものは、なんでもアニメキャストというパーツにできます。9VAeの強力な機能です。  

 

6.前のページを作成し、最初のランクが出てくるところを作る

動きの作り方は上に述べた方法と同じです。

  1. ページの左側の「<」(下図p)をタッチ。メニューから「前につづいたページを作る」をタッチ

    f:id:dnjiro:20210504154340g:plain

  2. アニメキャストをタッチして選択。
  3. シフトボタン(上図q)をタッチ。選択枠の中心「+」を左側にドラッグ(上図r)して移動。シフトが押されていると、水平に移動します。
  4. 登録パレットへの追加ボタン(上図s)をタッチ。
  5. 登録されたボタン(上図t)をタッチ。メニューから「ゆっくり動きだすグラフ」をタッチ。上図のようなグラフが追加されます。
  6. グラフの点(上図u)を右下に少し移動させます。
f:id:dnjiro:20201016170757g:plainメモ:前のページのアニメキャストを移動させると赤い矢印ができます。この矢印にそってランキング画像がでてきます。 

f:id:dnjiro:20210129071343g:plain

7. 2ページのアニメキャストを同じ場所に複製する

  1. 2ページ(下図v)をタッチして2ページに移動。

    f:id:dnjiro:20210504162800g:plain

  2. アニメキャスト(上図w)をタッチして選択。
  3. シフトボタン(上図x)をタッチしてから、選択枠中心「+」をタッチ。メニューから「複製する」をタッチ。シフトがおされていると同じ位置に複製されます。
  4. 登録ボタン(上図y)をタッチ。登録パレットに登録しておきます。
  5. 複製して登録したアニメキャストの選択枠の中心「+」(上図z)をタッチ。メニューから「別のアニメにして修正」をタッチ。
  6. 新しいアニメキャストの名前の入力になります。
  7. 4位のランクを作成するので、名前を「004」としてOKボタン。
  8. これで4位のアニメキャストが開きます。

f:id:dnjiro:20201016170757g:plainメモ:シフトを押して複製すると同じ位置に複製されます。「別のアニメにして修正」するのは重要です。これをしないと2つのアニメキャストは同じ中身を参照するため、どちらも4位になってしまいます。「別のアニメにして修正」すると5位と4位を作ることができます。

 

8. 4位のアニメキャストの文字、画像を変更

  1. 3ページ(下図A)をタッチして3ページに移動。

    f:id:dnjiro:20210504173200g:plain

  2. 文字「5位」(上図B)をタッチして選択。
  3. 選択枠中心の「+」(上図B)をタッチ。メニューから「文字の内容変更」を実行。
  4. 「他のページの内容も修正しますか」に対して「はい」。
  5. 文字を「4位」に変更します。
  6. 同様に下の文字を「9VAeきゅうべえ」に変更します。(上図C)
  7. 画像(上図D)をタッチして選択。
  8. 選択枠中心の「+」をタッチ。メニューから「絵・写真の変更」を実行。
  9. 「他のページの内容も修正しますか」に対して「はい」。
  10. 画像を4位の画像に変更(上図D)
  11. 画面上の「004」の左側のファイル名(new)(上図E)をタッチ。メニューから「このアニメにもどる」をタッチ。親のアニメに戻ります。

f:id:dnjiro:20201016170757g:plainメモ:画像を変更すると、縦横の画像サイズが元の画像になります。縦横比率を同じにしておくとよいでしょう。

 

9.続きのページを作って4位のアニメを右に移動

  1. ページの右側の「+」(下図F)をタッチ。メニューから「続きのページを作る」。これで下図のように3ページができます。

    f:id:dnjiro:20210504180520g:plain

  2. 登録した4位のパレット(上図G)をタッチ。メニューから「選択する」を実行。
  3. シフトボタン(上図H)をタッチ。
  4. 選択枠の中心「+」(上図I)を右側にドラッグ。4位の画像を5位の右側に配置します。
  5. 2ページ(上図J)をタッチして2ページに移動。4位のアニメキャストが選択されています。
  6. 重なりを下げるボタン(上図K)をタッチ。4位のアニメキャストを5位の下に隠します。
  7. 登録パレット(上図L)をタッチ。メニューから「ゆっくり動き出すグラフ」をタッチ
  8. グラフの点(上図M)をドラッグして右下に移動させます。プレイボタンで動きを見てみましょう。

f:id:dnjiro:20201016170757g:plainメモ:登録しておけば、重なった図形でも簡単に選択できます。シフトボタンを押した状態で移動させると、縦横に移動できます。

f:id:dnjiro:20210129072027g:plain

 

 

10. 4位、3位、2位を複製し、3位、2位、1位を作る

上と同じ方法を繰り返して3位、2位まで作成します。(1)同じ位置に複製(2)登録パレットに登録(3)別のアニメにして修正(4)中身を次のランクに変更(5)元のアニメに戻る(6)続きのページを作る(7)シフトを押して右側に移動。これを繰り返すと下図のようになります。右側にはみ出したら全体を左側に移動しましょう。

f:id:dnjiro:20210504215551g:plain

  1. 左上からドラッグ(下図N)して4つのランクを全部選択。
  2. シフトボタン(下図O)をタッチ。
  3. 選択枠中心の「+」を左側にドラッグ(下図P)

    f:id:dnjiro:20210504222435g:plain

  4. 4ページ(上図Q)をタッチして前のページに移動。
  5. 登録ボタン(上図R)をタッチし、メニューから「追加登録する」。これで全部が登録されます。
  6. 登録ボタンをもう一度タッチ(上図S)し、メニューから「ゆっくり動き出すグラフ」をタッチ。
  7. 動きグラフの点(上図T)を右下に移動。
  8. 同じように最後のページの2位を複製して1位のページを追加しましょう(下図)
  9. 最後のページの時間(下図U)をタッチ。メニューから「1秒長くする」をタッチして2秒にします。
  10. プレイボタンで動きを見てみましょう。

    f:id:dnjiro:20210505001746g:plain

     

11. 背景に色をつける

  1. 背景に色を付けるには、先頭ページにグリーン背景をいれるのが簡単です。先頭ページ「<<」ボタン(上図V)をタッチして先頭ページに移動
  2. ページの左側の「<」ボタン(上図W)をタッチ。メニューから「グリーンの背景を入れる」をタッチ。下図のようになります。
  3. グリーンの四角をタッチして、塗色ボタンをタッチすれば、好きな色に変更できます。
  4. プレイボタンで動きをみてみましょう。ここでコマ落ちしても、アニメGIF出力すれば、なめらかに動きます。

f:id:dnjiro:20201016170757g:plainメモ:背景ページは、その後に続くすべてのページの背景に表示されます。

 

f:id:dnjiro:20210505002346g:plain

アンドロイド版の文字が最前面に出る制限

  • 現在のアンドロイド版・CromeBook版9VAeは文字が最前面に表示されるという制限があり、図形の下に隠れた文字が見えてしまいます。
  • これを防ぐためには、(1)隠れた文字を透明にする。(2)文字の下に文字が隠れている場合、上の文字を選んで塗り色をつける。
  • 文字の背後に塗色をつけると、文字の背後に文字枠がつきます。文字枠は背後の文字を隠すことができます。短い文字の前後に空白をつければ文字枠を広げることができ、それで下の文字を隠すことができます。
  • パソコン版、iPhone/iPad版ではこのような制限はありません。

 

12. アニメGIF / 動画(MP4)出力

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

     

ezgif サイトで、アニメGIFをMP4動画に変換

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

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

 

f:id:dnjiro:20201016170757g:plainメモ:9VAeは、MP4動画が出力できます。ezgif.com でアニメGIFを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

 

 

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

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

 

 

 

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