I have tried to build a Game like Need For Speed using Cannon-es and Three js

Showcase
, , , , , , ,
1

daedf236c3fd672a09282a53e9f74c08d25b3d55_2_942x750
daedf236c3fd672a09282a53e9f74c08d25b3d55_2_942x750942×750 80.1 KB
https://need-for-speed-clone.onrender.com/

9 Likes
3

This is a great start! You’ve clearly put a lot of work into this, nice one! I’m not sure how to solve the curbs sometimes imparting quite an extreme amount of flip-you-upside-down potential :smiley: also those multiple yellow lines across the road and the road barriers, though interestingly not so much the cones. Also pretty sure I hit the “C” mid air on track 1 and it put me into a mid air spin which I thought was a little cruel :joy: Great work though so far :slight_smile:

1 Like
4

Amazing! Where did you get the models?

1 Like
6

Thanks a lot, really appreciate the feedback! :raising_hands: Yeah, the curbs can be a bit evil right now :sweat_smile: — I’ll work on softening that so they don’t flip cars so much. The multiple yellow lines and barriers are on my to-fix list too. Haha, hitting ‘C’ mid-air spinning you out was totally unintentional, but I kinda love that you experienced it :joy:. Glad you enjoyed it so far — I’ll keep polishing!

7

Thanks! :raising_hands: I got the models from Sketchfab and did some small edits in Blender — like adjusting textures, removing logos (to avoid copyright issues), and separating the car chassis from the wheels so I could load them properly into the game.

2 Likes
8

Sick! I played with it and found it awesome! Good job!! Keep it up.

1 Like
9

Thanks a lot! Really glad you liked it :blush:

10

I just played the game, graphic is nice, accuracy is very good. For a beginner it’s AWESOME!

Keep up the good work.

11

Thanks so much! That really motivates me to keep improving :+1:

1 Like
12

I like it. The engine sounds could be pitched a bit lower…
There is a .detune property on the Audio type, that you might be able to use.. like .detune = -10000 might pitch it down a bunch. I know some games also run 2 different sounds for engine rumble to give it more texture.. like a lower pitched sound that ramps a little differently, behind the high pitch.
(edit: tried the orange car instead.. it had better engine sound so, seems like you have a handle on this. :slight_smile: Overall has a decent feel… you could take this places…

1 Like
13

Nice work on this, it’s always great to see more racing experiments with Three.js and Cannon.

I’ve also been experimenting with a Three.js + Cannon.js Need for Speed style project. It’s still evolving but you might find it interesting to compare approaches for vehicle physics and tracks.

Red Rock Ridge
https://theneoverse.web.app/#threeviewer&&redrock-ridge

London Circuit
https://theneoverse.web.app/#threeviewer&&london-circuit

Vineyard
https://theneoverse.web.app/#threeviewer&&vineyard

Big Rock
https://theneoverse.web.app/#threeviewer&&big-rock

Would be cool to hear what settings you ended up using for the RaycastVehicle suspension and friction, that part is always the hardest to tune.