アニメーション
翻訳
エディタ
9VAe
きゅうべえ

無料アニメソフト9VAeきゅうべえの裏技集

9VAeきゅうべえ とは

9VAeきゅうべえの裏技

  • 9VAeきゅうべえは、小学生でも簡単にアニメを作れる目的で開発されました。そのため、見た目はできるだけ簡単なユーザーインタフェースにしています。
  • しかし、実際にアニメーションを作成すると、細かい制御が必要な場面がでてきます。そのような要望に応えるために、9VAeきゅうべえでは、Ctrlキー(MacではCommandキー)を押しながらボタンを押すといった裏技を使って、高度な機能をあちこち埋め込んでいます。

  • ここでは、そういった裏技を紹介します。実例で説明していますので、一度お試しください。

  • なお、英語の訳語の解説も兼ねているため、図は英語表示を使っています。ヘルプメニュー(Macの場合、9VAe)の中に英語と日本語の切り替えがあります。

差替えリスト("Replacement List")

Ver.0.6.1 から導入された機能で、アニメーションの中の文字を外部から差し替える機能です。使い方を説明します。

rep01b.png

  1. 文字入力ボタン A をクリックし、「#test」と入力。※差し替えする文字は必ず「#」から始まる必要があります。
  2. 選択枠の角 B をドラッグして拡大
  3. ツール(Input)メニュー C から 「繰り返しボタン」をクリック
  4. ファイルメニュー D から「名前を付けて保存」をクリック。デスクトップなど、わかりやすい場所に保存します。
  5. アニメを保存した場所に以下の文字をいれたテキストファイル「test.txt」を作成します。Windowsなら、メモ帳。Macならテキストエディットなどを使ってください。
test.txt
"#test"="1111";
  1. ツールメニュー C をクリックし、「差替えリスト」をクリック。先ほど作成した「test.txt」を入力します。
  2. プレイボタン E をクリック
  3. 正しく動作すれば、「#test」が「1111」と表示されるはずです。
  4. 「繰り返し(Loop)」ボタンが入っているため、アニメーションは止まりません。この状態で、test.txt を以下のように変更して、上書き保存してください。文字が「22」に変更されるでしょう。
test.txt
"#test"="22";
  • さらに test.txt を以下のように変更すれば、文字列が3行に変更されるでしょう。
test.txt
"#test"="333\n4444\n55555";
  1. ストップボタン F をクリックしてアニメを止めます。
  2. ページの追加ボタン G をクリックし、「続きのページをつくる」をクリック >2ページに文字がコピーされます。
  3. 文字を選択し、選択枠の角 B をドラッグして文字を拡大します。
  4. プレイボタン E をクリックすれば、以下のような文字アニメーションが見えるはずです。

rep000.gif

多国語対応

  1. もし文字を多国語対応したい場合, 「#差替えリスト test.txt」 をクリックして選択します。
  2. 選択枠の中心「+」をクリックし、「言語による切り替え」をクリックします.
  3. 「#差替えリスト test.txt」が「##差替えリスト test_XX.txt」に変わります .
  • ここで、.txt の前に追加された _XXISO Language Codeの先頭の2文字です。もし "test.txt"と同じフォルダに、"test_fr.txt" や "test_ja.txt" を用意しておけば、日本語の場合には "test_ja.txt" が、フランス語の場合には "test_fr.txt" が使われます。対応する言語が存在しない場合は、"test.txt" が使われます。

1文字("One Character")全文字("Show All Characters")

one01.png

  1. 文字入力ボタン A をクリック
  2. 「12345 ABCD XYZ」と入力
  3. 選択枠の角 B をドラッグして拡大
  4. ページの追加ボタン C をクリックし、「続きのページをつくる」をクリック >2ページに文字がコピーされます。

one02.png

  1. 1ページ D をクリックして1ページに移動
  2. ページの時間 E をクリックし、「1秒長くする」をクリックし、1ページの時間を4秒にします。
  3. 文字 F をクリックして選択
  4. 選択枠の中心 G をクリックし、メニューから「1文字」をクリック
  5. プレイボタン H をクリック

これで、文字が順番にでてくるアニメーションが再生されます。ただし、文字が1文字ずつ表示されるのは、いまのところ、Windowsだけで、Macintosh, Linux の場合は、1行ずつしか表示されません。
oneCharwin200.gifWindows

