Mini tutorial on making Threejs look good/realistic

Small rundown of what you need to do in order to push Threejs out of the 90s era CGI look. Ask questions here if you want.

12 Likes

I like the extremely high effect-to-code ratio of react-three-fiber, i.e. with a few lines it is possible to achieve amazing visual results.

2 Likes

thanks pavel! i value composition a great deal, many tasks become easier to handle if they are composable. like, all of this is possible without, but how many have tried, or not because it would mean writing too much boilerplate that is then too exhausting to control and move around by code until it looks right.

1 Like

This is so beautifully rendered, how did u achieved such quality? please share us the source code

1 Like

it’s all there, the sandbox containing the source and the twitter thread explaining how it was made.

1 Like

It looks good, but I have to say that Vercel is notoriously bad hosting when it comes to performance… I thought the website was broken for me, until I opened the devtools to inspect the network activity :frowning:

(p.s. It’s not my internet. I’m on 1GB/s fiber)

Apparently it is a known issue

this is the link Building live envmaps - CodeSandbox
the deployed link is just freely hosted

1 Like

Yeah, that one loads instantly for me.