SlideShare ist ein Scribd-Unternehmen logo
1 von 37
Downloaden Sie, um offline zu lesen
© POKELABO, INC.
© POKELABO, INC.
自己紹介
池田 博幸 41歳
エフェクトアーティスト
主な社歴 スクウェア 、CyberConnect2
略歴
背景デザイナー
↓
エフェクトアーティスト
↓
株式会社ポケラボ入社後
・クロスサマナーの奥義を担当
© POKELABO, INC.
プレゼンの流れ
1. 私の哲学
2. クロサマ誕生の理由
3. 奥義演出仕様と運営の話
4. Unityの課題
5. その解答
6. エンジニア寄りの話
7. まとめ
もくじ
© POKELABO, INC.
1. 私の哲学
私の哲学
© POKELABO, INC.
私の哲学
© POKELABO, INC.
私の哲学
魔王が魔王であるために
© POKELABO, INC.
私の哲学
© POKELABO, INC.
私の哲学
© POKELABO, INC.
2.クロサマ誕生の理由
クロサマ誕生の理由
© POKELABO, INC.
クロサマ誕生3つの理由
1. 社内コンペ優勝作
2. フルネイティブ(Unity)への挑戦
3. 競合との差別化(ドット絵)
+ド派手演出への渇望感←私自身の欲望
クロサマ誕生の理由
© POKELABO, INC.
3.奥義演出仕様と
運営の話
奥義演出仕様と運営の話
© POKELABO, INC.
1. 低レア (★3) 1~15combo
2. 高レア (★4) 15~25combo
3. 最高レア(★5) 25~35combo
※あくまで目安。最終的には企画側の調整あり
この仕様に従ってアーティストが演出を制作
奥義演出仕様と運営の話
クロサマコンボ数基準
© POKELABO, INC.
演出の全てをAnimationで管理
奥義演出仕様と運営の話
クロサマ演出の中身
© POKELABO, INC. 142015/2/10
近接系 size x=0.5
遠隔系 size x=4.0
超遠隔系 size x=8.0コライダのsize xの値で
相対距離を設定
これが開幕時の立ち位置
奥義演出仕様と運営の話
※分かり易くするためにコライダを視覚化
奥義演出開幕時の相対位置
© POKELABO, INC.
1. 攻撃判定がやられ判定に重なった時、指定した角度に指定した強度で敵を飛ばす
2. 地面判定あり※赤い線が地面
90°
270°
0°180°
45°135°
225° 315°
ノックバックの仕組み
奥義演出仕様と運営の話
白○=攻撃判定 緑○=やられ判定
矢印=ノックバック方向
© POKELABO, INC. 162015/2/10
自キャラ 敵
0 1.00.5
CloseUpCenterRate
値が0の場合自キャラ、0.5の時は双方、1の時は敵を捉える
奥義演出仕様と運営の話
カメラワークの仕組み
© POKELABO, INC.
奥義演出仕様と運営の話
1. レアリティ変更に伴う演出調整
2. 属性変更に伴うエフェクト差し替え
3. ジョブ変更に伴う演出変更
これらを・・・
運営側の修正要望
© POKELABO, INC.
何度も聞いたこのセリフ
© POKELABO, INC.
4.Unityの課題
Unityの課題
© POKELABO, INC.
即時対応するためには
リアルタイムプレビューが
絶対必要
Unityの課題
© POKELABO, INC. 21
ポケラボ創立前
すでに先駆がいました
一昔前の先駆者
※ポケラボ創立日は2007年11月8日
© POKELABO, INC.
でもUnityは・・・
Unityの課題
© POKELABO, INC.
再生しないと確認できない
1. ParticleはAnimation内で再生されない
2. 物理演算の加減が分からない
3. スクリプト生成物の挙動予測が困難
4. 実機確認に約6秒←これが一番の課題
Unityの課題
© POKELABO, INC.
Unityの課題
© POKELABO, INC.
Unityの課題
© POKELABO, INC.
5.その解答
その解答
© POKELABO, INC.
Skill Simulator
(奥義リアルタイム制作エディタ)
それが
その解答
© POKELABO, INC.
その解答
ボタン一発で
AnimationをFlash感覚で制御可能
ココを押すだけ
© POKELABO, INC.
近接系/剣士(敵との相対距離x=0.5~2.0)
アニメーション
地上連続攻撃
↓
打ち上げ
↓
空中連続攻撃
↓
打ち落とし
↓
(溜め)
↓
フィニッシュ
※リアルタイムプレビューがなかったときの字コンテ
当時はいわば目隠し状態で、ユニットと敵の間合い、ノックバックを考慮しながら制作
カメラワーク
CenterRate0.5/Zoom25
↓
CenterRate0.5/Zoom25
↓
CenterRate0.5/Zoom20
↓
CenterRate0.5/Zoom20
↓
CenterRate0.0/Zoom15
↓
CenterRate1.0/Zoom35
ノックバック
force1.0/angle90
↓
force3.0/angle45
↓
force1.0, angle45
↓
force4.0, angle135
↓
(none)
↓
force6.0, angle90
その解答
© POKELABO, INC.
実演
© POKELABO, INC.
6.エンジニア寄りの話
エンジニア寄りの話
© POKELABO, INC.
エンジニア寄りの話
//AnimationWindowの取得
EditorWindow[] editorWindows =
Resources.FindObjectsOfTypeAll(typeof(EditorWindow)) as EditorWindow[];
foreach (EditorWindow editorWindow in editorWindows)
{
if (editorWindow.title == “UnityEditor.AnimationWindow”)
{
animationWindow = editorWindow;
break;
}
}
//タイムラインの取得
timeLineTime = (float)animationWindow.GetType().InvokeMember("get_time",
BindingFlags.InvokeMethod, null, animationWindow, null);
//選択中のAnimationClipの取得
object state = animationWindow.GetType().InvokeMember("get_state",
BindingFlags.InvokeMethod, null, animationWindow, null);
AnimationClip clip = state.GetType().InvokeMember("m_ActiveAnimationClip",
BindingFlags.GetField, null, state, null) as AnimationClip;
AnimationWindowの取得方法
© POKELABO, INC.
エンジニア寄りの話
//publicメソッドの取得
MethodInfo[] methods = animationWindow
.GetType().GetMethods(BindingFlags.Public|BindingFlags.Instance|Bi
ndingFlags.DeclaredOnly);
//protectedメソッドの取得
MethodInfo[] methods =
animationWindow.GetType().GetMethods(BindingFlags.NonPublic|Bindin
gFlags.Instance|BindingFlags.DeclaredOnly);
ProtectedなMethodや
Parameterの確認方法
一覧を表示する関数があると便利
© POKELABO, INC.
エンジニア寄りの話
if (HitBounds.Intersects( TargetCollider ().bounds) )
Particleの再生
Particle.Simulate( nowTime );
GameObject.SampleAnimation( clip, nowTime );
Coliderの判定
Animation内のAnimationの再生
Rigidbody(物理演算)の再現
EditorWindowのUpdate内で手動で物理シミュレーション
ParticleがActiveになるかScriptからInstantiateされた個数分を予めhierarchyに生成
その他オリジナルのScript
気合いでEditorWindowのUpdate内からアクセスして操作
※シミュレーションする前提のスクリプトなら楽(クロサマは後付けだった)
© POKELABO, INC.
7.まとめ
まとめ
© POKELABO, INC.
まとめ
人生を演出せよ
枠に囚われず、反逆せよ
© POKELABO, INC.
まとめ

