Threejs experimets

Envato Authors CodeCanyon
1

Hi guys I am experimenting with Threejs, can you please test this link let me know the frame rate also there are live settings on the top right and the frame rate on the top left.

And a dummy play button to play an mp3, the particles and sphere are animated based on the audio frequency.

https://webdesign-flash.ro/ht/pap/

There are literally infinite possibilities in configuring the sphere and particles, this is what I have come up with :slight_smile:

535
5351840Ă—969 194 KB

I don’t feel safe with Shaders and the 3D world.

Thank you.

1 Like
2

This is absolutely brilliant! 60fps here, but I may be cheating (maxed out Mac Studio here, haha!)

1 Like
3

Wow, that is really cool. Love all those customization options. I’m gonna have to check three.js out some time.

A buttery smooth 165 fps here, but boy did it put my GPU to work! :sweat_smile: I’d definitely be curious to hear how this performs on an “average” machine.

1 Like
4

Looks super cool.
14fps on an old laptop without a graphics card. A bit heavy but playable.
144fps on RTX 2070 Super

1 Like
5

It crashed into a black hole :slight_smile:

black-hole
black-hole1676Ă—1056 312 KB

1 Like
6

Yes, threejs is very cool.

Here is another experiment, a slider Distortion Slider

7

Playing with this, it seam that you can play with it and create anything… I always come up with something new.

55
551663Ă—969 268 KB

8

WOW! That is incredibly brilliant - I was so loving it I didn’t bother checking results LOL :slight_smile:

9

Yes is so cool, I am thinking of codding this in a full plugin, but I still need to learn a few things.

10

I decided to do this a full product still working on it :slight_smile:

https://webdesign-flash.ro/ht/pap/

11

Doesn’t work properly on Firefox - not sure what happened :slight_smile:

12

It’s working fine for me (Chromium) and looks amazing in a music player. Still very inefficient though, it’s demanding over 50 watts from my GPU which is a crazy amount.

It might be worthwhile to look into limiting the frame rate in the final product. It’s running at 165fps for me (constrained by v-sync) but I would be comfortable with this thing running at 30fps or so.

13

Thank you for your feedback.

30 FPS is too low, the optimal framerate is 60 FPS.

I limited the framerate to 60fps or close to it is impossible to do it exactly 60 FPS and also optimized the sphere geometry, this is the best that can be done, threejs runs on the GPU so it will use it :slight_smile:

I think is more than acceptable.

If you test please clear the cache.

https://webdesign-flash.ro/ht/pap/

Thank you.

1 Like
14

That’s so much better. It went from 50 to 6 watts. I think that will be fine. :slight_smile:

15

Perfect :slight_smile:

I believe threejs and 3d in general will take over the WEB it is literally amazing what is possible with it but is another game, this stuff is difficult really diffcult.

Check this out https://adidaschile20.com/

2 Likes
16

Thank you for looking into this.

I have finished the project and uploaded to Codecanyon hopefully will be accepted it was not easy to build and I hope the first of many with three, I am just getting started.

1 Like
17

Ok guys from an idea and from almost now threejs knowledge I made a product that now is on sale on CodeCanyon…

18

@FWDesign

Well done my friend - looks very impressive!!!
Now regarding this $59.00 price - don’t forget your friends who helped you here LOL - I am kidding but really where’s our discount bro??? :wink:

19

It’s coming :slight_smile:

1 Like