FABRIC8

Project Description

In a future ravaged by extreme climate change, traditional textiles have disappeared. Fabric8 is a speculative installation that imagines a world where clothing is 3D-printed from unexpected materials, and every citizen becomes their own designer. The project focuses on "Ruhrstadt", a city where metal is the primary material. Through billboard-style posters, audio narratives, QR-passports, and tangible artifacts, the work immerses visitors in a culture of radical self-expression shaped by survival and identity.

Conceptual Background

Fabric8 speculates on a post-textile society, set in 2065, where ecological and global collapse has rendered conventional fabrics extinct. In response, communities embrace different materials like metal, basalt or even coffee to 3D-print their clothes as both necessity and creative outlet. This world challenges fast fashion, mass production and passive consumption, instead proposing a future where fashion becomes personal, political, and performative.

The project draws from environmental research, speculative design tools and worldbuilding. It imagines a future that is neither fully dystopian nor utopian, but fractured, adaptive, and deeply expressive. Who we are is no longer shaped by brands, but by what we build ourselves.

Artist's Reflection

We invite viewers to reflect on what it means to dress, to express, and to survive when materials are scarce and climate dictates design. The work provokes questions about identity, sustainability, and authorship in fashion. Through ambiguity and discomfort, survival as style. We hope to disrupt assumptions and spark conversations about agency and adaptation in future worlds.

Medium & Materials

Tech Stack

This prototype is built with SvelteKit (TypeScript) on top of Vite, Three.js for the Web-GL scenes, and Tailwind CSS for the UI layer. That stack delivers hot-reload ergonomics, compile-time safety, and component-level reactivity—ideal for rapidly iterating on interactive 3D ideas. The chief challenges are asset weight and GPU budget: glTF models and PBR textures can hammer bandwidth, and managing their lifecycle without blocking the main thread or blowing up memory demands careful lazy loading, compression, and WebGL state management. Keeping SSR-friendly routing in sync with client-only 3D canvases also requires extra hydration guards, but the payoff is a future-proof, strongly-typed codebase that's easy to extend.

Why Svelte? In a 3D-heavy, animation-driven site compile-time reactivity matters: Svelte ejects its compiler output into lean vanilla JS, so there's no virtual-DOM diff cost when the canvas ticks at 60 fps. That frees CPU budget for Three.js while keeping bundle sizes modest compared with React/Next's runtime. Because SvelteKit ships file-based routing and first-class SSR by default, we still get SEO and progressive enhancement without wrestling with React hydration mismatches. In short: fewer kilobytes, fewer abstractions, smoother frames.