Designing a 3D website with Spline and Framer

Designing a 3D website with Spline and Framer

Hi! In this tutorial, you will learn how to create a 3D website using a 3D glass scene made in Spline and integrate it into Framer (web builder) to create and publish a fully functional website.
Check Spline: https://spline.design/
Demo Site: https://healthy-others-546063.framer.app/
Follow Spline: https://instagram.com/splinetool/

#designing#website#spline#framer#3d#3d design#web design#3d web#figma#web development#web dev#3d website#ui#ui design#ux design#tutorial#3d modeling#interactive 3d#tutorial-interaction#tutorial-product

What you'll learn

  • 0:00Introduction
  • 0:33Creating the spheres
  • 1:40Adding the materials
  • 2:52Making the glass
  • 7:50Exporting the 3D scene from Spline
  • 8:26Importing the 3D scene into Framer

Overview

Spline 3D
13min
Beginner
Similar Tutorials
Spline V2 Full Tour: New Layout, Faster Creation, Agent Workflow

Spline V2 Full Tour: New Layout, Faster Creation, Agent Workflow

Video9minBeginner
Build Interactive Animations: Morphing UI & Reactive Glow in Hana (Step by Step)

Build Interactive Animations: Morphing UI & Reactive Glow in Hana (Step by Step)

Video13minBeginner
How to add a 3D Drag & Drop interaction in Spline | Level up your website in just a few clicks

How to add a 3D Drag & Drop interaction in Spline | Level up your website in just a few clicks

Video4minBeginner