Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
R&D 祭 2024 アニメエフェクト作成の効率化
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
OLM Digital R&D
PRO
May 16, 2026
Technology
180
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
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
110
R&D 祭 2024 SIGGRAPH ASIAで会いましょう&クロージング
olmdrd
PRO
0
120
R&D 祭 2024 OLM Open Tools:アニメ業界を幸せに
olmdrd
PRO
0
250
R&D 祭 2024 UE5で絵コンテ・作画の制作支援ツールをつくる話
olmdrd
PRO
0
390
R&D 祭 2024 社内ITインフラを紹介 2024
olmdrd
PRO
0
200
R&D 祭 2024 GitHub Enterprise 導入とActionsの活用
olmdrd
PRO
0
94
R&D 祭 2024 パイプラインツール紹介+Adobe CEP開発
olmdrd
PRO
0
170
R&D 祭 2024 脱XGen:OLM Hair and Feather
olmdrd
PRO
0
130
R&D 祭 2024 オープニング 祭の見どころ紹介とSAKUGADOも
olmdrd
PRO
0
110
Other Decks in Technology
See All in Technology
品質と信頼性を地続きにする
grimoh
2
1k
C#コードの結合を可視化する Roslyn解析による設計改善と リファクタリング判断
dora56
0
730
spanner-autoscalerに学ぶ CRD設計パターン 〜自動化と緊急時対応を両立する Kubernetesコントローラーの作り方〜
tkuchiki
0
130
AIエージェントの権限管理 3: Agentic RAG の Fine grained access control 編
ren8k
1
270
今話題のAI「Jev」って何? 宇宙最速で学ぶ会
minorun365
PRO
34
22k
Lambda MicroVMsは常駐サーバーの代わりに なるか? Kiro Crew を動かして検証してみた / Kiro Crew on Lambda MicroVMs
k_adachi_01
2
220
CI/CDではもう遅い - 人とAIが迂回しないDevSecOps Verify基盤の再設計 -
kintotechdev
0
250
データ_AIの事業の勝敗をわけるもの
nek0128
1
480
あけおめLINE 傾向とその対策
nasa9084
0
330
AIに任せた品質は、誰が見立てるのか - AI時代のテストマネジメント
nakanao
3
3.1k
バイブコーディング時代のWebアプリ開発入門~Cloud Runで学ぶセキュアなビルドとデプロイ
waiwai2111
1
150
HolmesGPTで始めるSREエージェント入門!プラットフォームの障害調査はAIにお任せ 〜
sanghyuk
0
150
Featured
See All Featured
From π to Pie charts
rasagy
1
380
What's in a price? How to price your products and services
michaelherold
247
13k
Color Theory Basics | Prateek | Gurzu
gurzu
1
470
Skip the Path - Find Your Career Trail
mkilby
1
240
Build The Right Thing And Hit Your Dates
maggiecrowley
39
3.5k
Why Mistakes Are the Best Teachers: Turning Failure into a Pathway for Growth
auna
0
300
Groundhog Day: Seeking Process in Gaming for Health
codingconduct
0
370
Done Done
chrislema
187
17k
Crafting Experiences
bethany
1
350
HU Berlin: Industrial-Strength Natural Language Processing with spaCy and Prodigy
inesmontani
PRO
0
720
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
12
1.9k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
35
3.8k
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.