しゅみぷろ

プログラミングとか

Shader

Tessellationを用いたなんちゃってスカルプト

はじめに 何かが衝突した影響でモノが変形したり…といった表現は結構巷にあふれていて、その手法も様々です。 一番シンプルに思いつく実装方法といえば、衝突の際に実際にジオメトリを変形させることでしょうか? 今回は実際の頂点データを弄らず、GPUで頂点…

雨の日のカメラを作る

はじめに カメラのレンズに雨が付着した感を出してみました。 ささっと作ったのですが、ちょっといい感じになったので自分で驚いてます。 雨粒が付着した部分は背景の映り込みが歪むようになっています。 Unity Standerd Assetに含まれるガラスシェーダーを…

シンプルなMatcapシェーダーを書いてみる

はじめに UnityでMatcapシェーダー書いたのでメモ。 Matcapシェーダーは考え方とか実装がめちゃくちゃ簡単なので、シェーダーの勉強に良さそうです。 Matcapの特徴はとにかく軽量で良い感じに写実的な表現が行える上、実装が簡単なことだと思います。 Matcap…

UnityTexturePaint動画公開

UnityTexturePaintの簡単な紹介動画を公開しました。 最近ちょこちょこバグ取り修正を加え、FluidPaintのサンプルまでを含んだパッケージをAsset Storeで申請中です。 GitHubにはもう上がってるので、使ってみたい方は是非落としてみてください。 github.com

オブジェクト表面を垂れる液体表現 その2

はじめに ペイント後に垂らす処理 ロゴの表示演出(© UTJ/UCL) 複数色のテスト esprog.hatenablog.com オブジェクト表面を液体が垂れる表現をさせる試みの続きです。 前回の記事で基本的な部分を実装したのですが、複数の色をペイントすることが出来ないとい…

オブジェクトの一部のみ鏡面反射を行うようにする