Weitere ähnliche Inhalte

Empfohlen

Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024Search Engine Journal
 
5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summarySpeakerHub
 
ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd Clark Boyd
 
Getting into the tech field. what next
Getting into the tech field. what next Getting into the tech field. what next
Getting into the tech field. what next Tessa Mero
 
Google's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search IntentGoogle's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search IntentLily Ray
 
Time Management & Productivity - Best Practices
Time Management & Productivity -  Best PracticesTime Management & Productivity -  Best Practices
Time Management & Productivity - Best PracticesVit Horky
 
The six step guide to practical project management
The six step guide to practical project managementThe six step guide to practical project management
The six step guide to practical project managementMindGenius
 
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...RachelPearson36
 
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...Applitools
 
12 Ways to Increase Your Influence at Work
12 Ways to Increase Your Influence at Work12 Ways to Increase Your Influence at Work
12 Ways to Increase Your Influence at WorkGetSmarter
 
Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...
Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...
Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...DevGAMM Conference
 
Barbie - Brand Strategy Presentation
Barbie - Brand Strategy PresentationBarbie - Brand Strategy Presentation
Barbie - Brand Strategy PresentationErica Santiago
 
Good Stuff Happens in 1:1 Meetings: Why you need them and how to do them well
Good Stuff Happens in 1:1 Meetings: Why you need them and how to do them wellGood Stuff Happens in 1:1 Meetings: Why you need them and how to do them well
Good Stuff Happens in 1:1 Meetings: Why you need them and how to do them wellSaba Software
 
