What's the next 3D Experience you want to create with Three.js together?
@liorjjj
Жыл бұрын
mouse event triggers character animation , something simple , mouse over/clicked character jump, thanks
@codecoffee1554
Жыл бұрын
This was great to watch! You explained it very clearly and straight to the point. Can you make one where you have a similar UI that has buttons which when clicked allows you to add multiple, different types of models to the scene and also to be able to select each model and drag them around? Maybe once one model touches another model some interaction occurs. Thanks for the tutorial, please do more threes and r3f!
@WawaSensei
Жыл бұрын
Ideas noted, thank you guys 🙏
@liorjjj
Жыл бұрын
@@codecoffee1554 love your idea
@tarunsukhu2614
Жыл бұрын
Third person with camera movements
@browix3114
17 күн бұрын
To anyone who is struggling with model being too close to camera, you can use component instead of from same drei package
@MuhammadHassan-l5g2d
8 ай бұрын
You are really great in terms of teaching style and approach. Keep this explaining pace🎉
@WawaSensei
8 ай бұрын
Thanks a lot 😊
@valentinkrajzelman4649
11 ай бұрын
incredible work man, this channel is going to blow up
@WawaSensei
10 ай бұрын
Thanks Valentin! 🤗
@deathmukh
7 ай бұрын
Man I love your work. Keep going, you're doing an amazing job. Thank you so much for making this so interesting and easy for us
@WawaSensei
6 ай бұрын
🥰 Thank you for the boost of motivation!
@browix3114
17 күн бұрын
Amazing tutorial. Thank you!
@alexkenway9870
Жыл бұрын
built the project with your awesome video
@WawaSensei
Жыл бұрын
Nice! With the same model or you created your own chair?
@diademkeileigabriel5408
2 ай бұрын
Could you create a tutorial on how to transform / config shapes, such as changing a ring circle into a heart shape using 3D configuration in React Three Fiber? I'm a student, and your tutorials have been incredibly helpful.
@Ryfryrice
Жыл бұрын
Great content! I've been looking for something like this for awhile now. Great demo & explanations! Thanks!
@WawaSensei
Жыл бұрын
Awesome, thank you very much 🥰 Welcome to the journey 🙌
@jayasurya00098
10 ай бұрын
Awesome videos super clearly explained!
@WawaSensei
10 ай бұрын
Glad you think so! Thanks a lot 😍
@denizorsel1029
Жыл бұрын
Liked n subbed. I loved the way you pronounce PROMISE! Have a great journey ahead!
@WawaSensei
Жыл бұрын
Awesome! Thank you! Haha, I have googled the pronunciation maybe next time I'll pronounce it correctly (but there will still be a lot of words I need to correct 🤣) Have a great journey too 🙌
@spqri3
Жыл бұрын
Awesome. I learned a lot.
@JorgeSantamariaRamos
Жыл бұрын
Very nice video! this information is so valuable. Thank you!
@WawaSensei
Жыл бұрын
You're so welcome! 🙏😊
@Dfoa12
Жыл бұрын
You are amazing, bro. Thank you to teaching us...
@WawaSensei
Жыл бұрын
Ow, thanks to you for this kind comment! It helps getting motivated 🙌
@amirnadji5427
Жыл бұрын
Very Nince. Pour le prochain topic, je suggère une vidéo sur comment gérer le passage entre plusieurs scènes (un gltf par scène) avec un système de fallback dans le suspense pour créer une sorte de loading screen et de nous montrer la manière la plus optimale pour vider les scènes au passage vers une autre scène. I will try to say it in english : can ou please show us how to manage multiple scenes (two gltf) with a loading screen when we load another scene (with suspense if it is the best way) and how can we optimize mesh and textures dispose. Thanks again for this awersome video
@WawaSensei
Жыл бұрын
Hello Amir! Could be a good tutorial, do you have any idea of what those scenes would contain?
@amirnadji5427
Жыл бұрын
@@WawaSensei may be an indoor and outdoor scene. You are in the street and when you open the door you load the scene of a store (inside the store)
@udiiiiiit5020
Жыл бұрын
Thank you❤
@WawaSensei
Жыл бұрын
Thanks to you more!
@Venkatesh-vm4ll
Жыл бұрын
Please make more project related to r3f, I subscribed your channel
@WawaSensei
Жыл бұрын
Welcome my friend! There's a lot to cover about r3f, at least 5 videos about it are coming over the coming weeks 🙏
@codingwithjuan8815
Жыл бұрын
Hey! I loved the video! Could we see how you could add an image ( a logo for example ) or some text on top of the 3d object in a way that it adapts to its shape? It would be AWESOME I've been trying to find something like this on internet and youtube and I can't find it anywhere. Thank you so much. Loved your content, you gain a new sub :)
@WawaSensei
Жыл бұрын
Hey, I think you need to add a texture to the object, it will wrap around the mesh (so to its shape) Before I cover this topic on this channel this might help you : - codesandbox.io/s/0z8i2c - docs.pmnd.rs/react-three-fiber/tutorials/loading-textures
@WawaSensei
Жыл бұрын
Oh, and thanks a lot for your kind message 😍
@codingwithjuan8815
Жыл бұрын
@@WawaSensei Thank you for your content 😁 I am already checking the links u sent me, appreciate it!
@yonjaydo2435
Жыл бұрын
great content
@WawaSensei
Жыл бұрын
🙏
@刘涛-i1r
Жыл бұрын
what is meshNormalMaterial tag vscode plugin show code ?
@WawaSensei
Жыл бұрын
Hey, you can get info on it here threejs.org/docs/#api/en/materials/MeshNormalMaterial
@salahr
6 ай бұрын
i've been looking for this for so long , thanks @wawaSensei .
@WawaSensei
6 ай бұрын
Welcome! 🙌
@krims254
Жыл бұрын
This is awesome! How hard would it be to implement a system on top of this so you can use different with slightly changed values? Trying to think about this since I'm making something similar
@WawaSensei
Жыл бұрын
Thank you! It depends on your coding/3D skills and what you want to do but you could achieve it quite easily. I will release another very similar tutorial on Friday, but this time it will be about a table configurator 🤗
@krims254
Жыл бұрын
@@WawaSensei Awesome, thanks. Can't wait!
@thetop_720
Жыл бұрын
Maybe create a tutorial with BLENDER and EXPORT to react-three-fiber thank you
@WawaSensei
Жыл бұрын
I'm planning to do one including baking texture (but keep in mind my blender skills modelling are not incredible 🤣)
@ericliss9600
Жыл бұрын
Super sweet! Loved this example. As a 3D artist with basic programming skills I think I'd stupid to not learn ThreeJS. I love how easy it is to use CSS styling in the canvas!
@WawaSensei
Жыл бұрын
Wow thank you 🙏 You're right, I think it's the perfect combo for you to create beautiful experiences! ps: based on what you said, you should like tomorrow tutorial 😊
@riyonjoshi4578
Жыл бұрын
How did u made the 3d models.. Can u do the breakdown? How both the legs came at first? Please do reply
@WawaSensei
Жыл бұрын
Unfortunately, I'm pretty low-level at Blender, I recommend you to follow Blender related channels for this. Here is my top 3 Sensei: - kzitem.info/news/bejne/z3-lvoOmpYendKw - kzitem.info/news/bejne/mIOI1aKwqot7mqw - kzitem.info/news/bejne/sYqNvGptqoeJZaA
@ManuelBenavides-tf5dc
Жыл бұрын
Thanks for the tutorial. I have problems with the rendering of the chair. It does not fully render. I have copied the code that you have shared but the chair does not load correctly. Greetings
@WawaSensei
Жыл бұрын
Hi, thank you 🙌 Join us on the discord and share screenshots + your code, we will help you! (link in the description)
@BassShot
Жыл бұрын
Great tutorial, im kinda new to react three fiber. I see you use an visual studio extension at 2:45 to automatic add the right import. Can i maybe have the name of that vs extension? Thank you.
@WawaSensei
Жыл бұрын
Thank you! It's not an extension, it's the auto-completion from VS Studio Code. Just be sure to open the root folder of your project (where package.json is) and it should automatically suggest you the right imports based on the libraries installed on your project
@jevelynrosario
Ай бұрын
Hi, is it possible to apply it using codeigniter framework?
@WawaSensei
Ай бұрын
Hey, I'm not familiar with it and is looks like it's mainly backend so it could help if you integrate a db but for the frontend you wouldn't need it
@thimethimesha8495
Жыл бұрын
This is awesome!..Do I need to know how you designed this chair?🙃
@WawaSensei
Жыл бұрын
Thank you very much! Well my Blender skills are very basic.. You can learn by following some tutorials online but you can also use free assets from poly.pizza/ for example
@thimethimesha8495
Жыл бұрын
Thank you very much sir..👀👌🥳
@francescogagliardi9383
Жыл бұрын
Thank you for the amazing tutorial! I have one question. How if i would like to switch more then 2 materials in the meshStandardMaterial property? here you use an if statement but how if i would like to use "switch case"? Thank you for you time :)
@WawaSensei
Жыл бұрын
Thanks to you for this kind comment 🙌 You have multiple options for the switch. You can do it in JS before the return, store it in a variable and use it in the render or do it directly inside the return like that: reactpatterns.js.org/docs/switch-case-operator/ (last example)
@francescogagliardi9383
Жыл бұрын
@@WawaSensei Thanks a lot. Its working :). only problem now for me is that i need to wait all the textures loads before the model shows in the scene. is there a way to load the default texture => display the model => load the other texture i will configure later? Thanks a lot for your help :)
@WawaSensei
Жыл бұрын
@@francescogagliardi9383 if you separate the textures when you export the file and load the textures manually yes You can then set a default material when it's not loaded and the texture when it is
@dansonmakeover1125
11 ай бұрын
hi sensei, would npm works for this as well? instead of using yarn.
@WawaSensei
11 ай бұрын
Hey, of course it does! I just feel yarn is faster when installing libraries, but it has no impact as long you install the correct packages 🙏
@haseebliaqat9468
6 ай бұрын
Can we integrate this into Shopify with Add to cart function?
@WawaSensei
6 ай бұрын
Yes 🙌
@haseebliaqat9468
6 ай бұрын
Do you have this functionality in your course?
@themood7907
Жыл бұрын
why stage not working it's giving me this error Uncaught Error: Maximum update depth exceeded. This can happen when a component repeatedly calls setState inside componentWillUpdate or componentDidUpdate. React limits the number of nested updates to prevent infinite loops.
@WawaSensei
Жыл бұрын
Hi, can you join the Discord (link in desc) and share a codesandbox of your project? We'll help you find what's wrong for you
@thimethimesha8495
Жыл бұрын
I am undergraduate student. I am going to do a project as my 3rd year project regarding "designing a gent's formal costume with customization". for that I need to know how to design a 3D costume model using blender. can you make a small video for how to design a costume model?🙄
@WawaSensei
Жыл бұрын
Hey, I've seen your same comment on another video I'll reply there
@raulpineda6832
Жыл бұрын
niiiiiice
@WawaSensei
Жыл бұрын
Thank you!
@deletrious
Жыл бұрын
Thanks for posting a broken project
@WawaSensei
Жыл бұрын
I Updated the project package version. Thanks a lot for noticing me the issue in a very gentleman manner 🙏
@deletrious
Жыл бұрын
@@WawaSensei No problem
@kuroisan2698
Жыл бұрын
I haven't watched the video yet, However I have a question, is this how It works ? I mean, if we take Porsche's website, are their cars 3D models, It's just they are so realistic ?
@WawaSensei
Жыл бұрын
Yes! Porsche website seems to rely on images but look at this codesandbox.io/s/lwo219 (from the same library I teach)
@Diacred
Жыл бұрын
Three Fiber more like Pedagogic Fiber!
@WawaSensei
Жыл бұрын
You're fiberous 😍
@jodev7158
Жыл бұрын
@@WawaSensei quel conseil tu nous donnes pour se perfectionner en anglais please
@WawaSensei
Жыл бұрын
@@jodev7158 Hello Jo, je dirai de passer tous tes devices en anglais (ordinateur, langue de navigateur, smartphone) et de faire les recherches en anglais + regarder du contenu anglais. En gros s'imprégner au max pour que ça vienne naturellement !
@김지훈-r9w
Жыл бұрын
Hello. I am using this lecture well in Korea. I have a question. The blender's file is much angled than the original modeling shape and appears on the screen. In this case, I wonder if I have to print it out as obj.
@WawaSensei
Жыл бұрын
Hello 🙌 I'm not sure to understand but it shouldn't be related to the export format. Did you try to shade smooth and apply the modifiers either in the export settings or manually applying them?
@canbekiroglu9905
Жыл бұрын
Can Bekiroğlu 1 gün önce @Wawa Sensei i also need to create some pricing for textures and to add extra layers or parts to selected furniture for example if that is a cupboard we can add shelves and for each of them we should increase price and for each texture we give some prices. i really need to finish this before may to get promoted so if possible if you have time i would glad
@WawaSensei
Жыл бұрын
Hello! You can join the Discord (link in the description) and ask for help when you need to :) Other developers and me will help you 🙌
@jonael123
Жыл бұрын
Using changes my position of my modell when i uppdate the page? only when i comment out the stage does my modell work i even tried disabeling controlls and adjust camera but still no luck, do you know what the issue could be?
@WawaSensei
Жыл бұрын
Hey, Stage component is done to center the model so it's not really an issue. You can just not use Stage if it's not what you need.
@jonael123
Жыл бұрын
@@WawaSensei Yes i understand but thats the problem it dosent center it haha, thanks for reply :)
@WawaSensei
Жыл бұрын
@@jonael123 You're welcome! Are you using the model from my project or one of yours? Look at the center of your object in Blender if it's one of yours. (orange dot)
@jonael123
Жыл бұрын
@@WawaSensei Thank you !!!
@qubitx64
Жыл бұрын
Very nice tutorial , BTW the demo link is down
@WawaSensei
Жыл бұрын
Thanks a lot 🙏 For the demo link I contacted Codesandbox, it's so weird...
@qubitx64
Жыл бұрын
I ran it in multiple browsers just to be sure.
@WawaSensei
Жыл бұрын
They replied to me on Twitter, it's back! Thanks a lot
@espacetalib644
Жыл бұрын
hi, for beginers what are the tools used for this purpose?
@WawaSensei
Жыл бұрын
Blender but any 3D tool can help (Spline for example)
@abydiouf3940
Жыл бұрын
Hello . I'm following your tutorial but I've run into a problem when I use the useCustomization() method: it displays this in the console "useCustomization is not a function or its return value is not iterable" and I don't know what to do as I'm a beginner in react-three-fiber. Please help me solve this problem. Note: I use the "@react-three/drei": "^9.75.0", "@react-three/fiber": "^8.13.3", "react": "^18.2.0", "react-dom": "^18.2.0", "three": "^0.153.0"
@WawaSensei
Жыл бұрын
Hi! Jump to the discord (link in description) and share a codesandbox to get some help 🙌
@canbekiroglu9905
Жыл бұрын
can we use ".max" as well? i have a model with .max so what should i do?
@WawaSensei
Жыл бұрын
Hey, sure you can use it, you need to generate a GLTF file. The documentation says it cannot generate a .gltf but an FBX, then you can convert it into .gltf (blender can do it for you for example) www.autodesk.com/support/technical/article/caas/sfdcarticles/sfdcarticles/Exporting-GLTF-format-from-3ds-Max.html
@emmanueleban1096
Жыл бұрын
possible to replace the image (3d model) with another model ?
@WawaSensei
Жыл бұрын
Hey of course it is possible! I'm showing how to do it with this model, but the same applies for any model
@emmanueleban1096
Жыл бұрын
@@WawaSensei thanks sir, will try and let you know how it goes
@urbanebachelor
10 ай бұрын
When I use the "" parameter, it brings the model ridiculously close to the viewport. I'm not finding any documentation on how to manipulate .
@WawaSensei
10 ай бұрын
Hey, you can find the different props for the Stage component herre github.com/pmndrs/drei#stage Unfortunately this tutorial is a bit "old" so depending on the version of Three + Drei you use, you don't have the exact same result than in the video
@utsavsinha334
Жыл бұрын
(drive.google.com/file/d/1u8zvkCdQE49RC82CUawjEu9OkNydwpbf/view?usp=share_link ) getting output like can anyone help me ( ) same code i am using
@werewoof4056
Жыл бұрын
try adjusting the position at or edit here
@WawaSensei
Жыл бұрын
Thanks for helping 🙌
@ilyanemihin6029
4 ай бұрын
Amazing tutorial, thanks!
@nixwebdev
6 ай бұрын
Awesome tutorial! Thank you 🔥
@WawaSensei
6 ай бұрын
Thanks to you 🫰
@alwin5995
Жыл бұрын
Hi, my floor is right in middle of the geometry.....how do i rectify that?
@WawaSensei
Жыл бұрын
Hi, are you the one who asked it on Discord? (If it's not the case come into the Discord and we'll help you 🙌)
@georgiosburnham
Жыл бұрын
Thanks to your knowledge I have been able to answer many questions. Very good explanation.
@WawaSensei
Жыл бұрын
Glad it was helpful! Thanks a lot for your comment 🙏
@liorjjj
Жыл бұрын
Man , you are Awwwwwwsome , so good, so high production value , best tutorial !!! thank you very much helped me a lot
@WawaSensei
Жыл бұрын
Wooow, thank you sooo much! 🔥 A pleasure to help 🙌
@collinsk8754
Ай бұрын
Great tutorial!
@georgiosburnham
Жыл бұрын
Hi again, at 09:00 you add and but I get the plane exactly in the middle of the geometry. I made an issue in your project in gitgub. Thanks Wawa Sensei. Note: What version of node.js did you use when you made this video?.
@WawaSensei
Жыл бұрын
Hey again, wow it's so weird, I'll answer to you on GH
@georgiosburnham
Жыл бұрын
@@WawaSensei I made some research and was the version of Node.js. I was using the last version. I had to use Node.js 16.19.0 and is OK. The thing is to find a solution with the last one. Thanks.
@WawaSensei
Жыл бұрын
@@georgiosburnham oh good, when you say the latest, it's the LTS? But I guess it's more an issue with the libraries if ever.. But you couldn't move down the plane?
@georgiosburnham
Жыл бұрын
@@WawaSensei I let you a msg in github with all the information. Maybe we can be in touch and let you know.
@เกรียงไกรเหลืองชัยปรีดา
Жыл бұрын
Try to specific the version of @react-three/drei to the same of this tutorial ^9.40.4 "@react-three/drei": "^9.40.4",
@gobajoseph5064
Жыл бұрын
Pitié revenez nous en français les chaînes de dev en anglais yen a plusieurs mais pour les francophones yen pas pas tant que ça
@WawaSensei
Жыл бұрын
Sorry... 🙏 Malheureusement ça me ferme trop de portes de rester en français. Et je pense sincèrement que c'est important en tant que dev de comprendre un minimum l'anglais pour avoir accéder à toutes les ressources et documentations sans devoir attendre des versions traduites
@HuynhLuong227
Жыл бұрын
really thanks, your skill help me very much
@WawaSensei
Жыл бұрын
Glad to hear that! Thank you for all those nice comments!
@HuynhLuong227
Жыл бұрын
@@WawaSensei really your content is amazing, i'm learning up new skill. Big thanks again.
@georgiosburnham
Жыл бұрын
This video was nice, I could say that it has helped me update certain knowledge, it would be great if you could teach us how to upload this code to the web, I did it but with some errors. the presentation on the local server is somewhat different than on the dedicated web server.
@WawaSensei
Жыл бұрын
Thank you, I'll try to upload a quick win tutorial on how to deploy it next week 🙏
@georgiosburnham
Жыл бұрын
@@WawaSensei once again, thank you.
@WawaSensei
Жыл бұрын
@@georgiosburnham hey, I just tried to deploy the repository with Vercel with default settings (touched nothing) and it worked directly chair-configurator-three-js-r3-f-tutorial.vercel.app/ Can you try deploying your project using Vercel (vercel.com/)?
@georgiosburnham
Жыл бұрын
@@WawaSenseiI just see the msg, I am going to do it tomorrow morning and let you know.
@WawaSensei
Жыл бұрын
@@georgiosburnham hey, I finally got time to record the tutorial, here it is kzitem.info/news/bejne/rIpvm3xspn6cmII
Пікірлер: 152