Suche senden
Hochladen
クロスサマナーのド派手演出制作を支えたクリエイティブ開発環境
•
37 gefällt mir
•
10,195 views
H
Hiroyuki Ikeda
Folgen
GameGraphicsGroove講演資料
Weniger lesen
Mehr lesen
Mobil
Melden
Teilen
Melden
Teilen
1 von 37
Jetzt herunterladen
Downloaden Sie, um offline zu lesen
Empfohlen
フュージョン!イリュージョン!エクスプロージョン!SparkGearで語るエフェクト哲学
フュージョン!イリュージョン!エクスプロージョン!SparkGearで語るエフェクト哲学
GREE/Art
消滅都市 Cocos2d-xでの演出・UIあれこれ
消滅都市 Cocos2d-xでの演出・UIあれこれ
Shun Noguchi
AI Trends in Creative Operations 2024 by Artwork Flow.pdf
AI Trends in Creative Operations 2024 by Artwork Flow.pdf
marketingartwork
Skeleton Culture Code
Skeleton Culture Code
Skeleton Technologies
PEPSICO Presentation to CAGNY Conference Feb 2024
PEPSICO Presentation to CAGNY Conference Feb 2024
Neil Kimberley
Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)
contently
How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024
Albert Qian
Social Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie Insights
Kurio // The Social Media Age(ncy)
Weitere ähnliche Inhalte
Empfohlen
Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024
Search Engine Journal
5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary
SpeakerHub
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
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 Intent
Lily Ray
How to have difficult conversations
How to have difficult conversations
Rajiv Jayarajah, MAppComm, ACC
Introduction to Data Science
Introduction to Data Science
Christy Abraham Joy
Time Management & Productivity - Best Practices
Time Management & Productivity - Best Practices
Vit Horky
The six step guide to practical project management
The six step guide to practical project management
MindGenius
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...
Applitools
12 Ways to Increase Your Influence at Work
12 Ways to Increase Your Influence at Work
GetSmarter
ChatGPT webinar slides
ChatGPT webinar slides
Alireza Esmikhani
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 Routes
Project for Public Spaces & National Center for Biking and Walking
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 Presentation
Erica 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 well
Saba Software
Introduction to C Programming Language
Introduction to C Programming Language
Simplilearn
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 Vacation
Weekdone.com
Empfohlen
(20)
Trends 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 summary
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
Google'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
Introduction to Data Science
Introduction to Data Science
Time Management & Productivity - Best Practices
Time Management & Productivity - Best Practices
The 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...
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 Work
ChatGPT 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 Routes
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 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 well
Introduction 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...
9 Tips for a Work-free Vacation
9 Tips for a Work-free Vacation
クロスサマナーのド派手演出制作を支えたクリエイティブ開発環境
1.
© POKELABO, INC.
2.
© POKELABO, INC. 自己紹介 池田
博幸 41歳 エフェクトアーティスト 主な社歴 スクウェア 、CyberConnect2 略歴 背景デザイナー ↓ エフェクトアーティスト ↓ 株式会社ポケラボ入社後 ・クロスサマナーの奥義を担当
3.
© POKELABO, INC. プレゼンの流れ 1.
私の哲学 2. クロサマ誕生の理由 3. 奥義演出仕様と運営の話 4. Unityの課題 5. その解答 6. エンジニア寄りの話 7. まとめ もくじ
4.
© POKELABO, INC. 1.
私の哲学 私の哲学
5.
© POKELABO, INC. 私の哲学
6.
© POKELABO, INC. 私の哲学 魔王が魔王であるために
7.
© POKELABO, INC. 私の哲学
8.
© POKELABO, INC. 私の哲学
9.
© POKELABO, INC. 2.クロサマ誕生の理由 クロサマ誕生の理由
10.
© POKELABO, INC. クロサマ誕生3つの理由 1.
社内コンペ優勝作 2. フルネイティブ(Unity)への挑戦 3. 競合との差別化(ドット絵) +ド派手演出への渇望感←私自身の欲望 クロサマ誕生の理由
11.
© POKELABO, INC. 3.奥義演出仕様と 運営の話 奥義演出仕様と運営の話
12.
© POKELABO, INC. 1.
低レア (★3) 1~15combo 2. 高レア (★4) 15~25combo 3. 最高レア(★5) 25~35combo ※あくまで目安。最終的には企画側の調整あり この仕様に従ってアーティストが演出を制作 奥義演出仕様と運営の話 クロサマコンボ数基準
13.
© POKELABO, INC. 演出の全てをAnimationで管理 奥義演出仕様と運営の話 クロサマ演出の中身
14.
© POKELABO, INC.
142015/2/10 近接系 size x=0.5 遠隔系 size x=4.0 超遠隔系 size x=8.0コライダのsize xの値で 相対距離を設定 これが開幕時の立ち位置 奥義演出仕様と運営の話 ※分かり易くするためにコライダを視覚化 奥義演出開幕時の相対位置
15.
© POKELABO, INC. 1.
攻撃判定がやられ判定に重なった時、指定した角度に指定した強度で敵を飛ばす 2. 地面判定あり※赤い線が地面 90° 270° 0°180° 45°135° 225° 315° ノックバックの仕組み 奥義演出仕様と運営の話 白○=攻撃判定 緑○=やられ判定 矢印=ノックバック方向
16.
© POKELABO, INC.
162015/2/10 自キャラ 敵 0 1.00.5 CloseUpCenterRate 値が0の場合自キャラ、0.5の時は双方、1の時は敵を捉える 奥義演出仕様と運営の話 カメラワークの仕組み
17.
© POKELABO, INC. 奥義演出仕様と運営の話 1.
レアリティ変更に伴う演出調整 2. 属性変更に伴うエフェクト差し替え 3. ジョブ変更に伴う演出変更 これらを・・・ 運営側の修正要望
18.
© POKELABO, INC. 何度も聞いたこのセリフ
19.
© POKELABO, INC. 4.Unityの課題 Unityの課題
20.
© POKELABO, INC. 即時対応するためには リアルタイムプレビューが 絶対必要 Unityの課題
21.
© POKELABO, INC.
21 ポケラボ創立前 すでに先駆がいました 一昔前の先駆者 ※ポケラボ創立日は2007年11月8日
22.
© POKELABO, INC. でもUnityは・・・ Unityの課題
23.
© POKELABO, INC. 再生しないと確認できない 1.
ParticleはAnimation内で再生されない 2. 物理演算の加減が分からない 3. スクリプト生成物の挙動予測が困難 4. 実機確認に約6秒←これが一番の課題 Unityの課題
24.
© POKELABO, INC. Unityの課題
25.
© POKELABO, INC. Unityの課題
26.
© POKELABO, INC. 5.その解答 その解答
27.
© POKELABO, INC. Skill
Simulator (奥義リアルタイム制作エディタ) それが その解答
28.
© POKELABO, INC. その解答 ボタン一発で AnimationをFlash感覚で制御可能 ココを押すだけ
29.
© 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 その解答
30.
© POKELABO, INC. 実演
31.
© POKELABO, INC. 6.エンジニア寄りの話 エンジニア寄りの話
32.
© 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の取得方法
33.
© 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の確認方法 一覧を表示する関数があると便利
34.
© 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内からアクセスして操作 ※シミュレーションする前提のスクリプトなら楽(クロサマは後付けだった)
35.
© POKELABO, INC. 7.まとめ まとめ
36.
© POKELABO, INC. まとめ 人生を演出せよ 枠に囚われず、反逆せよ
37.
© POKELABO, INC. まとめ
Hinweis der Redaktion
私は今後もこの信念を貫きつつユーザーの皆様を感動させる演出を作り続けます。 では続いて
弊社では定期的に社内コンペを開催しており、その優勝者であり今作の生みの親である能勢の企画が商品化されたものです。 当時弊社はフルネイティブのノウハウはゼロで、挑戦の意味でUnityで何かやろうということは決まっていました。 ドット絵の理由は、今どきのユーザーの視点からは逆に新しさを感じさせるところがその理由です。 他社と同じ土俵で勝負してもノウハウの蓄積が違いすぎますし、砂漠で砂を売ることになりかねません。 そういう意味で今作のドット絵の採用は正しかったと思います。 最後に付け加えますと、Unityでド派手な演出作りたいという私自身の欲望も合わさっています。
演出仕様ですが、クロサマはコンボありきですのでそこから説明します。まずクロサマの大まかなコンボ数の目安がこちらです。 制作の流れとしては、まず仕様書でユニットのレアリティと属性を確認します。 その後、炎属性で星4だから20コンボくらい積める感じで奥義演出の制作を依頼する感じです。
つづいて自キャラと敵の相対位置について、こちら一言でいうと舞台・演劇用語でいうところのバミリですね。 こちらを最初にコライダを使って指定し奥義演出開幕時のお互いの立ち位置を決めるわけです。 コライダで見えない壁を作り、その両端に自キャラと敵を置くイメージです。
次にノックバックについて簡単に説明します。2D格ゲーで用いられている手法とまったく同じです。 攻撃判定がやられ判定に接触したときにノックバック(のけぞり、後退)が発生するしくみになっています。 クロサマではこれを利用して奥義などの空中連続コンボを作成しています。
最後にカメラワークですが、クロサマの場合自動カメラですので指定が無ければ自キャラと敵の中心座標をフォローします。 その中心座標はアーティスト側でも自由に指定でき、さらにズームなどのアニメーションを加えることで動的なカメラワークも実現可能になっています。 最近完全な手付カメラの対応も完了し、さらに意図通りの演出が可能になりました。以上、3つの組み合わせて基本的な奥義の演出が作られています。
運営側の要望に即対応するためにリアルタイムプレビューが絶対に欲しい。
ちなみにリアルタイムプレビューは9年以上前にスクエニFF12チームが先駆してました。 2006年といったらポケラボ創立前ですね。確か開発に5年以上かかったと伺っていますので、実際は10年以上前になるはずです。 えふぇくちゃんがリアルタイムプレビューを搭載していたからアーティストが存分に力量を発揮しあの召喚獣演出が生みだせたのではないかと思っています。
そんなリアルタイムプレビューが絶対に欲しい。 でもご存じのとおりUnityは
Unityというゲームエンジンに対する反逆でもあります。
そこで我々クリエイティブチームの出した答えがこちらです
ちなみにこれはリアルタイムプレビューが無かった頃の字コンテです。 私自身制作前にこういった字コンテを書いてましたが直感的ではなく、見ている私もわかりにくいです。 SkillEditorのおかげで直感的に作業できるようになりました。私基準でいうと4日かかった奥義が2日以下で作れるようになりました。
続いて弊社エンジニアの重田にまとめていただいたリアルタイムプレビューに関する資料を発表させていただきます。 本人いわく、ものすごく高度な技術を駆使しているわけじゃないですが 与えられた環境に我慢せず、枠に囚われない発想でゲームエンジンに反逆してみると意外な解決法があります むしろ高度な技術よりも柔軟な発想が先だと申しておりました。
Jetzt herunterladen