Design to Development Conversion from Figma to Framer

Website Development, CMS Implementation, Responsive Design

Marcon has been engineering and fabricating structural solutions across North America for over 40 years. In 2025, they sought to elevate their digital presence to match the precision of their metal fabrication. With operations spanning Washington State and British Columbia, they needed a platform that could showcase both their infrastructure expertise and their artistic approach to urban furniture. Tomorrow approached studio inndio to bring their sophisticated designs to life in Framer.

Marcon's work speaks for itself through impressive engineering feats like Canada's largest bascule bridge and beautiful public spaces enhanced by their Milieu™ urban furniture line. That's why Tomorrow emphasized photography-forward presentation, using a magazine-style layout to let these accomplishments take center stage.

inndio became the technical partner for Tomorrow, taking their creative vision and executing a comprehensive development strategy that included:

Building a component-based design system from the ground up in Framer

Implementing an integrated content management system with full SEO control

Developing responsive layouts that maintain design integrity across all devices

Creating custom filtering functionality for intuitive portfolio navigation

Engineering subtle animations and transitions that enhance user experience

The result is a fully-functional digital platform that allows Marcon to effectively showcase and manage their growing portfolio of infrastructure and urban furniture projects.

Wanting to honor the craftsmanship inherent in Marcon's work, inndio meticulously preserved Tomorrow's magazine-style layout with its emphasis on photography throughout the development process.

The custom filtering system allows visitors to explore Marcon's diverse capabilities across bridges, highways, public art, and bespoke urban fixtures. This functionality is complemented by a full-page menu system that enhances navigation without distracting from the content itself.

From massive infrastructure projects like the Lions Gate Bridge to custom-designed urban furniture, every element is presented with clarity and sophistication—reflecting the same attention to detail that Marcon brings to their physical fabrication work.

Instead of compromising on image quality, inndio leveraged Framer's image optimization techniques to maintain visual impact while ensuring fast loading times. The team developed custom code layout components to build on top of Framer's capabilities, resulting in a responsive design that adapts seamlessly across desktop, tablet, and mobile devices while preserving the magazine-style aesthetic at every breakpoint.

This approach enabled inndio to bring Tomorrow's vision to life while giving Marcon a platform that can grow with their business, showcasing new projects and capabilities as they continue to innovate in metal fabrication.

The Framer platform with inndio's custom implementation provides the Marcon team with intuitive content management tools they need to maintain their digital presence. The simple-to-use interface enables easy updates so the Marcon team can continuously refresh their portfolio as they complete new infrastructure projects and urban furniture installations.

This sustainable approach ensures Marcon's digital presence remains as current and impressive as their physical work, without requiring ongoing developer intervention for content updates.

The final website creates a perfect alignment between Marcon's physical craftsmanship and digital presentation, allowing their team to showcase how they've been solving engineering challenges in North America for over 40 years while highlighting their artistic approach to elevating public spaces through metalwork.

Through this successful collaboration between Tomorrow and inndio, Marcon now has a digital platform that matches the quality, precision, and integrity of their renowned metal fabrication work.