How to Create Realistic Crystal & Ceramic Materials in Blender and Three.js
Creating convincing 3D geometric props—such as sculpted ceramic spheres, crystal geodes, and storage containers—requires a balanced setup of physically based rendering (PBR) roughness, normal maps, and studio three-point lighting.
1. Setting Up Subdivision Surface Geometry
When modeling organic oval shapes or clean hard-surface boxes for real-time mobile WebGL viewports, keeping polygon counts below 4,000 triangles ensures smooth 60 FPS performance across modern smartphones and tablets without draining battery life.
| 3D Asset Type | Recommended Polycount | Shader Material |
|---|---|---|
| Sculpted Geode / Oval Prop | 1,200 – 2,400 Tris | Standard PBR (Roughness 0.25) |
| Hard-Surface Storage Box | 800 – 1,500 Tris | Brushed Metal & Matte Plastic |
| Studio Environment Lighting | 2 Directional + 1 Ambient | sRGB Tone-Mapped Output |
2. Optimizing Lighting for Mobile Browsers
Instead of expensive real-time raytracing, digital artists frequently bake ambient occlusion into vertex colors or lightweight 512x512 textures. This technique provides crisp depth and surface definition while loading almost instantaneously on mobile networks.