Anime style interactive graphic poster/game UI demo
A WebGL 2 build can be played here. A modern desktop or mobile browser is recommended.
This project was born as an attempt to blur the lines between visually sophisticated but static graphic posters and interactive but relatively simpler game UI. It aims to demonstrate an interface with a high focus on stylised visual aesthetics, specifically anime. Common design practices involving decorating the canvas with various shapes, typography, and visual effects were combined with user interactivity in Unity.
- A flat, anime style aesthetic with toon shading
- Fully rigged 3D anime schoolgirl character created in VRoid Studio and exported in the VRM format
- Dynamic text and text effects that respond to user interaction
- A customisable polka-dot effect for backgrounds, implemented in URP Shadergraph
- Procedurally generated Bezier spline curves and particles (The core logic of this process is also implemented in Python: bezierspline)
- Realtime depth-based shader replacement for special masking effects
- Animated transitions for all interactive and non-interactive objects on screen
- Character eye-tracking and natural blinking
The project was developed and tested on Unity version 2021.3.15f1 LTS. Simply clone this repository and open it in the editor. Newer versions of the Unity editor were not tested, but will likely work.
After opening the project, the URP-UniVrm .unitypackage must be imported into the project for proper character rendering. The version used during development was 1.0.4.
As of December 2022, URP-UniVrm is no longer available due to the official UniVRM release now supporting URP. However, this project is not yet updated to use this new release. Most materials will not work out of the box.
Builds have been tested on macOS, Windows 11, iOS, and WebGL 2.
The main character model (“Sairi” or “Sairi Ponytail”) was created in VRoid Studio, and thus must comply with the VRoid Studio Guidelines and VRoid Studio Terms of Service in addition to the CC-BY-SA license of the .vrm file itself.
The three fonts used in the project: Kanit, Daimon, and M PLUS 1p are all licensed under the SIL Open Font License.
All other files that are not mentioned above and are not part of Unity (e.g. /Assets/TextMesh Pro/ and project metadata, etc.) are licensed under the MIT license. Please feel free to use, modify, or simply take the concept and create derivative work.