Moldsid — Digital Experience for Manufacturing
A contemporary industrial presence built around a real interactive 3D product
UX/UI Design + Frontend
2-person studio + client team
2026 · Launched
Next.js, React, Three.js, Blender, Lenis
Content architecture, Visual system, 3D interaction, Frontend
Industrial capability was not visible online
The company had decades of technical experience but no current digital presence. Prospective clients had no clear way to understand its capabilities, services, or working process before starting a conversation.
The goal was to build an experience that communicated precision and scale without becoming another generic industrial catalog.
Contemporary without losing technical credibility
The visual language needed to feel advanced while staying direct for an industrial audience. Complex services needed clear explanation, contact paths had to remain visible, and the experience had to work across devices with very different capabilities.
The central tension appeared in the hero: the most expressive differentiator could also become the most expensive part of the page to render.
Technology needed to explain the product, not compete with it.
Structure before spectacle
I began with content architecture: capabilities, services, process, evidence, and contact. Industrial references helped establish category expectations and find a clearer way to present technical information.
The structure supports both visitors who need a direct route to a quote and those who need to understand the company before making contact.
Turn a physical product into the interface
Show instead of describe
The team chose an interactive 3D product over the initial video direction so visitors could understand how the object is assembled.
Build a real asset pipeline
The CAD file was reviewed, exported, separated in Blender, and prepared as organized web geometry for Three.js.
Coordinate layers through motion
Model, copy, and background move as independent layers while the exploded view reveals the product progressively.
Expose the trade-off
The 3D experience adds differentiation but also creates a real performance cost, especially on lower-powered mobile devices.
Expression with known constraints
Wide hierarchy, technical composition, controlled motion, and reusable modules establish the visual direction. Service pages share a common structure while retaining room for their specific processes.
Some client-selected color combinations introduce contrast limitations. The constraint was documented, and functional surfaces remain an area for continued accessibility improvement.
The browser changed the design
I built the website with React and Next.js, organizing services, capabilities, process, and calls to action as reusable components. I also integrated Lenis and the Three.js sequence.
Implementation changed spacing, pacing, and model scale from the initial static compositions. The final experience had to respond to actual browser behavior, not just a design frame.
A published digital foundation
The company now has a live website that presents its services, capabilities, process, and contact routes through one coherent system. Stakeholders approved the direction and felt it represented the organization more accurately.
There is not yet enough evidence to attribute conversions, new leads, or commercial outcomes to the redesign.
Ambition creates a technical obligation
- →An advanced interaction needs to justify its implementation cost.
- →Working with real industrial assets creates a more authentic story than generic media.
- →A bold proposal also creates an obligation to optimize and maintain it.
- →Stakeholder approval validates direction, not user or business impact.
Sports Streaming Platform
