The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Back to feedPost
Some more frontend Three.js work to share here.
These are 2D stock mockup scenes that use a combination of lighting maps, reflections, masks, and shaders to achieve a believable, real-time look in the browser.
PS. All my experiments are here: https://withseismic.com/threejs
Incredible design and presentation!
TOP!
Fantastic work🔥👏👏
Mind blowing work
NICE!
Faking believable reflections and lighting maps in the browser without a real render pipeline is genuinely hard to pull off. These mockup scenes hold up way better than the usual flat product shots.
Love the simplicity here, it gives the brand such a nice feel
Lighting maps and shader-driven reflections doing this much work in the browser without tanking performance is impressive. Roughly how many hours of tuning go into getting one scene to feel real before you're happy enough to ship it?
Stock mockup scenes are usually the first thing that gets sacrificed for performance on lower-end devices, so I'm curious what your fallback looks like there. Do you swap to baked lighting when you detect a weaker GPU, or is the shader setup light enough that it doesn't matter much?
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Related posts
I created an engaging 404 page design concept for a recent website design client work. Made with a predesigned poster mapped into 3d puzzle pieces using 3Js.
Omg this beautiful how did you do this??
A 45-second spec ad, created using Seedance 2.5, generated in 1080p.
One guy, one energy drink, and a sprint across a stylized city to catch the sunset!
Character, environment and prop consistency locked across 15+ shots, cinematic speed ramping, and a 3D stylized visual world.
Concept to final cut, all built from scratch!
Great work
no-code.supply is open.
I've been quietly building landing page templates. Six are out today, each with its own brand, its own type pairing and one interaction it's built around:
→ Aurel: a skincare brand with a WebGL serum drop that bulges toward your cursor
→ Ferro Type: a type foundry where the hero word bends its weight and width under the pointer
→ Meridian Expeditions: contour maps that redraw themselves as you switch routes
→ Oda: an architecture studio whose timber cabin draws itself, with a live sun study
→ Relay: a dev tool where the editor types a workflow and the run graph executes it live
→ Signal: a mission-control SaaS with a live infrastructure graph that contains threats as they flare
Built to be edited with AI. Every template ships with a README, a DESIGN.md and an AGENTS.md, so Claude, Cursor or whatever assistant you use changes it the way it was built, not the way it guesses.
Pricing, per template:
• HTML: $29
• React: $59
• Bundle (HTML + React): $79
Or get All-Access for $169: all six templates, both editions, plus every future drop. Nine more are on the way, at no extra cost.
No page builder, no lock-in, no third-party requests.
If you build sites for clients, I'd love to hear which one you'd use first.
Ferro Type is the one I would open first. Bending a variable font under the pointer re-lays out the text every frame, which is a much bigger bill than it looks, and stepping the weight in a few fixed increments is usually what keeps it smooth on a laptop that is not plugged in....