Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
R&D 祭 2024 アニメエフェクト作成の効率化
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
OLM Digital R&D
PRO
May 16, 2026
Technology
110
0
Share
R&D 祭 2024 アニメエフェクト作成の効率化
OLM Digital R&D
PRO
May 16, 2026
More Decks by OLM Digital R&D
See All by OLM Digital R&D
R&D 祭 2024 今だ!ABI問題
olmdrd
PRO
0
49
R&D 祭 2024 SIGGRAPH ASIAで会いましょう&クロージング
olmdrd
PRO
0
53
R&D 祭 2024 OLM Open Tools:アニメ業界を幸せに
olmdrd
PRO
0
80
R&D 祭 2024 UE5で絵コンテ・作画の制作支援ツールをつくる話
olmdrd
PRO
0
200
R&D 祭 2024 社内ITインフラを紹介 2024
olmdrd
PRO
0
73
R&D 祭 2024 GitHub Enterprise 導入とActionsの活用
olmdrd
PRO
0
48
R&D 祭 2024 パイプラインツール紹介+Adobe CEP開発
olmdrd
PRO
0
77
R&D 祭 2024 脱XGen:OLM Hair and Feather
olmdrd
PRO
0
46
R&D 祭 2024 オープニング 祭の見どころ紹介とSAKUGADOも
olmdrd
PRO
0
51
Other Decks in Technology
See All in Technology
Python開発環境にハーネス適用を検討する
yuuka51
0
180
サイボウズ、プラットフォームエンジニアリング始めるってよ ― プラットフォームチームの事業貢献と組織アラインメントの強化
ueokande
0
130
その英語学習、AWSで代替できませんか?
suzutatsu
1
170
Pythonでベイズモデリング
soogie
0
160
DI コンテナ自動生成ツールを実装してみた / intro-autodi
uhzz
0
720
ワールドカフェ再び、そしてゴール・ルール・ロール・ツール / World Café Revisited, and the Goals-Rules-Roles-Tools
ks91
PRO
0
190
SpeechTranscriber + AIによる文字起こし機能
kazuki1220
0
120
Purview Endpoint DLP 動かしてみた
kozakigh
1
460
"うちにはまだ早い"は本当? ─ 小さく始めるPlatform Engineering入門
harukasakihara
7
650
【禁断】Obsidianの第二の脳に「知の巨人」と呼ばれた師匠の脳をロードしてみた
nagatsu
0
2k
Swift Sequence の便利 API 再発見
treastrain
1
290
既存プロダクトQAから新規プロダクトQAへ
ryotakahashi
0
170
Featured
See All Featured
Groundhog Day: Seeking Process in Gaming for Health
codingconduct
0
180
ReactJS: Keep Simple. Everything can be a component!
pedronauck
666
130k
Facilitating Awesome Meetings
lara
57
6.9k
The Cult of Friendly URLs
andyhume
79
6.9k
世界の人気アプリ100個を分析して見えたペイウォール設計の心得
akihiro_kokubo
PRO
70
39k
Statistics for Hackers
jakevdp
799
230k
How to make the Groovebox
asonas
2
2.2k
Agile Actions for Facilitating Distributed Teams - ADO2019
mkilby
0
190
Are puppies a ranking factor?
jonoalderson
1
3.4k
Ethics towards AI in product and experience design
skipperchong
2
280
Claude Code どこまでも/ Claude Code Everywhere
nwiizo
65
55k
Building Better People: How to give real-time feedback that sticks.
wjessup
370
20k
Transcript
アニメエフェクト作成の効率化 Lucie Fournier Alexandre Derouet-Jourdan Marc Salvati 園部華子 © OLM
Digital, Inc. 1
2Dアニメにおけるエフェクト • 作品の個性を作る – 例:煙、水、炎 • 手描き • 物理シミュレーション –
制御が難しい – 2Dとのスタイルの違い © OLM Digital, Inc. 3 3D シミュレーション 2D 手描き
OLM Toon FX • 目標 – 2Dライクなエフェクト作成を技術支援 • 方法 –
プロトタイプ – アーティストが使えるツールに • 直感的な操作 • パイプラインに組み込める © OLM Digital, Inc. 4
OLM Toon FX 制作事例 炎 煙 水面 水滴 煙 (着色)
© OLM Digital, Inc. 5
OLM Toon FX 制作事例 モデル・アニメーション プロシージャルモデリング テクスチャ・アニメーション 3Dオブジェクトに手描き レンダリング ©
OLM Digital, Inc. 6
最近の進展は? 煙生成ツール OLM Smoke 中割りの自動生成 OLM Morph © OLM Digital,
Inc. 7
煙生成ツール OLM Smoke © OLM Digital, Inc. 8
手描きの煙 9 © OLM Digital, Inc.
10 © OLM Digital, Inc.
OLM Smoke 使用例 © OLM Digital, Inc. 11
開発の流れ 形状と塗りをそれぞれ再現 形状 3Dプロシージャルモデリング 塗り 手描き風レンダリング Mayaツールに Maya Plugin Bifrost
Arnold Shader © OLM Digital, Inc. 12
形状の再現 13 © OLM Digital, Inc.
手描きの煙の特徴 • 煙全体 – 複数のPuff(小さな塊) – Puffが移動 – 上の方が広がる •
Puff – 表面の凹凸 – 振動 – 横方向の膨らみ etc. © OLM Digital, Inc. 14
ユーザ入力 グローバルパラメータ 煙全体の設定 Puffパラメータ サイズの範囲 動きの範囲 など Puffの生成 15 各フレームでの計算
Puffのメッシュ出力 各Puffのパラメータ値計算 © OLM Digital, Inc.
Puffの生成 Puffの生成:全体の形状 位置 広がり サイズ © OLM Digital, Inc. 16
Puffの生成:Puffごとの細かな動きと形状 横揺れ 引き延ばす Squeeze (拡大縮小) ノイズ © OLM Digital, Inc.
17
結果 手描き 生成結果 ラインシェーダ (OLM Toon) © OLM Digital, Inc.
18
塗りの再現 19 © OLM Digital, Inc.
Toonシェーダ vs 手描き Toonシェーダ 手描き 光と影が明確に分かれていない 影の形が不自然 光と影が二分されている 光と影の境界のみディテールと 丸み・連続性がある
VS © OLM Digital, Inc. 20
スムースシェーダで光と影を二分 手描き スムージング: 0.5 スムージング: 2.0 スムージング: 5.0 21 1
球で近似 2 スムージング 3 符号付き 距離フィールド (SDF) 計算 4 法線計算 5 法線転送 方法 © OLM Digital, Inc.
• リムシェーダ – β = 1 - (-I * n)
n: 法線ベクトル I:視線ベクトル – 輪郭部分が明るくなる • ライトの方向を考慮したリムシェーダ – α = 1- (-L * n) L: ライトベクトル – 形状に沿った影ができる リムシェーダで境界のディテール -I -I*n=1 -I*n=0 © OLM Digital, Inc. 22
Borderシェーダ スムースシェーダ 光のディテール (影側の境界) 影のディテール (光側の境界) Borderシェーダ + + =
• スムースシェーダをベース • 境界付近はリムシェーダ © OLM Digital, Inc. 23
光のディテールの作り方 境界からの距離を元に 生成したbump 1-β β = リムシェーダ bump*(1-β) 二値化 スムースシェーダ
光のディテール ▪黒:スムースシェーダ ▪黄:光 © OLM Digital, Inc. 24
結果 25 手描き Borderシェーダ © OLM Digital, Inc.
Toonシェーダ vs Borderシェーダ 手描き Toonシェーダ Borderシェーダ © OLM Digital, Inc.
26
ツール化 27 © OLM Digital, Inc.
メッシュ生成:Maya Bifrost 28 © OLM Digital, Inc.
Bifrost Parameter パラメータの例 29 © OLM Digital, Inc.
シェーダ 複数のシェーダから選択 olmSmokeノードで色を決定 olmSmokeノード 30 © OLM Digital, Inc.
Viewportプレビュー • GPUプレビューで結果を確認 • レンダリングに近い見た目 31 © OLM Digital, Inc.
アーティストによる使用例 手描きの煙シーン OLM Smokeで再現 32 © OLM Digital, Inc.
今後の課題 • 機能の改善・追加 – シーンライトを使用 • 他のセクションでも使用 – 作画 →
SAKUGADOに組み込む? – 撮影 → AEプラグイン • 多様な煙に対応 33 © OLM Digital, Inc.
OLM Morph 中割りの自動生成 34 © OLM Digital, Inc.
手描きの流体 水しぶき、爆発、煙など 35 © OLM Digital, Inc.
手描きのエフェクト作成の流れ キーフレームを描く キーフレーム間を中割り 36 © OLM Digital, Inc. キーフレーム 中割り
キーフレーム
手描きのエフェクト作成の流れ キーフレームを描く キーフレーム間を中割り 37 キーフレームの補間 自動生成 目標 © OLM Digital,
Inc. キーフレーム 中割り キーフレーム
モーフィング生成 ユーザ入力 キーフレーム画像のマスク 方法 38 中間画像出力 中割りフレーム数 © OLM Digital,
Inc.
モーフィング生成 ユーザ入力 キーフレーム画像のマスク 方法 39 中間画像出力 中割りフレーム数 検証中 © OLM
Digital, Inc.
三角形ケージの変形によるモーフィング 40 © OLM Digital, Inc.
概要 • テクニカルアーティストが手動で試した手法 • 手順 – 三角形ケージを作成 – ケージの補間 –
マスクをマージ 41 © OLM Digital, Inc.
三角形ケージを作成 42 マスク 三角形ケージ 開始 終了 © OLM Digital, Inc.
ケージの補間 43 • 三角形を滑らかに変形 • 双方向 © OLM Digital, Inc.
マスクをマージ 44 • 双方向のマスク • 符号付き距離フィールド(SDF)でマージ © OLM Digital, Inc.
手動でのモーフィング 45 手動によるモーフィング (3フレームごと) • 自然な変形 • 細かい穴は不連続 © OLM
Digital, Inc.
手描きとの比較 46 手動によるモーフィング 手描き © OLM Digital, Inc.
自動化が難しい • 中間のマスク形状が一致しない • 複雑なマスクの三角形分割が難しい – 不均一で歪んだ三角形 47 © OLM
Digital, Inc.
自動生成したモーフィング • 不自然な動き • ちらつき 48 自動生成したモーフィング (3フレームごと) © OLM
Digital, Inc.
自動生成したモーフィング 49 自動生成したモーフィング (3フレームごと) © OLM Digital, Inc. 10 キーフレーム
自動生成したモーフィング 50 自動生成したモーフィング (3フレームごと) © OLM Digital, Inc. 11
自動生成したモーフィング 51 自動生成したモーフィング (3フレームごと) © OLM Digital, Inc. 12
自動生成したモーフィング 52 自動生成したモーフィング (3フレームごと) © OLM Digital, Inc. 13 キーフレーム
クラスタリングによるモーフィング 53 © OLM Digital, Inc.
概要 • 大阪大学の研究によるモーフィング手法 – Y. Makihara, Y. Yagi, “Earth Mover's
Morphing: Topology-Free Shape Morphing Using Cluster-Based EMD Flows,” In Proc. of the 10th Asian Conf. on Computer Vision, Queenstown, New Zealand, pp. 2302-2315, Nov. 2010. • 手順 – クラスタリング – 移動を計算 – マスクを生成 54 © OLM Digital, Inc.
• Fuzzy C-means クラスタリング – 開始・終了フレームの各ピクセルが対象 – 複数のクラスタに所属 (重みの合計は1) クラスタリング
55 Image taken from Earth Mover’s Morphing: Topology-Free Shape Morphing Using Cluster-Based EMD Flows © OLM Digital, Inc.
移動を計算 • クラスタ間の多対多の移動 • EMD(Earth Mover Distance) – 最適輸送の計算手法 –
荷物を最小コスト(重み × 距離)で運ぶ • マスクの外側へ出るとペナルティ 56 Image taken from Earth Mover’s Morphing: Topology-Free Shape Morphing Using Cluster-Based EMD Flows © OLM Digital, Inc.
• 補間画像にはノイズ • グラフカットでデノイズ – 領域を前景・背景に分割 57 Image taken from
Earth Mover’s Morphing: Topology-Free Shape Morphing Using Cluster-Based EMD Flows マスクを生成 © OLM Digital, Inc.
自動生成したモーフィング 58 自動生成したモーフィング (3フレームごと) • 自然な変形 • 滑らかでない部分も © OLM
Digital, Inc.
手描きとの比較 59 自動生成 手描き © OLM Digital, Inc.
前手法との比較 60 クラスタリング 三角形ケージ © OLM Digital, Inc.
前⼿法との⽐較 61 クラスタリング 三⾓形ケージ ちらつきが無い 連続した変形 © OLM Digital, Inc.
手描きとの比較 62 自動生成 手描き © OLM Digital, Inc.
問題点 • 動作が遅い • 多くのメモリが必要 • 動きが不自然になることも 63 自動生成 手描き
© OLM Digital, Inc.
今後の課題 • クラスタリングによる手法を改善 – 流体力学ベースの距離を試す – 計算時間の改善 • 色の補間 64
© OLM Digital, Inc.
まとめ • 煙生成:ツール改善 • 中割り生成:プロトタイプ検証 • アーティストのために – 使えるツールを作る –
フィードバック・コミュニケーションが重要 • 今後も継続 – AI手法も検討中 65 © OLM Digital, Inc.