✦ Intro

A visually rich, scroll-driven experience built with Webflow and Spline. This project showcases how quickly creative web experiences can come to life using no-code tools perfect for brands who want to stand out without spending months in production.

✦ Project Goal

Create a stunning 3D-centered website that captures attention instantly using interactive scrolling and motion while proving that beautiful results don't require complex code or long timelines.

✦ My Role & Tools

Role: Creative Developer Tools: Webflow, Spline, Figma (layout references), GSAP (if used for minor transitions)

✦ Process

1. 🧠 The Concept

The idea was simple: a planet earth. I wanted to create a simple and smooth landing page with the entire story unfolding through scroll.

“How long does it take to build something like this?” Just a few days. That’s the power of tools like Spline + Webflow.

⚙️ Fast Production

-Designed and animated the Earth in Spline  

- Embedded it in webflow via Spline integration  

- Built the site layout in Webflow with smooth scroll transitions  

- Added minimal interactive effects with GSAP to guide the user’s journey

3. 📦 Final Result

A one-pager that feels like a visual journey. Each scroll pulls you closer to the pulse of the planet  making it ideal for launches, campaigns, or brands who want a story-driven web presence.

✦ Why This Works

-Visually impactful with zero custom code

-Fast to build and easy to iterate

-Perfect for tight deadlines

-Endlessly creative what you design in Spline, you experience in Webflow

✦ Live Link

🔗 https://the-planet-earth.webflow.io/

✦ Final Note

This site is a quick proof-of-concept of how creative ideas can scale fast when paired with the right tools.

✦ Want a Website Like This?

I help brands and creatives build scroll-animated, interactive websites using Webflow, Spline, and custom visual features.

Whether you're launching a product or telling a story we can bring it to life fast.

👉 https://contra.com/francobeltramella

👉 View my full portfolio

🌀 Featured Interaction — Circular Slider

One key element in the site is a custom circular slider:

A rotating carousel of items placed in a circle

When a user clicks an item, the circle rotates smoothly, bringing the selected content to the front

Great for showcasing products, services, or team members in a unique, engaging way

Fully responsive and lightweight

💡 This feature combines Webflow’s CMS with custom JavaScript, offering a highly reusable interactive component for future projects.

#WebflowDeveloper #Spline3D #CreativeWebDesign #ScrollAnimation #NoCodeTools #WebflowWebsite #InteractiveDesign #WebDesignInspiration #LandingPageDesign #3DWebExperience