MMD Player

Motivation

arrow_forward을 만들면서 변환 전에 원본이 제대로 된 건지 확인할 방법이 없었습니다. 텍스처가 빠졌는지, 본이 없는지 — 이게 원본 문제인지 컨버터 문제인지 구분이 안 됐습니다.">Started as a source verifier for the PMX-to-VRM conversion pipeline. I needed a tool to verify that the original model and motion work correctly before conversion. The key challenge was distinguishing whether import failures were caused by the original PMX or the VRM converter — if the PMX itself has missing textures or absent bones, it is not a converter issue.

I used the viewer myself to check source PMX models and distinguish their issues from problems introduced during conversion. I was its sole user.

Solution

I built checks for skinning, textures, and outline flags, along with skeleton and motion-compatibility analysis. On that validation foundation, I also explored WebGPU shading and lightweight effects driven by motion timing.

Automatic Motion Compatibility Analysis

Analyzes VMD motion files to calculate bone match rates against PMX models, and automatically detects IK conflicts and source model families. Game studio PMX models also follow these families — e.g., Honkai: Star Rail uses the DIVA family, Genshin Impact uses the ミリシタ family.

Bone compatibility analysis

Motion-synced Effects — Precompute Experiment

I experimented with precomputing effect timing from VMD motion data on the CPU and combining it with light type, position, and color. The resulting motion-synced effects illustrated an R&D direction for track-based visual effects.

6 types: Foot Ripple, Spark Burst, Ground Reflect, Falling/Rising Light, Velocity Effect

TSL Toon Shading — PMX Material Conversion

PMX matcap + additive overlay + alpha converted to TSL MeshBasicNodeMaterial. On this model, textureSample() was called 2–3 times per fragment for the same texture — cached the node once and reused it. Also pulled opacity out of Fn() to fix a bug where materials went invisible in the reflector pass.

Before — alpha ignored, white fill / After — additive overlay + transparency

Post-Process Pipeline — TSL Node Graph

Post-process stack on TSL nodes: bloom, ACES tone mapping, saturation, contrast, color temperature, film grain, vignette. Each effect has its own uniform so they can be toggled independently at runtime.

The pipeline builds two output chains that share the same uniforms but split at bloom. Turning bloom off swaps the output node — the GPU never runs the downsample+blur passes, not just at strength 0 but actually gone from the graph. When the whole PP is off, it falls back to the renderer's tone mapping directly.

Before — Raw render

After — ACES, CA, contrast, grain

Result