Hi guys, was looking to get in touch with someone for a 1:1 session to help me wrap my head around a few threejs concepts.
I’m a designer + developer with very minor exposure to vanilla webgl and threejs, recently received a grant for a big new project that will require some significant threejs tooling. I’m usually comfortable with picking up new tools but am under a bit of time pressure to get up to speed on this one so feel like if I could pick an experts brain for ~1-2hrs just to validate what is and isn’t possible and what some sensible approaches might look like it would be a life saver.
Basic gist of it is based on the attached vanilla webgl demo, need to set up a modular system for earthbound battle background inspired scenes with repeating geometric patterns, some basic 3d meshes, and creative distortion driven by sine waves and similar effects. strictly orthographic scene.
main points of interest art
rendering with uniform ‘pixel’ sizes
general advice on pixelated rendering
modular setup for the background (PoC for now is just checkerboard setup in a way where its simple to dynamically place basic meshes so that they are centered in the middle of ‘parent’ bg grid boxes)
and critically, responsive with threejs! I’m ashamed to admit it, but after teaching UIUX + frontend at university for several years, I’ve found myself seriously scratching my head when it comes to handling responsive threejs scenes
happy to provide modest remuneration for suitably credentialed help.
There is no such thing as a responsive Three.js scene. The only thing we can say, using this terminology, is that we place the canvas in a responsive layout. You can call this responsiveness, or you can call it CSS-manipulated canvas overlays, let say text. Responsiveness in the classical sense is generally based on two transformations: scaling and positioning. However, once we implement it, it will not be the same scene because of the three dimensions. Note that most designs are based on two schemes, and this, under the appropriate conditions of interpretation, we can eventually call responsiveness inside the canvas: either a pattern (which works well with various types of interactive backgrounds) that fills the entire width, and this is one of the tricks, or there is one central object, which is another trick. Secondly, using the terminology responsiveness in the WebGL context is quite risky due to the limitations of mobile devices in rendering complex scenes. Finally, I don’t think responsiveness is a good thing when it comes to experience, because if we’re talking about a website, it’s fine.
