もっと読む

PMチームが挑む「自走できる組織づくり」遠慮が生む“微妙なズレ”を無くすために。

2DCGプラネットスタジオ PMチームが生まれた理由と、これからの展望こんにちは、2DCGプラネットスタジオ プロジェクトマネジメントチーム(以下、PMチーム)のM.Kです。今回は、2…

続きを読む

もっと読む

アニメチーム ポートフォリオのススメ~Spine~

こんにちは!2DCGプラネットスタジオ アニメチームのKです。今回は、2Dアニメーション領域での就職を目指す方に向けて「Spine」でのポートフォリオについてお話します。押さえてお…

続きを読む

もっと読む

<プロジェクトを動かす人の話>PM/進行管理ってこんな仕事です。

2DCGプラネットスタジオ PMチームのお仕事とははじめまして。今回から社内ブログを担当することになった、PMチームの”とみ”です。初回はゲーム制作に関わる「PM(…

続きを読む

もっと読む

【初心者向け】ゲームの「UI」デザインとは?

はじめまして!ブログ運営担当・デザインチームの笈田です。皆さんは「UI」という言葉をご存知でしょうか?デザインのことを少し知っている方なら、もしかすると聞いたことのある言葉かと思います…

続きを読む

もっと読む

【Spine】2Dアニメーションを2.5次元にする方法

はじめまして! 2DCGプラネットスタジオ アニメーションチームの馬場です。  皆様Spineというものをご存じでしょうか?Spineとはイラストを素材にアニメーションを作るソフト…

続きを読む

もっと読む

アニメチームポートフォリオ 「いるるのお部屋」背景アニメーション

こんにちは!2DCGプラネットスタジオ アニメチームのKです。今回は「背景イラストのLive2Dアニメーション」作品をご紹介します!オリジナルキャラクター「星奈いるる」をテーマにしたお…

続きを読む

もっと読む

Live2D・Spineで作るアニメーションの12原則の話 ②カーブを使いこなそう

アニメチームのKです!今回はアニメーションの12原則とグラフアニメーションの話の第二回。前回は前提知識のご紹介をさせていただきました。Live2D・Spineのアニメー…

続きを読む

もっと読む

【新卒インタビュー】新人研修って何するの?入社後の“最初の一歩”をのぞいてみよう!

こんにちは、ARTチームのブログ担当アダチです!9月に入り、就職活動を真剣に考え始める方も多いかと思います。「入社したらすぐ現場に出るのかな?」「研修って実際何をするの?」そん…

続きを読む

もっと読む

ARTチームのADとは~イラストレーターのキャリアアップについて聞いてみた~

こんにちは、ARTチームのアダチです!今回のテーマは「AD(アートディレクター)」です!イラストレーターとして経験を積むと、必ず一度は耳にする「AD」という役職。魅力的に感じる…

続きを読む

もっと読む

Live2D・Spineで作るアニメーションの12原則の話 ①概要

こんにちは。アニメチームのKです。今回は「アニメーションの12原則」と「Live2DやSpineなどのツールアニメーション」を繋げる知識についてご紹介します。ポートフォリオのススメシリ…

続きを読む

PMチームが挑む「自走できる組織づくり」遠慮が生む“微妙なズ...

アニメチーム ポートフォリオのススメ~Spine~

<プロジェクトを動かす人の話>PM/進行管理ってこんな仕事で...

【初心者向け】ゲームの「UI」デザインとは?

【Spine】2Dアニメーションを2.5次元にする方法

アニメチームポートフォリオ 「いるるのお部屋」背景アニメーシ...

Live2D・Spineで作るアニメーションの12原則の話 ...

【新卒インタビュー】新人研修って何するの?入社後の“最初の一...

ARTチームのADとは~イラストレーターのキャリアアップにつ...

Live2D・Spineで作るアニメーションの12原則の話 ...

【Spine】2Dアニメーションを2.5次元にする方法

はじめまして! 
2DCGプラネットスタジオ アニメーションチームの馬場です。 
 
皆様Spineというものをご存じでしょうか?

Spineとはイラストを素材にアニメーションを作るソフトウェアのひとつです。 

私は業務でSpineを使っていますが、「直感的にアニメーションが作れる」と感じています。

今回はそんなSpineで2Dアニメーションの立体感を2.5Dにクオリティアップできる方法の1つ、

「トランスフォーム・コンストレイント」という機能をご紹介させていただきます! 

 

トランスフォーム・コンストレイントとは?

簡単に言うと、設定したボーン同士が連動して動くようにできる機能です。 

 トランスフォーム・コンストレイントのボーンイメージ

ピンクのボーンを動かすと青色のボーンが連動し、ピンクと同じ方向や反対方向に動かすことができます。 

今回はトランスフォーム・コンストレイントを使って反対方向に連動させ、

より立体的に見えるアニメーションを作っていきたいと思います。
 

立体的に見せるポイントは”ひねり”

「ひねり」のイメージ

2.5Dのような立体的なアニメーションにするポイントは、ずばり”ひねり”を加えることです!

顔や体の左右を向く角度の範囲が大きくなればなるほど、アニメーションの立体感が増していきます。

実践 

さっそく、こちらのアニメーションに”ひねり”を加えて立体的なアニメーションにしていきましょう。

 トランスフォーム・コンストレイントを加える前のアニメーション
①ボーンを2つを制作し、トランスフォーム・コンストレイント化させる 
 その際、オフセットの「一致」を押し、ミックス・トランスレートの値を-100にする 
 これで反対方向に連動する設定になります 

②ひねりを加えたいパーツ(今回は脚以外のパーツ)にメッシュを打ち、 
 ①の2つのボーンをバインドする 

③ANIMATEモードで動かしながらウェイト値を調整  

そして、上記の手順でひねりを加えたアニメーションがこちらです(動画右側)。

 トランスフォーム・コンストレイントを加えた後のアニメーション比較

比べてみると立体感の違いがはっきりしますね!

トランスフォーム・コンストレイントを使うと、メッシュの手動変形を使うことなく立体感のある動きを作ることができます。 

 

いかがでしたでしょうか?

Spineのトランスフォーム・コンストレイントを使い、”ひねり”を加えることで

平面的なアニメーションをより立体的なアニメーションにクオリティアップさせることができます。 

少しでもアニメーション制作の手助けになれれば幸いです。

ここまで閲覧していただきありがとうございました! 

関連記事

  1. もっと読む

    アニメチーム ポートフォリオのススメ~Spine~

    2025-10-21

  2. もっと読む

    【新卒】若手2DCGアニメーターへインタビュー!

    2026-03-18

  3. もっと読む

    Live2D・Spineで作るアニメーションの12原則の話 ②カーブを使いこなそう

    2026-03-05

  4. もっと読む

    アニメーションチームメンバーを紹介します!Vol.2

    2022-05-30

採用情報

ABOUT

C&R Creative Studiosに所属するPlanet Design Studio(プラネットデザインスタジオ)です。
最高のクリエイティブ制作・クリエイターの キャリアデザインができるスタジオを目指しています。

運営:
Planet Design Studio

所属:
C&R Creative Studios

チーム別記事一覧

ページ上部へ戻る