The visual effect of interactive line tracing by a player with tracing progresses evaluation feature
プレイヤーが決まった形状の線をなぞるエフェクトの作例(なぞり具合の判定機能付き)

The examples shown here are personal reproductions of the contents of work projects.
掲載している作例は実務で制作した内容を自主制作で再現したものです。
Tools/Environment: Unity, C#, ComputeShader, Shaderlab (Cg), Built-in Render Pipeline, 
Sidefx Houdini, Adobe Photoshop
Platform: Meta Quest2 (Android)
Working Period: 5 days
In the video captured while development below, the text mesh in front of the player indicates line tracing progress in percentage.
Also, the quad mesh next to the percentage shows the texture used for evaluating the progress internally.
The progress of tracing can be checked anytime when the programmer wants.

下の開発中の動画では、プレイヤーの正面に線のなぞり具合の進捗を%でテキスト表示しております。
また、なぞり具合のテキストの隣のポリゴンでは、なぞり具合の判定に使用しているテクスチャを表示しています。
なぞり具合の進捗はエフェクト動作中は常時取得可能です。

This expression consists of a line mesh and the Render Textures to paint.
The mesh is used to detect the line to trace by ray casting and to get the UV coordinates to paint the Render Textures.
Regarding the Render Textures, there are two types of Render Textures used in this VFX;
One is for drawing the painted area of the line, and another is for evaluating the tracing progress.
These two types of render textures are painted in the Compute Shader based on the given UV coordinates.
The Render Textures for the progress evaluation is downsampled, 32 * 32 pixels in this case, to avoid performance issues.

この表現は、線のメッシュとペイントするRenderTextureで構成されています。
メッシュは、レイキャストによってなぞる線を検出し、
RenderTextureを描くためのUV座標を取得するために使用されます。

また、RenderTextureについては、このVFXでは、線の描画領域を描くためのRenderTextureと、なぞり具合の進捗状況を評価するためのRenderTextureの2種類を使用しています。
この2種類のRenderTextureは、与えられたUV座標を基準ににCompute Shaderで描画されます。
なぞり具合の進捗を判定するためのRenderTextureは、パフォーマンスのを優先して
このケースでは32 * 32ピクセルに解像度を落としています。
Back to Top