Webflow Embed
April 8, 2021
.gif)
Embed 3D Spaces in Webflow
Over the years, building websites has become a juggernaut of an industry. Nowadays, as we all know, creating amazing websites is not just limited to software developers or even professional UX/UI designers. New tools and CMS platforms let literally anyone build amazing web experiences without having to write one line of code.
Under the umbrella of CMS tools, the needs of creatives keep getting more and more nuanced and specific. The companies building these tools are constantly looking for ways to give their users the ability to create as many custom experiences as possible—for example, various ways to integrate and interact with 3D visualizations—while also keeping the creative process simple, accessible, and user-friendly.
Webflow is a great example of such a platform. In their own words: “Webflow empowers designers to build professional, custom websites in a completely visual canvas.” As designers use the tool, it generates code automatically. Webflow makes interaction design and storytelling easier than ever, allowing you to tell imaginative and compelling stories with scrolling and 3D navigation, which can be difficult to build from scratch.
This is good news for professionals interested in creating delightful experiences around interior space. With Webflow, you can integrate your interactive web experiences with captivating 3D space visualizations—such as custom animations and guided walkthroughs—along with all your other branded content.
For Archilogic, this is huge! So, we gave it a shot.
Built With Archilogic - An Interactive Interior Space Walkthrough Using Webflow
As you may know, 3D navigation on websites can be technically challenging. Our Webflow Embed solution lets you trigger Archilogic bookmarks within a Webflow section. This allows you to create a guided walkthrough via scrolling. This prototype shows you an example of what’s possible.
Using an iframe, you can now seamlessly embed Archilogic building models into Webflow and tell the full story of your space that you want to tell. Bring in other animations, overlay bold text, and showcase branded content to your clients in a dynamic and interactive way.
You don’t need to be a software developer to take advantage of these tools. Just copy the Embed code from the “Share” menu in your Archilogic model and paste it into your Webflow site. It’s as simple as that! For more detailed information check out the 3D embed API guide
By utilizing Archilogic’s built-in iframe embed code, it’s never been easier to create engaging digital space experiences like this interactive walkthrough website, which gives designers the ability to present 3D space as responsive web content.
Check out the Webflow Embed Demo.