oneChar200mac.gifMac

oneChar200pi.gifLinux

基準枠("Base Frame")とは何?

trans05b.png

  1. 3番目のパレットタブ A をクリック > スタンプパレットが表示されます。
  2. 「動くスタンプ」 B をクリック > 「Rotate(まわる)」をクリック >アニメキャストが入ります。
  3. アニメキャストの中心 C をクリック > 「Edit AnimeCast(アニメを修正)」D をクリック >アニメキャストの中が開きます。

trans06.png

  • 灰色の枠 F が、"Base Frame(基準枠)"です。基準枠はアニメキャストの先頭ページに必ず1つ存在し、アニメキャストのサイズ、位置の基準になります。
  • 基準枠の位置やサイズを変更すれば、全アニメキャストが影響を受けるため、普通は選択できないようになっています。
  • しかし、以下の手順で選択できます。基準枠のサイズを変更して、その影響を確かめてみてください。
  1. メニューバー > 「Edit(編集)」G >「Select(選択)」>「Base Frame(基準枠)」をクリック > 基準枠が選択されます。
  2. 基準枠のサイズを半分にしてみてください。
  3. 太字の「(new」をクリック>「Return(このアニメにもどる)」をクリック
  4. アニメキャストの大きさが倍の大きさになっているでしょう。
  • アニメキャストは基準枠 F がアニメキャストの枠(ひとつ前の図 E)になるように変換されます。

点の移動 (外に移動させると戻る) "Click to fix the shape.(Move it outside to cancel.)"

マウスの移動によって、図形の位置を決めるときに下のメッセージエリアに表示されます。

  1. 適当な図形を描いて選択してください。
  2. 選択枠の枠線をクリック、または、選択枠上のハンドル■をクリックし、「拡大」「回転」などをクリック
  3. マウスをクリックすると移動(変形)が終了します。
  4. マウスを画面の外に移動させると、元の位置に戻ります。

多くのソフトでは図形の移動をドラッグで行いますが、9VAeきゅうべえは、ドラッグだけでなく、クリックしたあとマウスの移動で、図形の移動、変形が行えます。これは、細かい調整を行うための配慮ですが、画面の外に移動させて元の位置に戻ることによって、何が選択されているか確認したり、離れた図形との重なり順序を確かめたりすることができます。

複製して修正する。"Copy anime and Edit inside"

trans07.png

  1. 3番目のパレットタブ A をクリック > スタンプパレットが表示されます。
  2. 「動くスタンプ」 B をクリック > 「Rotate(まわる)」をクリック >アニメキャストが入ります。
  3. アニメキャストの中心 C をクリック > 「Copy Anime and Edit inside(別のアニメにして修正)」D をクリック > 新しいアニメキャストの名前を入力>複製されたアニメキャストが開きます。

これはアニメキャストの中身を修正するときに重要な機能です。アニメキャストがあちこちで使われている場合、中身を修正すると全部の表示が変わります。これは大きなメリットですが、逆に一部のアニメキャストだけ修正したいこともあります。その場合、アニメキャストの中身を完全に複製し、それに差し替えることで、中味を修正しても他に影響が出ないようにする機能です。アニメキャストの中に、さらに別のアニメキャストが含まれていることもあり、この機能がなければ完全に複製することは容易ではありません。

フロー "Flow "

SVG イラストを入力するときに、flowRoot が処理できなかったことを示すエラーメッセージです。

9VAアニメを画面に追加 (+Ctrlで 9VAアニメの中を修正) "Input 9VA Anime (+Ctrl Edit 9VA Anime)"
9VAアニメを画面に追加 (他のアニメから追加する)"Input 9VA Anime (from the other animations)"

この2つは、アニメキャストを入力する「9VA」ボタンのメニューにあります。

trans04.png

  1. 3番目のパレットタブ A をクリック > スタンプパレットが表示されます。
  2. 「動くスタンプ」 B をクリック > 「Rotate(まわる)」をクリック >アニメキャストが入ります。
  3. 「9VA」ボタン C をクリック
  4. メニュー項目をカーソルで選ぶ(D)と下にひとつめのメッセージが表示されます。
  • メニューに表示されているのは、使っているアニメキャストです。
  • ここで D をクリックすれば、propeller.eva が入ります。
  • Ctrl を押しながら D をクリックすれば、propeller.eva の中を修正できます。
  1. ファイルメニューから「New(新規作成)」をクリック
  2. 「9VA」ボタン C をクリック
  3. メニュー項目をカーソルで選ぶ(D)と下にふたつめのメッセージが表示されます。
  • メニューに表示されているのは、使っているアニメキャストです。
  • 他のアニメで使われているアニメキャストも( )で囲まれて表示され、クリックして入力することができます。

アニメキャストの中で使えないコマンド "Negrected Commands"

アニメキャストは強力な機能ですが、アニメキャストの中では使えない機能があります。機能を使えなくしている理由は、再生時のパフォーマンスの向上が主な理由です。以下に例を示します。

trans05b.png

  1. 3番目のパレットタブ A をクリック > スタンプパレットが表示されます。
  2. 「動くスタンプ」 B をクリック > 「Rotate(まわる)」をクリック >アニメキャストが入ります。
  3. アニメキャストの中心 C をクリック > 「Edit AnimeCast(アニメを修正)」D をクリック >アニメキャストの中が開きます。 trans08.png
  4. メニューバー「Input(ツール)」F をクリック>「Zoom Frame(ズーム枠)」をクリック > ズーム枠が入力されます。
  5. 太字「(new)」G をクリック>「Return(このアニメにもどる)」をクリック>元のアニメが開きます。
  6. メニューバー「Input(ツール)」F をクリック>「Optimize AnimeCast(アニメキャストの整理)」をクリック>「OK」をクリック>「OK」をクリック
  7. アニメキャストの中で、ズーム枠が無視されることを警告するメッセージが表示されます。 trans09.png

基準枠を呼び出し側にあわせる。"Reset to caller's size"

アニメキャストの基準枠のサイズを設定する操作です。以下の例をご覧ください。

trans14.png

  1. メニューバー「Help(ヘルプ)」A をクリック>「Play with face (Training)(かおであそぼう)」 > 「Waraemon(わらえもん)」をクリック > サンプル画像「わらえもん」が入力されます。
  2. まげを四角形で囲むようにドラッグ(B)して選択
  3. 「カット」ボタン C をクリック > まげが記憶ツールに入ります
  4. 「9」ボタン D をクリック >「OK」をクリック >まげがアニメキャストになって入ります。 trans15.png
  5. まげ以外の顔を四角形で囲むようにドラッグ(E)して選択
  6. 「カット」ボタン F をクリック > 顔が記憶ツールに入ります
  7. 2ページの左肩 G をクリック > 「Loop(繰り返し)」をクリック>Loopが入ります。
  8. まげ H をクリックして選択 trans16.png
  9. 中心ハンドル「+」I をクリック
  10. 「Show while Touch(さわったら見える)」J をクリック > チェックマークがつきます。
  11. 「Edit AnimeCast(アニメを修正)」K をクリック > アニメキャストの中が開く trans17b.png
  12. 貼り付けボタン L をクリック > 「Paste to the Stage(ステージにもどす)」をクリック

  13. 太字(new-sample) M をクリック > 「Return(このアニメにもどる)」をクリック

  14. プレイボタン N をクリック

  15. マウスカーソルでまげ O をさわると、わらえもんが表示されます。

  16. 停止ボタン P をクリック

  • ここで別の場所をさわると顔がでてくるように変更したい場合、どうすればいいでしょうか。

trans18b.png

  1. アニメキャスト Q をドラッグし中心に移動
  2. プレイボタン R をクリック
  3. マウスカーソルで Q をさわると、わらえもんが表示されますが、以下のように位置がずれます。
    trans19.png

  4. 停止ボタンをクリック

  5. アニメキャストを選択し、中心ハンドル「+」T をクリック

  6. 「Edit AnimeCast(アニメを修正)」をクリック > アニメキャストの中が開く
    trans21b.png

  7. メニューバー > 「Edit(編集)」U >「Select(選択)」>「Base Frame(基準枠)」をクリック > 基準枠が選択されます。

  8. 中心ハンドル「+」V をクリック

  9. 「Reset to caller's size(呼び出し側にあわせる)」W をクリック > 基準枠の位置とサイズが呼び出し元のアニメキャストの枠と同じになります。

  10. 太字(new-sample) X をクリック > 「Return(このアニメにもどる)」をクリック

  11. プレイボタンをクリック

  12. マウスカーソルで中心をさわると、わらえもんがそのままの位置で表示されます。

さわったら見えるアニメキャスト "show while touch"
クリックすると見えるアニメキャスト "show after Click"

アニメキャストには対話的な動作をつける属性があります。以下の操作で理解できるのではないでしょうか。
trans01.png

  1. ページの左肩 A をクリック > メニューから「Loop」をクリック >「Loop」が入ります。「Loop」を入れるのはすぐアニメーションが終わらないようにするためです。
  2. 3番目のパレットタブ B をクリック > スタンプパレットが表示されます。
    trans02b.png

  3. 「動くスタンプ」 C をクリック

  4. メニューの下の「Click-->Open!」D をクリック >「Click」と書かれた箱が入力されます。

  5. もう一度「動くスタンプ」C をクリック

  6. メニューの下の「Click-->Open!」E をクリック >点線の図形が入力されます。>ドラッグしてすこし右に移動させてください。

  7. プレイボタン F をクリック >アニメーション再生が始まります。

  8. ここで、「クリックと書かれた箱」をクリックすると消えます。点線の図形のある場所をクリックすると「赤いバツ印」が現れます。

  9. 停止ボタン G をクリックするとアニメが終了します。

これは「クリックと書かれた箱」と「赤いバツ印」はどちらもアニメキャストで、「クリックすると消える」「クリックすると見える」属性が設定されています。

trans03.png
1. 点線で表示された「赤いバツ印」の選択枠の中心 H をクリック
2. メニューの I に問題の訳語‘show while touch’が表示されています。これをクリックしするとチェックマークがつきます。
3. プレイボタンを押して、動作を確かめてください。さわったときだけ見えるようになります。
4. もう一度、点線で表示された「赤いバツ印」の選択枠の中心 H をクリック
5. メニューの J が ‘show after Click’に変わっているはずです。この項目はクリックするたびに表示が変わり、チェックマークがついたり消えたりします。
6. ‘show after Click’にチェックをつけて、プレイボタンを押して動作を確かめてください。クリックすると「赤いバツ印」が表示され、そのまま表示を続けます。
7. 左側の箱はクリックしたときだけ消えます。この場合は'Hide while Click Down' という設定になっています。

ページの上の表示を元に戻す。"Time will be shown on the page."

ページの上には時間が秒で表示されていますが、実は、ここに変化スピードを表示させることができます。これは画面の変化するスピードを一定にしたい場合に役立ちます。

trans10b.png

  1. 画面左上 A に四角形を描く
  2. 「次のページにリンクコピー」ボタン B をクリック>2ページに四角形がコピーされる
  3. 四角形を右端に移動 C
  4. 1ページの時間 D を、Ctrlキー(Macは Commandキー)を押しながらクリック > 時間表示が dot スピード表示 D に変わります。この数字はこのページでもっとも変化が速い点の移動スピード(1秒間で横幅512ドット)を示します。
  5. もう一度 D をCtrlキー(Macは Commandキー)を押しながらクリック >表示 D が時間表示にもどります。このとき E に上のメッセージが表示されます。

端をとめて変形 "Transform with pin"
端を弱くとめる "Transform with soft pin"

これは図形を変形するときに、変形する点と変形しない点との境界を緩やかにするための機能です。

trans11.png

  1. メニューバー「Help(ヘルプ)」A をクリック>「Play with face (Training)(かおであそぼう)」 > 「Waraemon(わらえもん)」をクリック > サンプル画像「わらえもん」が入力されます。
  2. Ctrl +A(Macの場合 Command+A)キーを押す。>全部選択されます。
  3. 点選択ボタン B をクリック > 点選択モードになります。
  4. 口から上の点を四角形で囲むようにドラッグ(C)して選択
  5. 選択枠の角のハンドル■(D)をクリック
  6. 「Transform with pin(端をとめて変形)」をクリック>チェックマークがつきます。
  7. 「Rotate(回転)」をクリック>マウスに従って顔の上部が下図のように回転します。 trans12.png
  8. 「Transform with pin(端をとめて変形)」をクリック>メニュー項目が「Transform with soft pin (端を弱くとめる)」に変わります。
  9. 「Rotate(回転)」をクリック>マウスに従って顔の上部が下図のように回転します。 trans13.png
  • 青い枠で囲まれた点が「端点」になります。端をとめて変形にチェックがある場合、「端点」に近い点ほど回転しなくなります。「端を弱くとめる」ではその効果が少し弱くなります。

いっしょに塗る設定をした多角形の穴をつなぐ。 Delete points to Bind holes of polypoligon

これはイラストレータや、Openclipart のSVGデータを変換して入力したポリゴンデータを処理するための機能です。これらのデータの中には、複数の多角形を一度に塗ることで、ドーナツのような穴がたくさんある図形が含まれている場合があります。この穴を結合するための機能です。

まず、穴(いっしょに塗る図形)を作成するところから説明しましょう。

groupFill01.png

  1. 四角形ボタンAをクリックし、画面に2つ四角形を描いてください。
  2. 選択ボタンBをクリックし、2つの四角形を囲むようにして両方を選びます。
  3. Ctrl+Gキーを押してグループ化してください。
  4. もう一度クリックして選んだあと、中心の「+」Cをクリック>メニューの「いっしょに塗る」をクリック
  5. グラデーションボタンDをクリック>メニューから一番下の円形グラデーションをクリック>下の図のようになります。

groupFill02.png
- グループ化しただけでは2つの図形は別々の図形ですが、「いっしょに塗る」にチェックすると、1つのグラデーションしかもてなくなり、2つの図形が共通のグラデーションで塗られます。

  1. 点選択ボタンEをクリック
  2. 下の2つの点Fを選択
  3. ここで「削除ボタン」Gをクリックすると2つの点が削除されるだけ(下図H)ですが、Ctrlキーを押しながら「削除ボタン」Gをクリックすると2つの図形が結合され、1つの図形になります(下図I)。

groupFill03b.png

この操作を(穴をつなぐ)と表現しています。「穴」というのはグループ化し「いっしょにつなぐ」属性をつけた2つめの図形の輪郭のことです。ドーナツのような図形の内側の円が穴になります。

この機能が必要になるのは、以下のような場合です。

下のOpenClipArtのイラストから右側の男の子だけを切り出す場合、
bindhole01.png

左側の女の子や積み木の輪郭線を削除していくと、下のような輪郭が残ります。
bindhole02b.png
ここで、外側の輪郭Aとあごの下から肩にかけての輪郭B(穴)が別々の輪郭線になっており、同じ輪郭線に結合しなければなりません。

bindhole03c.png

それには以下のようにします。(※この操作は、Ver.0.4.14 以降の 9VAeきゅうべえが必要です。)

  1. AとBの輪郭線を同時に選択し、結合したい部分の点Cを選択します。
  2. 点選択ボタンDをクリックすれば、選択した輪郭以外の制御点が表示されなくなり、見やすくなります。
  3. Ctrlキーを押しながら+削除ボタンEをクリックすれば、点が削除されると同時に輪郭線Aと穴Bが結合し、以下の図のようになります。(MacはCommandキー+削除ボタン) bindhole04.png なお、結合できるのは、「いっしょに塗る」と設定された図形だけです。別々の図形を結合することはできません。

はみだした輪郭線の点を移動し切り出しが完成します。
bindhole05.png

ドラッグで隣の点を選ぶ。Drag point select mode start/end

これは重なった図形の中から修正したい点だけを選ぶための機能です。

下の絵は、Openclipart の MangaHairです。
dragpnt01.png

  1. 絵全体を選び、点選択ボタンAをクリックし、制御点を表示させます。
  2. Ctrlキーを押しながら点選択ボタンAをクリックすると「ドラッグで隣の点を選ぶ」モードになります。
  3. ここで画面の点Bから下のほうに髪の毛にそってドラッグしてみてください。

dragpnt02.png
Cのように点Bにつながった髪の毛の点だけが選ばれます。

  • 多くの重なった線の中から1本の輪郭線を選ぶための機能です。
  • Ctrlキーを押しながら点選択ボタンAをクリックすると「ドラッグで隣の点を選ぶ」モードは解除されます。

小さなごみ(Small Dust) を選択する

小さなポリゴンだけを選択するコマンドです。ごみをとるときに使います。

smallDust.png

  1. 鉛筆ボタンAをクリック
  2. 画面全体に、点を多数描いてください。
  3. 四角形ボタンBをクリック
  4. 画面中央に四角形を描いてください。
  5. メニュー>編集(Edit)C>選択(Select)>小さなごみ(Small Dust)>これで小さな点だけ選択されます。
  6. 削除ボタンDをクリック
  7. これで下図のように画面上の小さな点が消えます。

smallDust02.png

もしFのように点が残っていたら、それは少し大きな点です。これは以下のように表示倍率を小さくして、選択できます。
1. 左下の「-」ボタンEを何回かクリック>表示倍率を下げる
2. メニュー>編集(Edit)C>選択(Select)>小さなごみ(Small Dust)>これで小さな点だけ選択されます。
3. 削除ボタンDをクリック>小さな点が消えます。

この機能は、スキャナで入力した画像をベクトル化したSVGイラストのデータサイズを削減するのに利用します。

あとがき

  • ここで説明されていない裏技が、まだまだあります。知りたい機能があれば、コメントください。

関連記事

9VAeきゅうべえ のご紹介

  1. 無料ソフトでアニメを作ってみよう(9VAe きゅうべえ)
  2. インストール方法
  3. スクラッチ、ビスケットの次は 9VAe=第3のプログラミング学習環境
  4. よくある質問

9VAeきゅうべえ 初級編

  1. 9VAe チュートリアル(1)ーページでタイムラインなし
  2. 9VAe チュートリアル(2)ー図形入力、選択、移動、サイズ変更
  3. 9VAe チュートリアル(3)ーアニメキャストを作る、時間調整
  4. 9VAe チュートリアル(4)ーアニメキャストの修正、往復
  5. 9VAe チュートリアル(5)ー動きグラフ、ページコピー、GIF作成
  6. 9VAeきゅうべえ:長いアニメを作る方法

9VAeきゅうべえ 上級編

  1. 動くLINEスタンプのAPNG作成:無料ソフト9VAeきゅうべえ
  2. 萌えキャラ デジたんを目ぱちさせるまで:APNGアニメの作り方
  3. openclipartの無料イラストをアニメ化する6つの手順
  4. イラストから動くLINEスタンプのようなアニメを簡単に作る方法
  5. Openclipart の 無料SVG をアニメにするテクニック
  6. 無料アニメソフト9VAeきゅうべえの裏技集

    9VAeきゅうべえ のご紹介

  7. 無料ソフトでアニメを作ってみよう(9VAe きゅうべえ)

  8. インストール方法

  9. スクラッチ、ビスケットの次は 9VAe=第3のプログラミング学習環境

  10. よくある質問

9VAeきゅうべえ 初級編

  1. 9VAe チュートリアル(1)ーページでタイムライン不要に
  2. 9VAe チュートリアル(2)ー図形入力、選択、移動、サイズ変更
  3. 9VAe チュートリアル(3)ーアニメキャストを作る、時間調整
  4. 9VAe チュートリアル(4)ーアニメキャストの修正、往復
  5. 9VAe チュートリアル(5)ー動きグラフ、ページコピー、GIF作成
  6. 書き順アニメーションの作り方
  7. 9VAeきゅうべえ:長いアニメを作る方法

9VAeきゅうべえ 上級編

  1. 動くLINEスタンプのAPNG作成:無料ソフト9VAeきゅうべえ
  2. 萌えキャラ デジたんを目ぱちさせるまで:APNGアニメの作り方
  3. openclipartの無料イラストをアニメ化する6つの手順
  4. イラストから動くLINEスタンプのようなアニメを簡単に作る方法
  5. Openclipart の 無料SVG をアニメにするテクニック
  6. 無料アニメソフト9VAeきゅうべえの裏技集

9VAeきゅうべえ サンプル作品

  1. 9VAeきゅうべえ」で絵を描かずに作れるGIFアニメ

9VAeきゅうべえ 技術資料

  1. アニメソフト 9VAe をカスタマイズする方法
  2. イラストレータのデータを 9VAe(きゅうべえ)に変換する方法
  3. 9VAe / 9svg データフォーマット解説