JHDD Web Design Report — 2026.08.21

The “Run Rob Run” project, with its music-reactive 3D goo, demonstrates the intricate possibilities of WebGPU-powered web experiences.

This project, alongside the techniques outlined in “Relighting Images with Depth Maps and Three.js” and the emerging “CSS Navigation Matching,” reveals a quiet but profound shift in front-end craft. The web is pushing beyond flat document displays into spatial, performance-intensive interactions, while simultaneously seeking declarative ways to manage fundamental animations. These stories illustrate a growing demand for visual richness and dynamic response, often requiring direct engagement with rendering pipelines and advanced browser features, rather than solely relying on high-level libraries. The craft of the front-end is expanding into dimensions previously exclusive to native applications, yet it also pulls back towards core CSS capabilities for specific, common transitions.

The increasing appearance of Three.js and WebGPU across these projects, such as in “Run Rob Run” and “Relighting Images with Depth Maps,” signals a maturation of web graphics that challenges prevailing notions of “performance” as merely optimizing load times. For instance, the detailed techniques behind “Run Rob Run”—custom geometry deformation, scroll-driven morphing, and damping—are not trivial. They demand deep understanding of 3D math and rendering pipelines. Many in the industry conflate performance with simply minimizing JavaScript bundle sizes or using static site generators. This view often overlooks the browser’s increasing capability for real-time, compute-heavy visual experiences. A website that renders a complex, interactive 3D scene at 60 frames per second, even with a larger initial load, can offer a far more performant user experience than a minimalist site that feels static and unresponsive. The craft involves balancing visual ambition with efficient resource utilization, often requiring mastery of lower-level APIs, leading to a richer interactive layout where typography itself might become a dynamic, spatial element.

Mainstream commentary often champions the simplicity of low-code platforms like Webflow, as seen in the “Animated Testimonial Hero” example, suggesting they democratize complex front-end work. This is a partial truth. While Webflow enables dynamic elements with GSAP, its inherent abstraction layers prevent the granular control over rendering processes that WebGPU facilitates. Projects like “Run Rob Run” are not merely complex; they are pushing the boundaries of what a browser can do without relying on external plugins or frameworks to simulate depth. They are fundamentally changing the canvas itself, influencing how designers conceive of responsive layouts and how motion design integrates with core content. Predictions suggest that by mid-2027, the gap between what is achievable with high-level design tools and what elite front-end engineers build with raw WebGPU will widen considerably, creating a two-tiered web: one of accessible, template-driven experiences, and another of highly optimized, custom-rendered digital spaces.

The opposing force resisting this deep dive into rendering craft is the persistent push for developer velocity and perceived ease of use offered by heavily abstracted platforms. The “WordPress.com Student Plan” highlights this, making web development accessible through pre-built ecosystems, emphasizing rapid deployment over bespoke performance tuning. These platforms, while valuable for specific use cases, often prioritize a streamlined authoring experience at the cost of exposing or even allowing control over the underlying performance primitives that WebGPU and advanced CSS capabilities provide.

Working web design professionals should commit dedicated time each week to understanding the core capabilities of CSS Grid and flexbox for layout beyond basic applications, and explore the declarative aspects of new CSS features like CSS Navigation Matching. Simultaneously, they should begin experimenting with WebGL or WebGPU primitives, even if it is just a simple shader, to internalize how visual performance is truly engineered at a lower level.

---

Curated References