この記事の3行まとめ
- アークシステムワークス、3Dモデルのアウトライン描画手法「背面法」を解説する動画シリーズの第2弾を公開
- 同社が「CEDEC2024」で実施した、『GUILTY GEAR』シリーズの背面法実装事例を解説する講演の動画を編集したもの
- 線の太さは頂点カラーで部位ごとに調整可能。ライティング/アウトライン用で2種類の法線を使い分ける手法なども紹介
アークシステムワークスは2025年4月23日(水)、『3Dでキレイな線を引くために。ギルティギアシリーズのトゥーンライン制御テクニック Part2【アークシステムワークス公式】』と題した動画を公開しました。
【動画公開📺】
アークシステムワークス開発陣による動画企画「#ASWアカデミー」
「3Dでキレイな線を引くために。ギルティギアシリーズのトゥーンライン制御テクニック Part2」を公開しました。https://t.co/rUzzT3epDt
クリエイターを志す方必見!ぜひチャンネル登録をお願いいたします🙇♂️… pic.twitter.com/00R17PFdu0
— アークシステムワークス広報部【公式】 (@ARC_CorporatePR) April 23, 2025
【動画公開📺】
アークシステムワークス開発陣による動画企画「#ASWアカデミー」
「3Dでキレイな線を引くために。ギルティギアシリーズのトゥーンライン制御テクニック Part2」を公開しました。https://t.co/rUzzT3epDt
クリエイターを志す方必見!ぜひチャンネル登録をお願いいたします🙇♂️… pic.twitter.com/00R17PFdu0
— アークシステムワークス広報部【公式】 (@ARC_CorporatePR) April 23, 2025
『3Dでキレイな線を引くために。ギルティギアシリーズのトゥーンライン制御テクニック Part2【アークシステムワークス公式】』
本動画は、「CEDEC2024」にて同社が実施した講演「3Dでキレイな線を引くために。ギルティギアシリーズのトゥーンライン制御テクニック」の動画を編集したもの。
同社の動画企画「アークシステムワークスアカデミー(ASWアカデミー)」における動画シリーズの第2弾として公開。『GUILTY GEAR』シリーズを題材に、3Dモデルにアウトライン(輪郭線)を付与する手法のひとつ「背面法」(※)について解説しています。
※ 対象のモデルに対してメッシュの法線を反転させたポリゴンを生成し、裏面を描画しないマテリアルをポリゴンに設定することで輪郭を描画する手法
今回の動画では、モデルとカメラの距離やFOV(視野)といった状況に応じてアウトラインの太さを適切に調整する技法を解説。
頂点カラーのアルファチャンネルの値を変更することで、モデルの部位ごとにアウトラインの太さを調整可能。ペン画のような線の強弱を表現できます。
『GUILTY GEAR』シリーズ最新作『GUILTY GEAR -STRIVE-』のゲーム画面。毛髪など繊細なパーツはアウトラインを細く描画。線を目立たせたくないまつ毛などの部位では、頂点カラーを0にして線を非表示にしている
また、アウトライン用メッシュのDepthを頂点シェーダー内で変更し、実際の位置より奥側で表示されるようにレンダリングすることで、最も外側のアウトラインのみを表示させて他の線を非表示にする手法も活用されています。
ただし、モデルの陰影を管理するために法線を編集する影響で、メッシュを意図した方向に押し出せず、アウトラインが途切れてしまう事態が発生します。
そこで、ライティング用とアウトライン用の2種類の法線を用意。異なる法線を使い分けることで、陰影を整えながらメッシュの押し出しを可能としています。
(画像はYouTube動画『3Dでキレイな線を引くために。ギルティギアシリーズのトゥーンライン制御テクニック Part2【アークシステムワークス公式】』より切り出して引用)
そのほか、カメラと頂点の距離に比例して背面メッシュを押し出す距離を変化させる設定や、FOVに応じた適切な線の幅を三角関数の計算式より導出する手法などが紹介されています。
なおPart3では、これまで解説した背面法の技術を活用して理想のアウトラインを描き出す運用テクニックとして、不要な線を隠す方法や、線が浮いて見える現象を改善する工夫などを紹介すると予告しています。
詳細は同社のYouTube動画をご確認ください。
3Dでキレイな線を引くために。ギルティギアシリーズのトゥーンライン制御テクニック Part2【アークシステムワークス公式】 | YouTube