Introduction to C Programming Language
Introduction to C Programming LanguageIntroduction to C Programming Language
Introduction to C Programming LanguageSimplilearn
 
The Pixar Way: 37 Quotes on Developing and Maintaining a Creative Company (fr...
The Pixar Way: 37 Quotes on Developing and Maintaining a Creative Company (fr...The Pixar Way: 37 Quotes on Developing and Maintaining a Creative Company (fr...
The Pixar Way: 37 Quotes on Developing and Maintaining a Creative Company (fr...Palo Alto Software
 
9 Tips for a Work-free Vacation
9 Tips for a Work-free Vacation9 Tips for a Work-free Vacation
9 Tips for a Work-free VacationWeekdone.com
 

Empfohlen (20)

Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024
 
5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary
 
ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd
 
Getting into the tech field. what next
Getting into the tech field. what next Getting into the tech field. what next
Getting into the tech field. what next
 
Google's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search IntentGoogle's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search Intent
 
How to have difficult conversations
How to have difficult conversations How to have difficult conversations
How to have difficult conversations
 
Introduction to Data Science
Introduction to Data ScienceIntroduction to Data Science
Introduction to Data Science
 
Time Management & Productivity - Best Practices
Time Management & Productivity -  Best PracticesTime Management & Productivity -  Best Practices
Time Management & Productivity - Best Practices
 
The six step guide to practical project management
The six step guide to practical project managementThe six step guide to practical project management
The six step guide to practical project management
 
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
 
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
 
12 Ways to Increase Your Influence at Work
12 Ways to Increase Your Influence at Work12 Ways to Increase Your Influence at Work
12 Ways to Increase Your Influence at Work
 
ChatGPT webinar slides
ChatGPT webinar slidesChatGPT webinar slides
ChatGPT webinar slides
 
More than Just Lines on a Map: Best Practices for U.S Bike Routes
More than Just Lines on a Map: Best Practices for U.S Bike RoutesMore than Just Lines on a Map: Best Practices for U.S Bike Routes
More than Just Lines on a Map: Best Practices for U.S Bike Routes
 
Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...
Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...
Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...
 
Barbie - Brand Strategy Presentation
Barbie - Brand Strategy PresentationBarbie - Brand Strategy Presentation
Barbie - Brand Strategy Presentation
 
Good Stuff Happens in 1:1 Meetings: Why you need them and how to do them well
Good Stuff Happens in 1:1 Meetings: Why you need them and how to do them wellGood Stuff Happens in 1:1 Meetings: Why you need them and how to do them well
Good Stuff Happens in 1:1 Meetings: Why you need them and how to do them well
 
Introduction to C Programming Language
Introduction to C Programming LanguageIntroduction to C Programming Language
Introduction to C Programming Language
 
The Pixar Way: 37 Quotes on Developing and Maintaining a Creative Company (fr...
The Pixar Way: 37 Quotes on Developing and Maintaining a Creative Company (fr...The Pixar Way: 37 Quotes on Developing and Maintaining a Creative Company (fr...
The Pixar Way: 37 Quotes on Developing and Maintaining a Creative Company (fr...
 
9 Tips for a Work-free Vacation
9 Tips for a Work-free Vacation9 Tips for a Work-free Vacation
9 Tips for a Work-free Vacation
 

クロスサマナーのド派手演出制作を支えたクリエイティブ開発環境

Hinweis der Redaktion

  1. 私は今後もこの信念を貫きつつユーザーの皆様を感動させる演出を作り続けます。 では続いて
  2. 弊社では定期的に社内コンペを開催しており、その優勝者であり今作の生みの親である能勢の企画が商品化されたものです。 当時弊社はフルネイティブのノウハウはゼロで、挑戦の意味でUnityで何かやろうということは決まっていました。 ドット絵の理由は、今どきのユーザーの視点からは逆に新しさを感じさせるところがその理由です。 他社と同じ土俵で勝負してもノウハウの蓄積が違いすぎますし、砂漠で砂を売ることになりかねません。 そういう意味で今作のドット絵の採用は正しかったと思います。 最後に付け加えますと、Unityでド派手な演出作りたいという私自身の欲望も合わさっています。
  3. 演出仕様ですが、クロサマはコンボありきですのでそこから説明します。まずクロサマの大まかなコンボ数の目安がこちらです。 制作の流れとしては、まず仕様書でユニットのレアリティと属性を確認します。 その後、炎属性で星4だから20コンボくらい積める感じで奥義演出の制作を依頼する感じです。
  4. つづいて自キャラと敵の相対位置について、こちら一言でいうと舞台・演劇用語でいうところのバミリですね。 こちらを最初にコライダを使って指定し奥義演出開幕時のお互いの立ち位置を決めるわけです。 コライダで見えない壁を作り、その両端に自キャラと敵を置くイメージです。
  5. 次にノックバックについて簡単に説明します。2D格ゲーで用いられている手法とまったく同じです。 攻撃判定がやられ判定に接触したときにノックバック(のけぞり、後退)が発生するしくみになっています。 クロサマではこれを利用して奥義などの空中連続コンボを作成しています。
  6. 最後にカメラワークですが、クロサマの場合自動カメラですので指定が無ければ自キャラと敵の中心座標をフォローします。 その中心座標はアーティスト側でも自由に指定でき、さらにズームなどのアニメーションを加えることで動的なカメラワークも実現可能になっています。 最近完全な手付カメラの対応も完了し、さらに意図通りの演出が可能になりました。以上、3つの組み合わせて基本的な奥義の演出が作られています。
  7. 運営側の要望に即対応するためにリアルタイムプレビューが絶対に欲しい。
  8. ちなみにリアルタイムプレビューは9年以上前にスクエニFF12チームが先駆してました。 2006年といったらポケラボ創立前ですね。確か開発に5年以上かかったと伺っていますので、実際は10年以上前になるはずです。 えふぇくちゃんがリアルタイムプレビューを搭載していたからアーティストが存分に力量を発揮しあの召喚獣演出が生みだせたのではないかと思っています。
  9. そんなリアルタイムプレビューが絶対に欲しい。 でもご存じのとおりUnityは
  10. Unityというゲームエンジンに対する反逆でもあります。
  11. そこで我々クリエイティブチームの出した答えがこちらです
  12. ちなみにこれはリアルタイムプレビューが無かった頃の字コンテです。 私自身制作前にこういった字コンテを書いてましたが直感的ではなく、見ている私もわかりにくいです。 SkillEditorのおかげで直感的に作業できるようになりました。私基準でいうと4日かかった奥義が2日以下で作れるようになりました。
  13. 続いて弊社エンジニアの重田にまとめていただいたリアルタイムプレビューに関する資料を発表させていただきます。 本人いわく、ものすごく高度な技術を駆使しているわけじゃないですが 与えられた環境に我慢せず、枠に囚われない発想でゲームエンジンに反逆してみると意外な解決法があります むしろ高度な技術よりも柔軟な発想が先だと申しておりました。