CINXE.COM
Marco Gomez (@TheCodeTherapy) - WebGL Portfolio & Lab
<!DOCTYPE html><html lang="en"><head><meta charSet="UTF-8"/><meta name="viewport" content="width=device-width,initial-scale=1"/><link rel="apple-touch-icon" href="/apple-touch-icon.png"/><link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"/><link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png"/><link rel="icon" href="/favicon.ico"/><title>Marco Gomez (@TheCodeTherapy) - WebGL Portfolio & Lab</title><meta name="robots" content="index,follow"/><meta name="description" content="Marco Gomez (@TheCodeTherapy) - WebGL Portfolio & Lab."/><meta name="twitter:card" content="summary_large_image"/><meta name="twitter:site" content="@TheCodeTherapy"/><meta name="twitter:creator" content="@TheCodeTherapy"/><meta property="og:title" content="Marco Gomez (@TheCodeTherapy) - WebGL Portfolio & Lab"/><meta property="og:description" content="Marco Gomez (@TheCodeTherapy) - WebGL Portfolio & Lab."/><meta property="og:image" content="https://mgz.me/assets/thumbnails/mgz.jpg"/><meta property="og:image:alt" content="Marco Gomez (@TheCodeTherapy) - WebGL Portfolio & Lab"/><meta property="og:image:type" content="image/gif"/><meta property="og:image:width" content="1024"/><meta property="og:image:height" content="1024"/><meta property="og:locale" content="en"/><meta property="og:site_name" content="mgz.me"/><meta property="keywords" content="TheCodeTherapy, Marco Gomez, WebGL, ThreeJS, NextJS, React, shaders, GLSL, javascript, demoscene, mgz.me"/><meta name="next-head-count" content="22"/><script async="" src="https://www.googletagmanager.com/gtag/js?id=UA-169314453-1"></script><script>window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'UA-169314453-1', { page_path: window.location.pathname, });</script><link data-next-font="" rel="preconnect" href="/" crossorigin="anonymous"/><link rel="preload" href="/_next/static/css/09671da28aa56a04.css" as="style"/><link rel="stylesheet" href="/_next/static/css/09671da28aa56a04.css" data-n-g=""/><noscript data-n-css=""></noscript><script defer="" nomodule="" src="/_next/static/chunks/polyfills-78c92fac7aa8fdd8.js"></script><script src="/_next/static/chunks/webpack-edb2c4a2f993b241.js" defer=""></script><script src="/_next/static/chunks/framework-64ad27b21261a9ce.js" defer=""></script><script src="/_next/static/chunks/main-fdaa1ee0a0da5110.js" defer=""></script><script src="/_next/static/chunks/pages/_app-e5b0d1bc4a1b4a04.js" defer=""></script><script src="/_next/static/chunks/962-e60f5ac397ddcfd8.js" defer=""></script><script src="/_next/static/chunks/pages/index-c58ad3c38bd14ff1.js" defer=""></script><script src="/_next/static/muC72ZvF1QV4vWLtMoECr/_buildManifest.js" defer=""></script><script src="/_next/static/muC72ZvF1QV4vWLtMoECr/_ssgManifest.js" defer=""></script></head><body><div id="__next"><div id="asset_loader_wrapper" class="asset-loader-wrapper"></div><div id="rec_wrapper" class="rec-wrapper"></div><div id="app_root"><div class="top-bar plain"><div class="loading-bar" id="loading_bar"></div></div><div class="main-contols-wrapper" style="height:70px;line-height:70px"><div class="toggler-wrapper" style="width:70px;height:70px"><i class="fa-thin fa-power-off"></i></div><div class="control-buttons"><div id="load_audio_button" class="button fa-thin fa-circle-play inactive" style="color:#CCCCCC;text-shadow:none;animation-delay:0s;cursor:default"><span class="tooltip--triangle load_audio" data-tooltip="I'm Audio-reactive! Try my Jam 馃槂"></span></div><div id="first_scene_button" class="button fa-thin fa-circle-chevron-up inactive" style="color:#CCCCCC;text-shadow:none;animation-delay:0.12s;cursor:default"><span class="tooltip--triangle first_scene" data-tooltip="Rewind to First Scene"></span></div><div id="prev_scene_button" class="button fa-thin fa-circle-chevron-left inactive" style="color:#CCCCCC;text-shadow:none;animation-delay:0.24s;cursor:default"><span class="tooltip--triangle prev_scene" data-tooltip="Load Previous Scene"></span></div><div id="next_scene_button" class="button fa-thin fa-circle-chevron-right inactive" style="color:#CCCCCC;text-shadow:none;animation-delay:0.36s;cursor:default"><span class="tooltip--triangle next_scene" data-tooltip="Load Next Scene"></span></div><div id="rand_scene_button" class="button fa-thin fa-shuffle inactive" style="color:#CCCCCC;text-shadow:none;animation-delay:0.48s;cursor:default"><span class="tooltip--triangle rand_scene" data-tooltip="Load Random Scene"></span></div></div></div><div class="main-menu-wrapper" style="width:50vw;left:calc(100vw + 21px)"><div id="menu_toggler" class="togglebutton" style="width:70px;height:70px" role="presentation"><div role="presentation"><svg class="ham ham3 " viewBox="0 0 100 100" width="70px"><path class="ham-line top" d="m 30,33 h 40 c 13.100415,0 14.380204,31.80258 6.899646,33.421777 -24.612039,5.327373 9.016154,-52.337577 -12.75751,-30.563913 l -28.284272,28.284272"></path><path class="ham-line middle" d="m 70,50 c 0,0 -32.213436,0 -40,0 -7.786564,0 -6.428571,-4.640244 -6.428571,-8.571429 0,-5.895471 6.073743,-11.783399 12.286435,-5.570707 6.212692,6.212692 28.284272,28.284272 28.284272,28.284272"></path><path class="ham-line bottom" d="m 69.575405,67.073826 h -40 c -13.100415,0 -14.380204,-31.80258 -6.899646,-33.421777 24.612039,-5.327373 -9.016154,52.337577 12.75751,30.563913 l 28.284272,-28.284272"></path></svg></div></div><div class="main-menu" role="presentation" style="width:50vw;left:calc(100vw + 21px)"><div class="main-menu-links-wrapper"><div class="main-menu-row main-menu-row-invisible" style="transition-delay:0s"><div class="main-menu-item-wrapper main-menu-item-wrapper-invisible" style="transition-delay:0s"><div class="menu-home-link"><div class="main-menu-item"><i class="main-menu-item-icon fa-thin fa-house"></i><span class="main-menu-item-label">Home</span></div></div><div class="main-menu-separator-line main-menu-separator-line-invisible" style="transition-delay:0s"></div></div></div><div class="main-menu-row main-menu-row-invisible" style="transition-delay:0s"><div class="main-menu-item-wrapper main-menu-item-wrapper-invisible" style="transition-delay:0s"><a href="/about/"><div class="main-menu-item"><i class="main-menu-item-icon fa-thin fa-user-tag"></i><span class="main-menu-item-label">About</span></div></a><div class="main-menu-separator-line main-menu-separator-line-invisible" style="transition-delay:0s"></div></div></div><div class="main-menu-row main-menu-row-invisible" style="transition-delay:0s"><div class="main-menu-item-wrapper main-menu-item-wrapper-invisible" style="transition-delay:0s"><a href="/gallery/"><div class="main-menu-item"><i class="main-menu-item-icon fa-thin fa-rectangle-history"></i><span class="main-menu-item-label">Gallery</span></div></a><div class="main-menu-separator-line main-menu-separator-line-invisible" style="transition-delay:0s"></div></div></div><div class="main-menu-row main-menu-row-invisible" style="transition-delay:0s"><div class="main-menu-item-wrapper main-menu-item-wrapper-invisible" style="transition-delay:0s"><a href="/awards/"><div class="main-menu-item"><i class="main-menu-item-icon fa-thin fa-trophy"></i><span class="main-menu-item-label">Awards</span></div></a><div class="main-menu-separator-line main-menu-separator-line-invisible" style="transition-delay:0s"></div></div></div><div class="main-menu-row main-menu-row-invisible" style="transition-delay:0s"><div class="main-menu-item-wrapper main-menu-item-wrapper-invisible" style="transition-delay:0s"><a href="/contact/"><div class="main-menu-item"><i class="main-menu-item-icon fa-thin fa-envelope"></i><span class="main-menu-item-label">Contact</span></div></a><div class="main-menu-separator-line main-menu-separator-line-invisible" style="transition-delay:0s"></div></div></div></div></div></div><section class="route-section"><div class="route-inner"><div class="main"><div class="content"><div class="home-page"><h1>mgz.me</h1><h2>Marco Gomez (@TheCodeTherapy) - WebGL Portfolio & Lab</h2><h3>Tech Lead - Senior Software Engineer - Computer Graphics - WebGL - WebGPU</h3><p>Hi! My name is Marco Gomez (AKA<!-- --> <a href="https://x.com/TheCodeTherapy" target="_blank" rel="noopener noreferrer">@TheCodeTherapy</a>) and I'm a Tech Lead and Senior Software Engineer based in Leeds, United Kingdom. My main area of expertise is 3D Engineering focused on Creative Development and Interactive Immersive experiences. Check out my work! #ComputerGraphics #WebGL #WebXR #WebGPU #Demoscene #CreativeCoding #InteractiveDevelopment #TechLead</p><img src="/assets/images/thumb.jpg" alt="Marco Gomez (@TheCodeTherapy)"/><ul><li><a class="home-page-links" href="/scenes/GlassCircuit/">GlassCircuit</a></li><li><a class="home-page-links" href="/scenes/Patterns/">Patterns</a></li><li><a class="home-page-links" href="/scenes/TurbulentLight/">TurbulentLight</a></li><li><a class="home-page-links" href="/scenes/VinylAndParticles/">VinylAndParticles</a></li><li><a class="home-page-links" href="/scenes/SpaceWaves/">SpaceWaves</a></li><li><a class="home-page-links" href="/scenes/TheCity/">TheCity</a></li><li><a class="home-page-links" href="/scenes/CosmicClouds/">CosmicClouds</a></li><li><a class="home-page-links" href="/scenes/The80sOnASCIID/">The80sOnASCIID</a></li><li><a class="home-page-links" href="/scenes/WetFuzzyDisco/">WetFuzzyDisco</a></li><li><a class="home-page-links" href="/scenes/ISeeSound/">ISeeSound</a></li><li><a class="home-page-links" href="/scenes/Amiga/">Amiga</a></li><li><a class="home-page-links" href="/scenes/Swarm/">Swarm</a></li></ul><p>Voronoi noise, Cube camera, GPGPU, Plexus Particles, Procedural Terrain, glTF 3D Model, Perlin Noise Terrain, ASCII Post Processing, Lights and God Rays, Fast Fourier Transform, Amiga Demoscene, Boids, Gaussian Grain</p><a class="home-page-links" href="/">Home</a><a class="home-page-links" href="/about/">About</a><a class="home-page-links" href="/gallery/">Gallery</a><a class="home-page-links" href="/awards/">Awards</a><a class="home-page-links" href="/contact/">Contact</a><p>TheCodeTherapy, Marco Gomez, WebGL, ThreeJS, NextJS, React, shaders, GLSL, javascript, demoscene, mgz.me</p></div></div></div></div></section><div class="footer"><div class="copy"><span class="copy-symbol">漏</span> <a href="https://x.com/TheCodeTherapy" target="_blank" rel="noopener noreferrer">Marco Gomez<!-- --> (@TheCodeTherapy)</a> <!-- -->2024</div></div></div></div><script id="__NEXT_DATA__" type="application/json">{"props":{"pageProps":{}},"page":"/","query":{},"buildId":"muC72ZvF1QV4vWLtMoECr","nextExport":true,"autoExport":true,"isFallback":false,"scriptLoader":[]}</script></body></html>