I want to create a 3D animation story system

Hi aiueon,

What you are describing is the basic animation functionality of Verge3d with the exception you want to run it via JavaScript.

https://www.soft8soft.com/docs/manual/en/introduction/Using-JavaScript.html#Method_1_Basic

Its not that you can’t do what you are asking but the efficiencies, time and troubleshooting are more complicated than just using Verge3d and puzzles to handle the project. Using Puzzles, you can copy the code and make lots of scenes, you could even make it dynamic.

So it sounds like you know JavaScript and dont want to learn Puzzles and that makes sense…but if this is the case…why not start with ThreeJS and just use JavaScript.

Alternatively, you may want to hire a Verge3D consultant to either:
1. create the system you want using JavaScript or
2. create the system you want using Puzzles.
3. Alternatively, you could just learn Puzzles…with your knowledge of JavaScript it should be very quick…should be able to knock this out in a day or two.

Based on your post you want:
-Only one GLTF file is required for the entire application. This file is output from a Blender scene file that contains all the meshes and animations of the story. — this is the definition of a basic Verge3D Scene

· Continues to play the animation of the loop range of the current key until the screen is clicked. — you can add an event listener for the mouse, onclick and do this.

-When the screen is clicked, the animation moves to the loop range of the next key. — yup…no problem…just added the PlayAnimation puzzle to the onlcick.

-I want to specify the key of the loop range of the animation in Blender. In Blender, you can create the loop points in your animation as example frames 0 to 30. In verge you specify the loop start and end as 0 and 30 respectively.

-I want to implement the system with Javascript instead of Puzzle. I want to copy the code so that I can make a lot of stories. — This is the oddity. You can make as many “stories” as you want in puzzles, much faster and efficiently than with JavaScript. IF you are going to use Verge3d as your base platform, you are taking on all the overhead of Verge3D and then trying to eliminate the need of it. You would be better off implementing directly with ThreeJS if you want to stick with JavaScript.

-Get the frame number of the current animation. —“GetAnimationFrame” puzzle

-Play the animation of the GLTF file by specifying the frame number.— “PlayAnimation” Puzzle

-Write the loop range information to the Blender animation key and output it to GLTF. —Dont need to do this in Blender…just specify the frame numbers in the PlayAnimation puzzle and click “Loop”
-Get that the screen was clicked. There are many puzzle events for this.

Good luck