Visual Novel Player Demo

Interactive visual novel with 3D characters powered by VNSL (Visual Novel Script Language)

Loading Visual Novel...

How to Play

  • Click the dialogue box to advance through the story
  • Select choices by clicking on the buttons when they appear
  • Characters automatically show/hide and move based on the script
  • Animations play automatically when characters speak

Features

  • 3D Character Models - GLB characters with animations
  • Dynamic Loading - Characters appear/disappear as script dictates
  • Auto-Focus - Active speaker highlighted, others dimmed
  • Choice Branching - Player decisions affect story flow
  • Background Scenes - 3D environments from GLB files
  • Animation Tags - Character expressions change with dialogue

Technical Stack

Parser & Runtime

  • • VNSL custom DSL parser
  • • Event-driven execution engine
  • • 94 tests passing (parser + runtime)
  • • CLI player for testing

3D Rendering

  • • React Three Fiber + Three.js
  • • Single Canvas, multiple ModelScenes
  • • GLB/GLTF model loading
  • • Animation system integration

Script Example

@vns 1

// Declare characters
@char Natsumi model="/models/natsumi-vn.glb"
@char Catherine model="/models/catherine-vn.glb"

// Set display names
@name Natsumi "Natsumi"
@name Catherine "Catherine"

// Declare background
@bg TokyoTower model="/models/tokyotower.glb"

// Story begins
@block main
@usebg TokyoTower
@show Natsumi at right
@show Catherine at left

Natsumi (idle): Hey, took your time!
Catherine (annoyed): Nice to see you too, Natsumi.

@choice
  "Go left" -> go_left
  "Go right" -> go_right

@block go_left
> The ladies head into the park...

@block go_right
> They walk towards Tokyo Tower...

Search the site