---
title: 【Unity】ScreenSpaceOutlineやってみた
tags:  #unity #shader  
author: [おかひろ](https://www.docswell.com/user/okahiro_p)
site: [Docswell](https://www.docswell.com/)
thumbnail: https://bcdn.docswell.com/page/37K5DDV5ED.jpg?width=480
description: 2025年6月に新横浜インディゲームもくもく会でLTした資料です。
published: June 08, 25
canonical: https://www.docswell.com/s/okahiro_p/5MXD6E-2025-06-08-150747
---
# Page. 1

![Page Image](https://bcdn.docswell.com/page/37K5DDV5ED.jpg)

ScreenSpaceアウトラインやってみた
おかひろ


# Page. 2

![Page Image](https://bcdn.docswell.com/page/LJ3KRRM1J5.jpg)

自己紹介

おかひろ

Twitter：@okahiro_p

個人で東方二次創作ゲーム作っています

フリーランスのTA／グラフィックエンジニア


# Page. 3

![Page Image](https://bcdn.docswell.com/page/8JD3YY6KEG.jpg)

トゥーン表現でのアウトライン
アウトラインなし
背面法アウトライン
背面法アウトライン＋
ScreenSpaceアウトライン


# Page. 4

![Page Image](https://bcdn.docswell.com/page/VEP466Y3J8.jpg)

アウトラインの使い分け

背面アウトラインはメッシュを外側に膨らませる

ScreenSpaceアウトラインはメッシュの縁


# Page. 5

![Page Image](https://bcdn.docswell.com/page/27VX33GNEQ.jpg)

ScreenSpaceアウトラインの仕組み
Depthバッファを見て、隣のピクセルと一
定以上値が異なるとき、その境目の値が大
きい側のピクセルを抽出する
（輪郭抽出）


# Page. 6

![Page Image](https://bcdn.docswell.com/page/5JGV3385JL.jpg)

参考

今回のScreenSpaceアウトラインはこのアセットをカスタマイズ

Depth以外にもNormalなどその他の輪郭抽出も可能

アウトライン以外の表現も可能


# Page. 7

![Page Image](https://bcdn.docswell.com/page/47Q6559L7P.jpg)

カスタマイズ１

線の色と元の色をなじませる
標準のアウトライン機能では指定の
色がそのまま出てしまう
指定の色と元の色の割合を指定でき
るようにした


# Page. 8

![Page Image](https://bcdn.docswell.com/page/KE4499X5E1.jpg)

カスタマイズ２

ScreenSpaceアウトラインなので、キャラクター以外に背景等にも入ってしまう


# Page. 9

![Page Image](https://bcdn.docswell.com/page/L714KKN27G.jpg)

カスタマイズ２

キャラクターのみ対象にする
キャラクターの箇所のみ白くなるマス
クバッファを別パスで描画
キャラクターの箇所のみアウ
トラインが残るようになる


# Page. 10

![Page Image](https://bcdn.docswell.com/page/G7WXDD42J2.jpg)

カスタマイズ３

半透明オブジェクトが手前にあるとアウトラインだけが浮き出てしまう
半透明（Transparent）オブジェクトはDepthを描かないことが原因


# Page. 11

![Page Image](https://bcdn.docswell.com/page/4JZ6GG24J3.jpg)

カスタマイズ

半透明オブジェクトに隠れるようにする
透明オブジェクトのみを表示するマ
スクバッファを別パスで描画
透明オブジェクトの箇所はアウトライン
を隠すようにする


# Page. 12

![Page Image](https://bcdn.docswell.com/page/YE62YYVGJV.jpg)

まとめ

ScreenSpaceアウトラインは、画面から輪郭抽出して表示する

特定のオブジェクトにのみ適用したい場合は一工夫必要

半透明オブジェクトがある場合は要注意

背面法アウトラインと合わせて外枠アウトラインを強調

キャラなど選択しているときの演出としても使えそう

複数キャラのうち特定のキャラのみアウトラインを出すには、ステンシルとか必要
かも


# Page. 13

![Page Image](https://bcdn.docswell.com/page/GE52GGDXE4.jpg)

ご清聴ありがとうございました


