犬(四足歩行)モーションです！ボーンは、実際の犬に合わせて入れました。作り方としては、四足歩行は前後でずれている歩き方なので同時に動くモーションをつけ、そのあとずらせば作りやすいと思います。 下っ腹と、足の付け根が動くように太ももの骨にウェイ…

上記の記事の続きです。書き出したJSONファイルをSpineのデータインポートで読み込みます。※注意：Photoshopでレイヤー名に日本語名を入れていると読み込めません。New Projectにチェックを入れなければ、既存ファイルにスケルトンを追加して製作することが…

「Spine Layer ToPNG」というスクリプトがあります。このスクリプトを使えば、いちいちSpine上で素材を読み込んで、ガイドを置き、位置を合わせる…といった工程が無くなり便利です。2019.1.29 追記｡書き出すだけなら「Spine Layer ToPNG」もできますが｢Photo…

下記記事で、spineでエフェクトを作った物を軽く紹介しましたが このアニメで剣から出ているエフェクトもメッシュを使用しているので紹介したいと思います！ spineはマスク機能が使えないのでジャバラのようにメッシュ機能を使っています。

炎エフェクト実験中です。 この2枚使用しました

こちらで紹介したキャラのモーションを、一つにまとめようとflashでつなげました。 youtu.be やり方は以下です！ officemove.hatenablog.com

今まで記事に使用したキャラクターのスプライトシート一覧です。 忍者 カッパ 妖精 ＳＤ女の子

いつもは1枚絵にモーションを付けていましたが今回は2枚使い、絵を切り替えて攻撃モーションを作りました ゲームで使用する前提で制作したのでボタンを押したとき瞬時に攻撃できるよう予備動作は短めです。 歩く、走る編 待機編 officemove.hatenablog.com

以下記事では待機アニメを制作しましたが、 今回は走り、歩きといったアクティブなモーションを付けました。 歩く、走る 上半身のひねりなどは、メッシュで調整しています。

今回はこのキャラを使ってアニメさせたいと思います。 髪の毛やスカートなど、揺れものが多いキャラなのでその部分の構造を… 原理的には下の２つの記事と同じで、ボーンにウェイトを仕込み動かしています。 spine アルパカ - ムーぶろ spineはじめました４（…

ボーンにウェイト調整でついてくるようにしてもごもごさせてみました。

officemove.hatenablog.com 前回の記事からの続きです。絵の分割に限界を感じたので下記に細かく別けてみました。 違和感まあまあ抑えられる感じになりました。360度回転＋上下回転でランダムな動きに

Spineでどこまで3Dのように動かせるのか？と思いとりあえずサイコロ(キューブ)を回転させてみることに。 裏、表の２種類の絵を用意 メッシュ打てばどうにかなるだろ！と、とりあえずやってみろ精神の結果 ゆがんでいる…遠近感を出すためにメッシュがよれてい…

spineバージョン3.6.01で[Split]ボタンがTreeビューの下に追加されました。 ボーンを指定した数に分割する機能でたとえば、このヒレのボーンを分割したいときはボーンを選択し[Split]ボタンを押します ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ 設定ウィンドウが…

今まで、イラストのみでアニメしていましたが今回は写真を素材にアニメさせました。↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ 素材は、私が以前飼ってたピンポンパールちゃんです！（左） ビチビチ

スパインだけでの長尺アニメ物はなかなか使いにくいのでスパインでPNG画像を書き出しFLASHで画像入れ子でアニメをつなげてみました。 spineはループ単体ものだといいんですけどほかのシーンとの組み合わせ安さは、FLASH使いやすいですね

今回は布がはためくアニメ制作しました。ボーンやメッシュなど、構成はYouTubeで！ 布の端にボーンを入れて、ウエイト調整で動かしているのですが一番手前の波部分はメッシュのみで流れを表現しました。やり方次第ではもっと自然に動かせると思うので随時や…

上の記事で使用したアニメーションのボーン、メッシュの様子が見れる動画UPしました！ www.youtube.com 今は画面キャプチャソフトで録画しています。spineにも、動画書き出しは一応あるんですが上手くいかない…

妖精さんアニメ制作しました！ youtu.be 今回使用した絵はこちら。↓

ホットキーで機能を切り替えられますがマウスの右クリックでも前後に選択した機能を切り替えることができます。例えば、１、回転 ２、トランスレートを選択した場合右クリックで回転⇔トランスレートと切り替えることができます！マウスのみの作業で右クリッ…

spineはじめました３（メッシュ編）の、作業過程を録画してみました。手際が悪いところはカットしてあります～www.youtube.comofficemove.hatenablog.com １、メッシュでZ軸回転させる ↑↑↑ここまでブログ参照↑↑↑↓↓↓ここから動画↓↓↓２、回転させる（回転）３…

ボーンを沢山使うような、髪の毛の束、布などまとめて選択する機会が多いもの、そういう操作は案外時間が掛かりますよね。ストア選択(Store Selection)を使うと時短できます。CTRL+９～０の数字で登録９～０で登録した選択を、再選択できます。 youtu.be

「Clean Up」はご存知ですか？アニメーションを作っていると、動きに影響を与えない余分なフレームキーが増えてくると思いますがその余分なフレームキーを削除してくれる機能が、バージョン 3.5から追加されました。 余分なフレームキーキーとキーの間に線が…

spineはじめました２ - ムーぶろ spineはじめました３（メッシュ編） - ムーぶろ spineはじめました４（ボーン、ウェイトアニメ編） - ムーぶろ spineはじめました５（IK編） - ムーぶろ 上記記事で紹介しましたがいかがでしたでしょうか？基礎を組み合わせ…

作業分担紹介編こちらでちらっと登場した「IK」を紹介しますIKとは、インバースキネマティクスの略です。難しい単語の解説はとりあえず飛ばします。目標のポイントを決めると、そのポイントに合わせて関節部分が動きます。オレンジ色のポイントに向かって関…

作業分担紹介編こちらでちらっと登場した「ボーン機能」を紹介しますまずは、パーツをバラバラに用意し、スパイン上で合体します。 ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ここの「Tools」の「作成」から、キャラクターの骨組みを想像しながら、合体し…

作業分担紹介編こちらでちらっと登場した「メッシュ機能」を紹介します わかりやすいようにこちらの一枚絵を使用して 「メッシュ編集」から、まずは輪郭をなぞって形を縁取るようにポイントを打ちます。↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ もしこの…

officemove.hatenablog.com 以前こちらの記事で紹介したアニメーションについてどういう風に作られているのか、機能を限定して書きたいと思います！回転、トランスレート、スケール、Shear機能を組み合わせて作ってます。 youtu.be でもこれだけだと、ただの…

自社の「かっぱステッカー」がappleのおすすめで紹介されました！ かっぱとかたつむりのユルイ日常をイラストで表現しました。 友達や家族との気を張らないやりとりの中で使えるステッカーが豊富なので ぜひ使ってみてください！ 無料なのでお気軽にどうぞ。…

意外とあっても気づかない機能紹介ツリーの右から３番めのアイコンをクリックするとオブジェクトの名前を検索できます。 これですねコレ。↓↓ ファイル名に「_」とか、組み込むときに邪魔な場合があるのでその時に使うと便利かもしれないですね。