はじめに オブジェクトにインクっぽいものを塗って、そのインク部分だけが反射するような表現がしたかったので作りました。 多用は出来ませんが、数カ所こういった特徴的な表現ができるとゲームがかなり尖ります(と思います。 UnityTexturePaintを利用してい…

歩いた場所の雪が凹むやつ作った

はじめに 雪が積もって高さがもとに戻っていくやつ書いた。Uniteでセツナの講演聞いててよかった。パーティクルの逆LODもやりたい。 pic.twitter.com/tGdu0RxZ41— Es (@Es_Program) October 26, 2016 こんな感じで、歩いた箇所の雪を凹ませるやつ作ってみま…

ハイトマップから法線情報の生成

はじめに esprog.hatenablog.com 以前の記事で、ハイトマップを参照して動的に変形するオブジェクトのサンプルを作りました。 サンプルでは、シェーディング計算が適当でしたが、今回はちゃんとシェーディングを行うために必要になる法線情報を計算してみま…

UnityTexturePaintでリアルタイムにオブジェクトを変形する

はじめに UnityTexturePaintは、リアルタイム(ゲーム実行中)にオブジェクトの持つテクスチャに対してペイントを行うアセットです。 UnityTexturePaintは以下で公開しています。 github.com 基本的には メインテクスチャへのペイント ノーマルマップへのペイ…

テッセレーション基礎

はじめに UnityでTessellationについて勉強したので基本的なところを纏めておきます。 Tessellationとは GPUを利用して頂点の分割を行う技術です。 D3D10でのレンダリングパイプラインは MSDNより引用 となっていました。 大抵の場合はVertex-ShaderとPixel-…

Splatoonの塗りみたいのを再現したい その8

はじめに esprog.hatenablog.com 前回はアンチエイリアスの実装やペイント時の色、法線情報の合成アルゴリズムを見直していきました。 実は他にもMeshColliderを不要にするために色々奮闘したりもしました(こちらで掲載しています)。 以前までの全ての関連記…

UnityTexturePaintで出来ること

はじめに esprog.hatenablog.com 上記記事でTexturePaintを公開しました。 公開当初より出来ることが多くなってきたためメモがてら機能を整理しておくのが今回のエントリです。 TexturePaintを使ってみたい場合は、GitHubから落としてきてUnityで開いてみて…

Splatoonの塗りみたいのを再現したい その7

はじめに 前回に引き続き進捗報告を。 実装内容は アンチエイリアス 色合成アルゴリズム選択機能 凹凸合成アルゴリズム選択機能 です。シェーダー周りをかなり整理したので今後色々と機能追加が捗りそう。 TexturePaintは以下で公開しています github.com ア…

液体が滴るような表現をするために

はじめに 前に液体を付着させる表現を作ったので今度は付着した液体が垂れる表現をさせるためのアプローチについてメモ 実装はまだなので、アイデアだけ書き残しておきます。 夏休み終わってから実装始めます。 方法 以前作ったテクスチャペイントを応用しま…

リングセレクトシステムとモーフォング

はじめに 今回はリングセレクトシステム(と呼んでいきます。正式名称とかあるのかは知らないです。)とモーフィングについて書いてみます。 Unityで実装しています。 リングセレクトシステムはアイコンがくるくる回って、その中の1つを選択するみたいなアレ…

「塗り」を表現する技術

はじめに Splatoonの塗りみたいのを再現したい その1 - しゅみぷろ Splatoonの塗りみたいのを再現したい その2 - しゅみぷろ Splatoonの塗りみたいのを再現したい その3 - しゅみぷろ Splatoonの塗りみたいのを再現したい その4 - しゅみぷろ Splatoonの…

Splatoonの塗りみたいのを再現したい その5

はじめに 塗り表現その5です。今回はとうとう、動的テクスチャペイントについて解説していきます。 サンプルはこちら(© UTJ/UCL)から遊べます Splatoonの塗りみたいのを再現したい その1 - しゅみぷろ Splatoonの塗りみたいのを再現したい その2 - しゅみ…

Splatoonの塗りみたいのを再現したい その3

はじめに esprog.hatenablog.com esprog.hatenablog.com 塗りを作るその3です。エフェクトを付けてベチャっと塗った感を出しました。 結構それらしくなってきた気がします。 エフェクト作る技術力が無かったのでこちらのアセットを使わせて頂きました。 実…

Splatoonの塗りみたいのを再現したい その2

はじめに esprog.hatenablog.com の続編、塗りの表現です。ちょっとだけ進化したので簡単にメモしておきます。 今回実装したのはブラシの法線マップをペイントに適用する処理です。法線マップについては 法線マップと接空間 - しゅみぷろ で紹介しています。…

法線マップと接空間

はじめに esprog.hatenablog.com 以前書いた記事で、テクスチャペイントするブラシに凹凸の表現を施したいと思い、法線マップについて勉強してみましたので纏めておきます。 以下のサイトを参考にさせていただきました。 wgld.org | WebGL: バンプマッピング…

Splatoonの塗りみたいのを再現したい その1

はじめに Unity WebGL Player | スプラトゥーンもどきをやってSplatoonやりたい欲が高まってまいりました。 Splatoonしたいけどお金なくてWiiU買えない貧乏苦学生なので、「無ければ作ろう!」という精神でSplatoonの塗りをコンセプトに取り入れたゲームを作…

クック・トランスの金属反射モデル

はじめに この記事は esprog.hatenablog.com の延長です。 なるべくパラメーターを渡す部分等はスクリプトから渡していますが、Propertiesから設定した方がいい部分もあります。 esprog.hatenablog.com 上記の記事で金属の反射モデルを紹介しています。この…

Unityでなるべくシェーディング処理を自作してみる

はじめに 以前記事にした esprog.hatenablog.com esprog.hatenablog.com こちらの知識を使って、なるべくUnityのライトやShaderLibrary(.cginc)を使わずシェーディングを行ってみました。 Unityのグラフィックスを勉強するには結構いい題材だったかなと思い…

シェーディングまとめ

はじめに esprog.hatenablog.com 引き続き、CGの基礎的なところをおさらいしていこうと思います。 Forward Renderingについてまとめてみた - しゅみぷろ の内容と関連がありますので参考までに。 今回はこちらの本を参考に、シェーディングについてまとめま…

1つのカメラでMRT出力を用いたPostEffectを実現する

はじめに 今までにも何度かCommandBufferを用いたエフェクトについて書いてきたので今更なのですが、Unityのコミュニティでの会話でなんとなくきっかけがあったので書いてみることにしました。 今回は1つのカメラでMRTによる出力を使ったPostEffectをしてみ…

Screen Space Reflection for Unity

はじめに UnityでSSR(Screen Space Reflection)に挑戦しました。 が、実際に出来たのは「SSRっぽい何か」です。 コア部分のみの実装のため、いわゆる「破綻を誤魔化す処理」は付加していません。 条件によっては結構不自然だったりします。 これを改善するた…

Forward RenderingのShadowingについて調べてみた

はじめに ForwardRenderingのShadowingについて調べたことをまとめます。 github.com 今回のサンプルでは以下の様な絵が出てきます。左2つの球はそれぞれvertex/fragment lightingを適用し、shadingを行ったもので、shadowingを行っていません。一番右の球は…

RenderDocによるUnityシェーダーデバッグ

はじめに RenderDocでUnityのシェーダーをデバッグする方法を紹介します。内容はUnityマニュアルとほぼ同じですが、簡単に導入方法をメモしておきます。 docs.unity3d.com RenderDocは以下からダウンロードしてきます。 RenderDoc Downloads 使い方 RenderDo…

UnityでCommandBufferを使わないRaymarching

はじめに 以前、id:i-saintさんとid:hecomiさんの記事を参考にUnityでCommandBufferを使ったRaymarchを試しました。 こちらの記事で紹介させていただいています。 esprog.hatenablog.com 今回はCommandBufferを使わないRaymarchingについてです。 きっかけは…

VisualStudioによるUnityシェーダーのデバッグ

はじめに docs.unity3d.com VSによるデバッグの前にいくつか注意事項があります。 注意 Unity エディターは、内部に複数の子ウィンドウが含まれています。正しいウィンドウをキャプチャすることを確実にするために、「Maximize on Play」をチェックして、キ…

UnityでRaymarching

まえがき タイトルの通りで、UnityでRaymarchingを試してみました。以下でリポジトリを公開しています。 github.com 既にやっている方のを真似させて頂いただけですので、詳しく知りたい方はid:i-saintさんとid:hecomiさんの記事を参考にしてください。 この…

Deferred Shadingについてまとめてみた

Unity5からの(Legacyでない)DeferredShadingについて自分なりにまとめてみます。 docs.unity3d.com Deferred レンダリングは、Orthographic プロジェクションを使用している場合はサポートされません。カメラのプロジェクション モードが Orthographic に設…

Forward Renderingについてまとめてみた

UnityのForwardRenderingについて自分なりにまとめてみます。 docs.unity3d.com ForwardRenderingで実行されるパス ForwardRenderingでは、1つかそれ以上のパスが実行されます。実行されるパスは Baseパス (ForwardBase) オブジェクトを1つのピクセルライテ…

ForwardRenderingとDeferredShading

西川善司の3Dゲームファンのための「KILLZONE 2」グラフィックス講座(前編) -GAME Watch docs.unity3d.com docs.unity3d.com ForwardRenderingとDeferredShadingについては上記サイトで詳しく書かれていました。 ここでは勉強を兼ねてForwardRenderingとDefe…

Shader Variantについて調べてみた

Unityシェーダーの基本についてはこちらでスライドにまとめています esprog.hatenablog.com 今回は上記のスライドの内容では扱っていないシェーダーのバリアントについてです。 色々とググッては見たのですが詳しく書いてあるサイトが見つからなかったため、…

紙をめくるアニメーションをするシェーダー作ってみた

めくりたい・・・めくりたくない・・・?? ということで、今回は紙をめくるようなアニメーションするシェーダー書きました! 今作ってるゲームが魔法の本の世界なので、こういったアニメーションが必要でした。 実装でやってることはx,yそれぞれめくった時…

背景のリピートとスクロール

容量の関係で画質がめちゃくちゃ荒いですが。。 背景画像は基本的にuGUIでバックグラウンドカメラのスクリーンスペースに対して表示させるようになっています。 この背景をプレイヤーの位置情報をもとにスクロールさせたかったので実装しました。 // 背景リ…

CustomRenderQueueで2時間迷走したお話

Debugモードでのみ見えるCustomRenderQueue。シェーダー書いてて挙動がおかしいから原因突き止めるのに2時間かかった。シェーダーが原因じゃなかった。激おこ。 pic.twitter.com/5vSxapl2KT — Es (@Es_Program) March 10, 2016 Debugモードで見れるここの値…

UIの遷移を作ってみた

色とか遷移の速度とかは調整中 マスクに使った素材はこちらからお借りしました。 For You | ぽけっとの中のいたち シェーダーはこんな感じ。 アルファ値でclipして、ピクセル色をゴニョゴニョしてます。 // gist683eb267815d27f647b6

Unityのシェーダーまとめスライドを作ってみた

予習復習を兼ねてスライドをまとめてみました。 4日くらいでガサッと作ったので、まだまだまとめきれていない項目やそもそも書いていない項目も多いです(途中で書くの飽た)。 なのでちょっと時間を置いてからまだ書けていない項目についてもまとめたいなぁと…

UnityでOpenGLモード起動するとうまく動いてくれないシェーダがある問題

結局のところDX11で開いています。 なので解決してないんですが、問題をメモっときます。 以前こちらで紹介したマスク処理なんですが.. esprog.hatenablog.com qiita.com Unity起動時に"-force-opengl"を指定すると、マスクの値によっては予期せぬ動作をしま…

マスク処理 - ShaderLab

Unityでマスクを用いたエフェクト処理を色々と試してみたのでメモ。 qiita.com マスク処理とは マスクと呼ばれる数値の集合と、注目ピクセルの周辺のピクセル色を一定の規則に従って計算する処理をマスク処理といいます。 注目ピクセルとその周辺ピクセルを$…

Blurシェーダ - ShaderLab

qiita.com UnityのShaderLabでブラーシェーダ作ってみました。 ブラー(Blur)とは霞んで見える、ぼんやりと見えるなどを意味します。遠くのものやフォーカス(焦点)を当てていないオブジェクトの描画等で役立つと思います。 このブラーはエフェクトの基本であ…

セピア調シェーダ - ShaderLab

qiita.com 勉強がてら、シェーダで画像処理してみたりしてます。 UnityのShaderLabで制作してます。 まずはセピア調シェーダ。どんな効果が得られるかというと こんな感じになります。以下シェーダのコードです。 // セピア調シェーダ作ってみた ref: http:/…

Unityでラスタースクロール

Qiitaにも書きました Qiita: Uniryでラスタースクロール Unityでラスタースクロール Unityでラスタースクロールを実装したことについて書きます。 そもそもラスタースクロールとは...っていう説明は面倒なので、「ラスタースクロールって何?」って方は動画…