3D AIM TRAINER
- 4 Devlogs
- 17 Total hours
A Web based 3D AIM TRAINER WRITTEN IN HTML, CSS and JS!
Ship #1
Pending review
@brijeshkumar724282
on
3D AIM TRAINER
I made a 3D web based Aim trainer in html, css, JS and three.js.
Few of the most challenging parts were funny, adjusting the texture packs evenly among all the walls, adjusting the lightning to make it look right and The aiming mechanism, I was getting tilting issues in the starting, its fixed now.
I am proud of the menu animation and making 2 modes work well.
They just need to know how to click and move their mouse! its so simple.
@brijeshkumar724282
on
3D AIM TRAINER
5h 12m 58s logged
The enviroment and textures are in good shape now, It look right in the game!! The main work that I did since the last time file structuring and organizing files in folders, and removing the code that was crashing my game, and also solved few bugs, like screen freezing. menu.html is now index.html, added features to select and play different game modes using from menu. Only Gridshot and Sixshot are live for v1. I will ship this project v1. I am looking forward to add more game modes and make a seperate page for results.
@brijeshkumar724282
on
3D AIM TRAINER
3h 39m 35s logged
I have been working on the room and textures. I cant give proper finishing to the textures, they dont look good, so I skipped it for now. I am working on the Menu/Game mode selector. I have implemented smooth scroll to select animation using gsap, and its pretty smooth.
@brijeshkumar724282
on
3D AIM TRAINER
3h 57m 31s logged
spent most of my time working on the enviroment, the room i mean and optimizing the game a little. So i added 1 boxes each sides to add depth, etc. I had to adjust the sun light and the roof that wasted most of my time. The shadows were pixelated too much so I tried blurring them a little to smooth them out, also added score and accuracy system. I might work on the UI too.
@brijeshkumar724282
on
3D AIM TRAINER
3h 55m 2s logged
##Devlog 1, BUILDING A WEB BASED AIM TRAINER WRITTEN IN HTML, CSS AND JS
I am building a broswer/web based Aim trainer for competitive games, like aimlabs but entirely written in HTML, CSS, JS and THREE.js.My primary goal was to match the aiming feel of competitive games like Valorant. Because three.js uses vertical field of vieww by default, i had to implement a dynamic conversion formula that would lock the horizontal FOV to 103. I also mapped shooter mouse sensitivity scaled directly into radian angle increaments per mouse count, to make the flick distances fell well and authentic.
for handling movements, I integrated the pointer lock API for raw mouse input that will feel just like any competitive game. I fixed a bug that made the camera tilt sideways and also stopped the screen from flipping upside down when looking up and all. also added a "+" crosshair in the middle. Also built a training room with walls, roofs and floor, and also a little depth. added realisitc sunlight shadow casting.
For testing, I built a 4x3 grid system that keeps three targets active. clicking mouse triggers center screen raycast to detect hits, free up occupied slots, etc. And also added fps counter and removed the fps cap restrictions. The target and aiming system is working fine and its fully responsive.
