Build EASILY Mind-blowing 3D Portfolio Website: Tutorial (Spline + Tilda)

Рет қаралды 32,852

Күн бұрын

Join me in this comprehensive tutorial where I’ll guide you through the seamless process of building a mind-blowing interactive 3D portfolio website using the powerful combination of Spline and Tilda. Uncover the secrets to effortlessly showcase your work in a captivating and dynamic digital space that will leave your audience amazed and engaged. Get ready to take your online portfolio to the next level!
#webdesigner #webdesign #freelancewebdesigner
Use Spline for free at spline.design
Try Tilda website builder tilda.cc/
For more tutorials: @splinetool , @TildaPublishing
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
MY SOCIALS 👋 LET'S CONNECT
My Instagram: / victoria.creativelab
Tiktok: / victoria.creativelab
LinkedIn: / victoriaazarova
Buy me a coffee?☕️ : buymeacoffee.com/azarovavictoria
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
00:00 Examples of 3D portfolio websites
00:24 Intro
01:14 Start of the tutorial
05:48 Exporting of created 3D to website
07:09 Creating Tilda website
07:52 Adding 3D content to the website
08:12 3D website ideas
08:34 Outro
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Websites from the video:
1 - www.joshuas.world/
2 - www.david-hckh.com/
3 - danny-garcia.com/
4 - jesse-zhou.com/
5 - azarovavictoria.tilda.ws/
6 - wanderjaunt.thoughtlab.com/
7 - bruno-simon.com/
A big shoutout and heartfelt thanks to the generous Sketchfab creator who has shared these amazing 3D models with us for free:
ig: @etf_daniel

Пікірлер: 66

@sherdilxd 3 ай бұрын

the 3d model creation was so cool. thank you so much for showing that

@azarovavictoria 3 ай бұрын

Glad you enjoyed it :)) Yes, I love to create 3D with such tools/software and services, if you want to find alternatives, you can watch my other video about 3D software, which is very cool and easy to use or learn. kzfaq.info/get/bejne/sMuSnrJn1dHJpas.htmlsi=UdjB08pjwz0riwWD

@zero2hero4edu 8 ай бұрын

Amazing tutorial thanks for sharing creative ideas ❤ your work!

@azarovavictoria 8 ай бұрын

Such comments rise my motivation 🙏🏻🫰

@user-cj3di9jd2e 8 ай бұрын

Wow, such a big and creative tutorial. This is the first tutorial that shows how to mix tildaand 3D 🥰

@azarovavictoria 8 ай бұрын

I’m so happy you find it interesting ☺️✨

@yashshinde8185 Күн бұрын

Wow amazing I would love to create a 3d portfolio using this

@azarovavictoria Күн бұрын

I’m so glad you inspired by this video 😃👏 I’d love to see what you will create ☺️

@martinasuns 8 ай бұрын

omg this is amazing!! I always wanted to build a 3D portfolio but I was so scared of three.js and those kind of complex libraries. Thanks for the tutorial 🙌

@azarovavictoria 8 ай бұрын

Me too 😄 but then I tried Spline and I couldn’t help but tell how it can be easy 😄😄😄 I’m glad you find it helpful 😊

@alexandrav9057 8 ай бұрын

Thanks for tutorial!

@azarovavictoria 8 ай бұрын

I’m glad to share what I know 😊 and Thank you so much for support 🙏🏻🫶

@KerimNurkaliev Ай бұрын

wow, amazing 🤩

@azarovavictoria Ай бұрын

Hi 👋 thank you ☺️ I’m so glad you enjoyed it

@MannyUnchain3d 7 ай бұрын

Great content! 👏👏

@azarovavictoria 7 ай бұрын

Thank you so much ☺

@lyricalv748 Ай бұрын

I have learnt from this tutorial👍.

@azarovavictoria Ай бұрын

I'm so glad to hear this) this is amazing! 😃👍

@shaikirfan5791 4 ай бұрын

nice info will start building my own portfolio

@azarovavictoria 4 ай бұрын

Hi ☺️ I’m so glad it was helpful for you ✨ thanks for mentioning it

@ou.soufyane1179 5 ай бұрын

THanks victoria

@azarovavictoria 5 ай бұрын

Hi ) I’m glad it was useful ☺️

@ramanzhminko9748 5 ай бұрын

Hello! That's a great tutorial and you did a great job! :) Only thing that I want to say, that in the start of your video you're using (as examples) portfolio web-sites that builds with Three.js library. In my opinion it would be much fair if you'll use examples of Spline + Tilde portfolios (just to not confuse some of watchers). But again, great work on video!

@azarovavictoria 5 ай бұрын

Hello :) thank you 🙏🏻 It’s a great point 😊👍 thanks that you notice this, because when I was searching for examples and inspiration for such kind of websites I tried to select that could be made in Spline or at least very close to it :) this is more like inspiration, I should said about it 🤓

@davidmuller3768 7 ай бұрын

Wow love it! Would be great if you could share the link of the desk you used ! Need this type of desk for my project! Thx

@azarovavictoria 7 ай бұрын

Thank you so much :)) Yes, sure :) sketchfab.com/3d-models/office-a63e33a7448a49b8bb770cd5d4f2b6b1 - this is a file, but please check the license, if you're going to use for commercial use.

@Lafuerza843 5 ай бұрын

guauuuu...wonderful

@azarovavictoria 3 ай бұрын

