4 Steps To Create An Immersive 3D Website
4 tools, 4 steps + Freebies as always
Hello gents and gentesses, hope everyone is feeling excited about life at the moment.
Now, the numero uno question I’m getting at the moment is:
“How do you create a 3D website?”
People ask about all sorts from tools, process and more.
So, here we go.
Check out the website here:
4 Steps To Create An Immersive 3D Website
Assets here:
1) Ideation - FIGMA
I like to play in Figma just to try out some layouts and have a play.
2) 3D Asset Design - SPLINE
Designing the asset in Spline gives you the foundation for your project. Without all the assets, how are you going to know how your asset will look on the page? What different parts of the asset might inspire the design? What are the key features you want to highlight of your asset which you might want to focus on?
3) Web Design - RELUME
In Relume, you can create a wireframe rapidly and use this for the base of your project. If you can, I recommend exporting this wireframe back to figma for finessing. Good to use this as a base rather than the final design.
4) Web Development - WEBFLOW
I like to develop in Webflow just because it’s my preferred platform but Spline works in Framer and other tools too.
Copy and paste in the sections from Framer, edit the styleguide, upload your fonts and your off at the races.
Will need to record a video on this section because this is certainly the most complicated.
25 Best Spline 3D Website Examples
Last week, I shared this video which you all seemed to enjoy.
If there’s any 3D websites missing from this that should be on here, let me know!
Hasta pronto y’all,
Jack