[{"data":1,"prerenderedAt":452},["ShallowReactive",2],{"navigation":3,"/experiments/brickelangelo-david":122,"authors":334},[4],{"title":5,"path":6,"stem":7,"children":8,"page":121},"Experiments","/experiments","experiments",[9,13,17,21,25,29,33,37,41,45,49,53,57,61,65,69,73,77,81,85,89,93,97,101,105,109,113,117],{"title":10,"path":11,"stem":12},"Array of cameras","/experiments/array-cameras","experiments/array-cameras",{"title":14,"path":15,"stem":16},"Brickelangelo David","/experiments/brickelangelo-david","experiments/brickelangelo-david",{"title":18,"path":19,"stem":20},"Basic Brownian distribution","/experiments/brownian-distribution","experiments/brownian-distribution",{"title":22,"path":23,"stem":24},"Porsche 911 Car Showcase","/experiments/car-showcase","experiments/car-showcase",{"title":26,"path":27,"stem":28},"Coffee Smoke","/experiments/coffee-smoke","experiments/coffee-smoke",{"title":30,"path":31,"stem":32},"Cube Boy Dancefloor","/experiments/cube-boy-dancefloor","experiments/cube-boy-dancefloor",{"title":34,"path":35,"stem":36},"Cult of the lamb 🐑","/experiments/cult-of-the-lamb","experiments/cult-of-the-lamb",{"title":38,"path":39,"stem":40},"Dancing blob","/experiments/dancing-blob","experiments/dancing-blob",{"title":42,"path":43,"stem":44},"Fireworks Shader","/experiments/fireworks-shader","experiments/fireworks-shader",{"title":46,"path":47,"stem":48},"Galaxy Generator 🪐","/experiments/galaxy-generator","experiments/galaxy-generator",{"title":50,"path":51,"stem":52},"Glass/Plastic Material","/experiments/glass-material","experiments/glass-material",{"title":54,"path":55,"stem":56},"Grainy Liquid Blobs","/experiments/grainy-liquid","experiments/grainy-liquid",{"title":58,"path":59,"stem":60},"Haunted House","/experiments/haunted-house","experiments/haunted-house",{"title":62,"path":63,"stem":64},"Phone with HTML inside","/experiments/html-phone","experiments/html-phone",{"title":66,"path":67,"stem":68},"Low Poly Planet","/experiments/lowpoly-planet","experiments/lowpoly-planet",{"title":70,"path":71,"stem":72},"Magical Marbles","/experiments/magical-marbles","experiments/magical-marbles",{"title":74,"path":75,"stem":76},"Nuxt Stones","/experiments/nuxt-stones","experiments/nuxt-stones",{"title":78,"path":79,"stem":80},"Particle Pumpkin Shader","/experiments/particle-pumpkin","experiments/particle-pumpkin",{"title":82,"path":83,"stem":84},"Particles Morphing","/experiments/particles-morphing","experiments/particles-morphing",{"title":86,"path":87,"stem":88},"Portal Journey","/experiments/portal-journey","experiments/portal-journey",{"title":90,"path":91,"stem":92},"Wizard's Potion Classroom","/experiments/potions-classroom","experiments/potions-classroom",{"title":94,"path":95,"stem":96},"Repulsion Effect","/experiments/repulsion-effect","experiments/repulsion-effect",{"title":98,"path":99,"stem":100},"Shadertoy Museum","/experiments/shadertoy-museum","experiments/shadertoy-museum",{"title":102,"path":103,"stem":104},"Space Game","/experiments/space-game","experiments/space-game",{"title":106,"path":107,"stem":108},"Halloween Spooky-saur 🎃","/experiments/spooky-saur","experiments/spooky-saur",{"title":110,"path":111,"stem":112},"Synthwave Landscape","/experiments/synthwave-landscape","experiments/synthwave-landscape",{"title":114,"path":115,"stem":116},"Texture Particle Cursor","/experiments/texture-particle-cursor","experiments/texture-particle-cursor",{"title":118,"path":119,"stem":120},"WebGPU","/experiments/webgpu","experiments/webgpu",false,{"id":123,"title":14,"author":124,"body":125,"date":324,"description":325,"extension":326,"featured":121,"lastUpdated":324,"meta":327,"navigation":328,"path":15,"seo":329,"stem":16,"tags":330,"thumbnail":332,"__hash__":333},"experiments/experiments/brickelangelo-david.md","alvarosabu",{"type":126,"value":127,"toc":315},"minimark",[128,149,154,161,195,199,202,252,256,282,286,312],[129,130,131,132,136,137,140,141,148],"p",{},"This experiment recreates the iconic ",[133,134,135],"strong",{},"David sculpture by Michelangelo"," using ",[133,138,139],{},"75,000 LEGO brick instances",", demonstrating advanced surface sampling techniques and instanced rendering capabilities. Based on challenges from ",[142,143,147],"a",{"href":144,"rel":145},"https://threejs-journey.com/",[146],"nofollow","Bruno Simon's Three.js Journey course",", this artistic tribute combines classical art with modern procedural generation.",[150,151,153],"h3",{"id":152},"what-youll-see","What You'll See",[129,155,156,157,160],{},"The scene features a ",[133,158,159],{},"magnificent LEGO brick reconstruction"," of David's sculpture:",[162,163,164,171,177,183,189],"ul",{},[165,166,167,170],"li",{},[133,168,169],{},"75,000 Individual Bricks",": Each positioned using surface sampling algorithms",[165,172,173,176],{},[133,174,175],{},"Mouse-Controlled Rotation",": Interactive rotation following cursor movement",[165,178,179,182],{},[133,180,181],{},"Dramatic Lighting",": Spotlight that follows mouse cursor for dynamic illumination",[165,184,185,188],{},[133,186,187],{},"Cinematic Camera Movement",": Smooth GSAP-powered camera animation revealing the sculpture",[165,190,191,194],{},[133,192,193],{},"Loading Experience",": Custom progress indicator with elegant typography",[150,196,198],{"id":197},"technical-implementation","Technical Implementation",[129,200,201],{},"This experiment showcases several advanced 3D techniques:",[162,203,204,210,221,227,237,243],{},[165,205,206,209],{},[133,207,208],{},"MeshSurfaceSampler",": Distributes brick instances across the David model's surface using UV weighting",[165,211,212,215,216,220],{},[133,213,214],{},"Instanced Rendering",": Efficiently renders 75,000 bricks using ",[217,218,219],"code",{},"InstancedMesh"," for optimal performance",[165,222,223,226],{},[133,224,225],{},"Grid Alignment",": Bricks snap to a 3D grid system for authentic LEGO brick placement",[165,228,229,232,233,236],{},[133,230,231],{},"Interactive Lighting",": Spotlight dynamically follows mouse position using ",[217,234,235],{},"useMouse"," composable",[165,238,239,242],{},[133,240,241],{},"GSAP Animation",": Smooth camera movements with easing for cinematic reveal",[165,244,245,248,249],{},[133,246,247],{},"Progress Loading",": Real-time loading feedback using ",[217,250,251],{},"useProgress",[150,253,255],{"id":254},"artistic-features","Artistic Features",[162,257,258,264,270,276],{},[165,259,260,263],{},[133,261,262],{},"Custom Typography",": Elegant serif font styling reminiscent of classical art presentations",[165,265,266,269],{},[133,267,268],{},"Hidden Cursor",": Custom cursor design for immersive experience",[165,271,272,275],{},[133,273,274],{},"Black Background",": Dramatic contrast highlighting the sculpture",[165,277,278,281],{},[133,279,280],{},"Surface Alignment",": Bricks follow the natural curves and details of the original sculpture",[150,283,285],{"id":284},"key-technologies","Key Technologies",[162,287,288,294,300,306],{},[165,289,290,293],{},[133,291,292],{},"Surface Sampling",": Mathematically accurate distribution respecting model geometry",[165,295,296,299],{},[133,297,298],{},"Performance Optimization",": Single draw call for thousands of objects",[165,301,302,305],{},[133,303,304],{},"Interactive Experience",": Real-time lighting and rotation based on user input",[165,307,308,311],{},[133,309,310],{},"Classical Aesthetics",": Typography and presentation honoring the original masterpiece",[129,313,314],{},"This experiment serves as both a technical demonstration of advanced TresJS capabilities and an artistic homage to one of history's greatest sculptures, bridging classical art with modern digital techniques.",{"title":316,"searchDepth":317,"depth":317,"links":318},"",2,[319,321,322,323],{"id":152,"depth":320,"text":153},3,{"id":197,"depth":320,"text":198},{"id":254,"depth":320,"text":255},{"id":284,"depth":320,"text":285},"2023-08-21","Bricks ThreeJS Journey challenge","md",{},true,{"title":14,"description":325},[331,208],"cientos","/experiments/brickelangelo-david.png","3YNud7sO1Llhak_Ct6O9YWvNyAS700_K1JbnIKlgzCw",[335,351,366,383,399,417,434],{"id":336,"title":337,"avatar":338,"body":339,"description":316,"email":343,"extension":326,"github":124,"meta":344,"name":345,"navigation":328,"path":346,"seo":347,"slug":124,"stem":348,"twitter":124,"website":349,"__hash__":350},"authors/authors/alvarosabu.md","Alvarosabu","/avatars/alvarosabu.jpg",{"type":126,"value":340,"toc":341},[],{"title":316,"searchDepth":317,"depth":317,"links":342},[],"hola@alvarosaburido.dev",{},"Alvaro Saburido","/authors/alvarosabu",{"description":316},"authors/alvarosabu","https://alvarosaburido.dev","FWpr6-OcVRzMvvsjRaD8icRidgpKVLCtrKy9-l_5GZM",{"id":352,"title":353,"avatar":354,"body":355,"description":316,"email":359,"extension":326,"github":360,"meta":361,"name":360,"navigation":328,"path":362,"seo":363,"slug":360,"stem":364,"twitter":359,"website":359,"__hash__":365},"authors/authors/andretchen0.md","Andretchen0","/avatars/andretchen0.jpg",{"type":126,"value":356,"toc":357},[],{"title":316,"searchDepth":317,"depth":317,"links":358},[],null,"andretchen0",{},"/authors/andretchen0",{"description":316},"authors/andretchen0","rztGS5YNlU7jYv1laE9f863gZy-WUFK5r3uuycyiMLY",{"id":367,"title":368,"avatar":369,"body":370,"description":316,"email":374,"extension":326,"github":375,"meta":376,"name":377,"navigation":328,"path":378,"seo":379,"slug":375,"stem":380,"twitter":381,"website":359,"__hash__":382},"authors/authors/damienmontastier.md","Damienmontastier","/avatars/damienmontastier.jpg",{"type":126,"value":371,"toc":372},[],{"title":316,"searchDepth":317,"depth":317,"links":373},[],"montastier.damien@gmail.com","damienmontastier",{},"Damien Montastier","/authors/damienmontastier",{"description":316},"authors/damienmontastier","dammontastier","FqtKh6r8pBEM29DE6GhT098-LIpM3BL7RXSxFjrcwwY",{"id":384,"title":385,"avatar":386,"body":387,"description":316,"email":359,"extension":326,"github":391,"meta":392,"name":393,"navigation":328,"path":394,"seo":395,"slug":391,"stem":396,"twitter":397,"website":359,"__hash__":398},"authors/authors/franciscohermida.md","Franciscohermida","/avatars/franciscohermida.jpg",{"type":126,"value":388,"toc":389},[],{"title":316,"searchDepth":317,"depth":317,"links":390},[],"franciscohermida",{},"Francisco Hermida","/authors/franciscohermida",{"description":316},"authors/franciscohermida","chicohermida","2dGmaA2uS0w2CaErMR8BexRzx0pCgoEowV5tZcITkus",{"id":400,"title":401,"avatar":402,"body":403,"description":316,"email":407,"extension":326,"github":408,"meta":409,"name":401,"navigation":328,"path":410,"seo":411,"slug":412,"stem":413,"twitter":414,"website":415,"__hash__":416},"authors/authors/jaime-torrealba.md","Jaime Torrealba","/avatars/jaime-torrealba.jpg",{"type":126,"value":404,"toc":405},[],{"title":316,"searchDepth":317,"depth":317,"links":406},[],"solucionesinformaticasjtc@gmail.com","JaimeTorrealba",{},"/authors/jaime-torrealba",{"description":316},"jaime-bboyjt","authors/jaime-torrealba","jaimebboyjt","https://jaimetorrealba.com/","WhkdXnej1NkT__thyZfYEil3qYn8wi7qVoQSMzyfrs4",{"id":418,"title":419,"avatar":420,"body":421,"description":316,"email":425,"extension":326,"github":426,"meta":427,"name":428,"navigation":328,"path":429,"seo":430,"slug":428,"stem":431,"twitter":425,"website":432,"__hash__":433},"authors/authors/luckystriike.md","Luckystriike","/avatars/luckystriike.jpg",{"type":126,"value":422,"toc":423},[],{"title":316,"searchDepth":317,"depth":317,"links":424},[],"none","luckystriike22",{},"luckystriike","/authors/luckystriike",{"description":316},"authors/luckystriike","https://github.com/luckystriike22","vmVaU8HAY_jbVnlvpUQiwh3uPcKxGGr6B5PF9xo17X8",{"id":435,"title":436,"avatar":437,"body":438,"description":316,"email":442,"extension":326,"github":443,"meta":444,"name":445,"navigation":328,"path":446,"seo":447,"slug":443,"stem":448,"twitter":449,"website":450,"__hash__":451},"authors/authors/neoprint3d.md","Neoprint3d","/avatars/neoprint3d.jpg",{"type":126,"value":439,"toc":440},[],{"title":316,"searchDepth":317,"depth":317,"links":441},[],"drew@neoprint3d.dev","neoprint3d",{},"Drew Ronsman","/authors/neoprint3d",{"description":316},"authors/neoprint3d","drew_ronsman","https://dronsman.com","w-8rauWEJDRmX_QOi4s2PI7n9EABybGURQ-R_ss9tzo",1768600262106]