Thank you :) I hope it was helphul for you ☺

@user-is1ou4hg6j 5 ай бұрын

Thanks dear❤

@azarovavictoria 5 ай бұрын

You’re welcome ☺️

@harshvchhabra1862 Ай бұрын

great! We can even import 3d models in Framer, so which one of is the fast when it comes to loading...:)

@azarovavictoria Ай бұрын

Thank you for the comment:) I'm glad you like it. For faster loading pay attention to the size/weight of the 2D/3D model and difficult animation + plus the size/weight of the textures, and try to compress them for "KB" 👍

@inzi786 3 ай бұрын

Wow! Appreciate the efforts on this video but I really like the city scape in the starting. do u have a tutorial on that?

@azarovavictoria 3 ай бұрын

I'm glad, I'm here for you to share what I know :) and thanks for letting me know you like it about the city: for now, I don't have because this tutorial is about the first steps, and if I added a more complex subject to create it could be frustrating for the first time and tiring. But agree, It'd be interesting to create a city, I'll think about it and maybe record such a tutorial)

@inzi786 3 ай бұрын

@@azarovavictoria u did an amazing work trust me. Yeah and I totally get ur point as well as long form content has its own battle with the views. I loved ur tutorial n hence thought it wud be great to learn from u. Bdw i am exploring this new tools wud love to get some inputs from u, hence i have sent a request on LinkedIn to connect, if we can. Once again great work.

@azarovavictoria 3 ай бұрын

@@inzi786 thank you so much ☺️ such words motivate creators to keep going and create value even more 💫 okay, I’ll check it out 😊👍

@tfdesign4072 7 ай бұрын

Hello! I am building my portfolio currently and this is literally perfect for what I want to do! Amazing tutorial. Is there anyway you could add a computer chair that can swivel with someone sat in it? oh and a lava lamp as well hahaha!! Great video!!! Please keep them coming!

@azarovavictoria 7 ай бұрын

Hi) Thank you for watching and kind words ☺ yeah! sure, you can do it, just play with states and events - these options are for creating animations and any movements) as for characters - you can create them in Spline (look at their tutorials, they have how to create a character) and lamp too - because in Spline, you can make transparent material. and set movements of blobs in the lamp

@tfdesign4072 7 ай бұрын

omg ty for replying!!!@@azarovavictoria

@azarovavictoria 7 ай бұрын

Of course ☺ @@tfdesign4072 I'm glad to help )

@gunadAgp 5 ай бұрын

Good, I love you ❤

@azarovavictoria 5 ай бұрын

Thank you ✨🙏🏻

@aymenbachiri-yh2hd 5 ай бұрын

thank you

@azarovavictoria 5 ай бұрын

I’m glad it was helpful 😊

@olgazaitseva7202 6 ай бұрын

😍🤩❤👍

@azarovavictoria 6 ай бұрын

Thank you ☺️✨

@dila002 4 күн бұрын

can you bring full course from this?

@azarovavictoria 4 күн бұрын

Thank you for your comment:) Yeah, I'll consider creating a longer and more detailed video in the future. For now, I have this video, the whole process of creating a 3D website, that maybe can be useful for you: kzfaq.info/get/bejne/ecBja6eD3tvenWQ.htmlsi=z_DtvgU7Q4XhyCoL

@user-ee7hl8nd7o 5 ай бұрын

like it

@azarovavictoria 5 ай бұрын

Thank you 😊 I’m glad it was helpful

@griffinkirkland9087 7 ай бұрын

can I setup this model on React or NextJs

@azarovavictoria 7 ай бұрын

I think yes, in spline there are several options for export 3D model :)

@rafamusical 7 ай бұрын

Please teach meeee ❤

@azarovavictoria 7 ай бұрын

hi, thanks for watching😊 to teach what?)

@seekknowledge1928 7 ай бұрын

Can I host the website in my own hosting?

@azarovavictoria 7 ай бұрын

Hi:) thanks for watching) This can be embedded as HTML snippet into any website, so hosting shouldn’t be matter 😉

@aarohikumari6252 3 ай бұрын

Add html option isn't there how am i gonna add then

@azarovavictoria 3 ай бұрын

Hi :) In what website builder are you trying to add 3D model from Spline?

@techbot-talks 7 ай бұрын

hey can you send me the source code of the 3d model pls?

@azarovavictoria 7 ай бұрын

Hi) thanks for watching) if you mean to see this file that i use in the video as an example so here it is (but remember that you should consider license of 3D objects) - app.spline.design/file/dc12a3aa-ea79-4bca-b178-b83dbf7dea86

@MICS19 Ай бұрын

These websites you are showing are not created by spline

@azarovavictoria Ай бұрын

Hi) Yes, and I'm not saying that, these are just examples of websites where 3D components were used, and for inspiration 👍 then you turn on your imagination and using Spline create your version of a 3D portfolio website 😉

@YorickPenninks 6 ай бұрын

Sorry, but I have difficulty to understand your English

@azarovavictoria 6 ай бұрын

Hi) Yes, I'm not a native English speaker, and it's not perfect, But the process is so simple, so you can learn at least something just by watching the process, of find another video 🤗

@YorickPenninks 6 ай бұрын

@@azarovavictoria I try my best 😇👌🏼

@azarovavictoria 6 ай бұрын

@@YorickPenninks if you will get any questions during the process you can ask, I'll try to help 👍