Adventures in 3D
Adventures in 3D
  • Видео 46
  • Просмотров 138 545
Web3d Multiple Model Files
#web3d #r3f #threejs #tutorial
How to use multiple models in a react three fiber / web3d project
Просмотров: 109

Видео

Urban Atmosphere, An exercise in Post Processing and other tricks
Просмотров 2967 месяцев назад
repo: github.com/SuddenDevelopment/Webd3D-Urban-Atmosphere live demo: suddendevelopment.github.io/Webd3D-Urban-Atmosphere/ Web3D, R3f, Three.js 3D Web site theme for an urban atmosphere, using post processing and clouds simple animations go a long way too.
Instance Matrix Helper
Просмотров 1508 месяцев назад
Free tutorial for three.js react three fiber r3f, with a helper on instances. part of the procedural generation #procgen series for web3d The Man Sea Tai: seantai.dev/ The helper gist.github.com/SuddenDevelopment/417468f7c12325ae68c7669dab3aaf5a 00:00 - Start 05:04 - SEED 05:52 - 2 noise maps 07:03 - Frequency 07:30 - Noise Type 09:04 - seed (again) 10:02 - Spacing 10:38 - Min Max noise 11:42 -...
Prepare 3d objects for three.js and web3d with Blender
Просмотров 7948 месяцев назад
Use Blender to prepare your 3d objects for three,js r3f web3d 00:00 - Start 00:23 - Arrange Objects 00:59 - Parent Objects 01:34 - Parent Objects 01:42 - Limited Dissolve 02:49 - Remove Geometry 03:31 - Face Orientation 05:28 - Materials 06:31 - Parent 07:40 - Naming 08:38 - Set Origins 09:16 - Preview Online
Web3D: Inspiration from SynthCity
Просмотров 5198 месяцев назад
00:00 - Start 00:31 - SynthCity! 04:00 - How it's made 07:01 - let's make some NOISE! 09:24 - Conclusion Intro video showing the inspiring synthcity and discussing what will come of it. React three fiber | web3d synthcity: jeff-beene.com/synthcity/ synthcity code: github.com/jeffbeene/synthcity explanation: jeff-beene.com/portfolio/synthcity/ fastnoise: github.com/Auburn/FastNoiseLite 3Dialogue...
Web3D: Material Changes using React 3 Fiber
Просмотров 29010 месяцев назад
Free mini tutorial on How to allow interactively or programmatically changing materials in your react three fiber (r3f) project Web3D Home project: ruclips.net/video/1Qd9VVbEoZ8/видео.html 3Dialogue Discord Server = discord.gg/8fqZW5gF5r
Create Dpacks for Scifi Flex 2
Просмотров 16011 месяцев назад
Simple Scifi Flex 2 is a new version of a great Blender addon to generate geometry, textures and displacement maps Simple Scifi Flex 2: blendermarket.com/products/simple-scifi-pro Crayon vertex paint: blendermarket.com/products/crayon-vertex-paint-by-material-addon Brunya Dpacks: blendermarket.com/products/cyberpunkcity 00:00 - Start 00:25 - Terms 02:04 - Choose a Collection Type 04:42 - Create...
How to run run multiple animations from Blender to Web3D
Просмотров 398Год назад
Web3D Home project: ruclips.net/video/1Qd9VVbEoZ8/видео.html 3Dialogue Discord Server = discord.gg/8fqZW5gF5r In this video I show how to stash animations in Blender and play them in three.js / r3f / web3d there's a gotcha to look out for with child objects
Use vertex paint for details in Blender
Просмотров 213Год назад
Blender Vertex Paint can save you a lot of time in material editing by allowing you t add some details to objects instead of in the material. This allows some details to be independent of material. Making it reusable for multiple objects in Web3D, React 3 Fiber, Three.js it allows you to make some details without needing to rebake materials. Web3D Home project: ruclips.net/video/1Qd9VVbEoZ8/вид...
Web3D in 1 click!
Просмотров 1,3 тыс.Год назад
I made a project to make web3d as easy as possible to get started, I hope it inspires people to make some cool stuff! the only link you need is for the repo, it has the rest github.com/SuddenDevelopment/web3d 3Dialogue Discord Server = discord.gg/8fqZW5gF5r
Web3D Hype 2, Nov 2023
Просмотров 546Год назад
Web3D projects from around the community to inspire your next 3d project on the web. 3Dialogue Discord Server = discord.gg/8fqZW5gF5r games codesandbox.io/s/nvk9pf www.thequest.game/ portfolio www.brettwilliams.net/ effects alireza.com/ data vis galway-3d-dev.vercel.app/ interface codesandbox.io/s/f79ucc?file=/src/App.js tools github.com/r3f-cutter/r3f-cutter github.com/pmndrs/ecctrl modelviewe...
Blenders Asset Browser needs WORK
Просмотров 192Год назад
Blenders Asset Browser is NOT a kitbashing workflow. They only make Kitops look even better KITOPS: blendermarket.com/products/ kit-ops-pro-asset kitbashing-addon?ref=963 00:00 - Start 00:33 - Asset Browser Workflow 03:34 - Kitops Workflow 05:21 - Orientation 05:46 - Cutters 07:15 - Snapping 07:50 - Hardpoints 09:04 - Combo Inserts
WEB3D: Camera moves in R3F
Просмотров 793Год назад
the MODEL used in this video can be found in the Discord for free, OR purchased here as a kpack blendermarket.com/products/low-poly-chinese-courtyard-kpack-and-environment 3Dialogue Discord Community discord.gg/TVg6gyzyGs the code: gist.github.com/SuddenDevelopment/0ff43858eb37a1418b89de7036dc94ef 00:00 - Start 00:06 - Repo Update 00:46 - The Scene 01:08 - Goal 02:03 - Blender camera 03:07 - Code
My lighting needs help
Просмотров 112Год назад
Light Painter: github.com/semagnum/light-painter Spock: blendermarket.com/products/spock
Blender Spock + Kitops: Use KPack inserts in SPOCK
Просмотров 598Год назад
Spock: ruclips.net/video/2oDgJbE_S5s/видео.html Kpacks: blendermarket.com/products/gb-sci-fi-in-a-box-kpack blendermarket.com/products/interior-models
Create Quality DPacks that people love
Просмотров 665Год назад
Create Quality DPacks that people love
Blender Spock Addon Manual
Просмотров 921Год назад
Blender Spock Addon Manual
Web3D Tutorial: Animations
Просмотров 1,1 тыс.Год назад
Web3D Tutorial: Animations
AniMix frame by frame release walkthrough
Просмотров 404Год назад
AniMix frame by frame release walkthrough
Web3D Debugging and Tips
Просмотров 352Год назад
Web3D Debugging and Tips
WEB3D: INSTANCES ERROR ...oops
Просмотров 268Год назад
WEB3D: INSTANCES ERROR ...oops
Web3D Tutorial: Lighting
Просмотров 750Год назад
Web3D Tutorial: Lighting
WEB3D TUTORIAL-5: MATERIALS
Просмотров 1,5 тыс.Год назад
WEB3D TUTORIAL-5: MATERIALS
2023 "GO BIG" WEB DESIGN = WEB3D
Просмотров 1,3 тыс.2 года назад
2023 "GO BIG" WEB DESIGN = WEB3D
Web3d Tutorial 4: models
Просмотров 1,8 тыс.2 года назад
Web3d Tutorial 4: models
Web3D Project Breakdown: 1
Просмотров 2 тыс.2 года назад
Web3D Project Breakdown: 1
Web3D tutorial: DEVELOPERS getting started
Просмотров 4 тыс.2 года назад
Web3D tutorial: DEVELOPERS getting started
Blender to 3D website in minutes for free: Free tutorial 1, getting started
Просмотров 96 тыс.2 года назад
Blender to 3D website in minutes for free: Free tutorial 1, getting started
WEB3D TUTORIAL SERIES INTRO: for artists and developers
Просмотров 10 тыс.2 года назад
WEB3D TUTORIAL SERIES INTRO: for artists and developers
Blender Crayon: Version 2!
Просмотров 7392 года назад
Blender Crayon: Version 2!

Комментарии

  • @MatheusSilva-qm3ph
    @MatheusSilva-qm3ph 16 дней назад

    Very good! And this project(RUclips "krIoFul_Sgs?si=CynmT_TOZHCI-aGU" shows how to do that, please. I have this base (" git AriyanMLZM/threejs-react-TDesigner) but I can't get the same result. thanks.

  • @MatheusSilva-qm3ph
    @MatheusSilva-qm3ph 16 дней назад

    Very good! And this "ruclips.net/video/krIoFul_Sgs/видео.htmlsi=CynmT_TOZHCI-aGU" shows how to do it please. thanks.

  • @morerhino
    @morerhino Месяц назад

    This is EXACTLY what I need!! Please keep making videos like this!!🎉 This is awesome

    • @AnthonyAragues
      @AnthonyAragues Месяц назад

      thanks, I've done quite a bit since this one was recorded, drop by Discord if you have any questions

  • @JonathanCalkins
    @JonathanCalkins Месяц назад

    Some people are so damn smart. This works amazing!

  • @brsblend
    @brsblend 2 месяца назад

    Hello I am getting this error: Python: Trackback (last call): File ‘<frozen importlib._bootstrap>’, line 1232, in _handle_fromlist File ‘<frozen importlib._bootstrap>’, line 241, in _call_with_frames_removed File ‘C:\Users\asus\AppData\Roaming\Blender Foundation\Blender\4.2\scripts\addons\spock ectpak\__init__.py’, line 14, in <module> from .packer import SORT_AREA, SORT_PERI, SORT_DIFF, SORT_SSIDE, \ File ‘C:\Users\asus\AppData\Roaming\Blender Foundation\Blender\4.2\scripts\addons\spock ectpak\packer.py’, line 17, in <module> from scipy.spatial.transform import Rotation as RotMat ModuleNotFoundError: There is no module called ‘scipy’

    • @AnthonyAragues
      @AnthonyAragues 2 месяца назад

      hit up in the discord ch. I am coming up with a fix for the install issues but you can also try this: do you know how to open a command line with admin access? what's your blender python path? if you putt this into the python console in scripting tab it should tell you import sys print(sys.executable) from that I'll give you the commans that helped the last guy which looked like this C:\Blender\4.2\python\bin\python.exe -m pip install matplotlib --upgrade --target "C:\Blender\4.2\python\lib\site-packages" C:\Blender\4.2\python\bin\python.exe -m pip install scipy --upgrade --target "C:\Blender\4.2\python\lib\site-packages"

  • @azuldemonte4896
    @azuldemonte4896 2 месяца назад

    Could you share a link to the quick origins plugin? Thank youuu!

    • @AnthonyAragues
      @AnthonyAragues 2 месяца назад

      anthonyaragues.gumroad.com/l/QuickOrigins

  • @infinityhotdogs
    @infinityhotdogs 2 месяца назад

    finally, someone who isnt going 1000000% the speed of light!

  • @GG.3000
    @GG.3000 3 месяца назад

    I am your floating head developer at the corner! - shows your story-telling skills man. super text writing. super opener congs.

  • @laudo6503
    @laudo6503 4 месяца назад

    When I follow the steps it just gives me a Ip adreesses for web3D Experiments. Is this on purpose?? have I been Rick Rolled?

    • @AnthonyAragues
      @AnthonyAragues 4 месяца назад

      LOL you have not ben rickrolled :) I just updated everything to a newer platform, for the old instructions you can use this repo instead and the rest should be the same: github.com/benjaminmiles/react-three-vite

    • @laudo6503
      @laudo6503 4 месяца назад

      @@AnthonyAragues Thank you so much, I tried the old archived repo with github in vscode + copilot but I only saw a whole white screen. I'm currently trying to bake textures and I'll try again. My goal is to make a 3d website with an already finished model of my room to publish on AWS so I can display and animate real time sensor data from my ESP32 sensors. This will eventually be my Portfolio. If you have any more tips, that would be lovely. Ps: the hardware sensor part is already done and running with my AWS IoT

    • @AnthonyAragues
      @AnthonyAragues 4 месяца назад

      @@laudo6503 come to the Discord I'm happy to get you started

  • @epic-gaming7248
    @epic-gaming7248 5 месяцев назад

    Can you make me my website 😭

  • @animegod2474
    @animegod2474 5 месяцев назад

    Bro please can you add a way to link camera to buttons the easy way .and how unreal engine developers can use this to host their export games or virtual environments.

  • @animegod2474
    @animegod2474 5 месяцев назад

    This is amazing

  • @Tanwar_chetan
    @Tanwar_chetan 5 месяцев назад

    Just subscribed.. what a amazing channel ❤

  • @pcgames-t8p
    @pcgames-t8p 5 месяцев назад

    how to create animasion withate download in blender can you tall me pls

  • @d4veejones53
    @d4veejones53 6 месяцев назад

    Dude! This is absolute gold, I've been pulling my hair out over losing materials when exporting! I've been looking everywhere for this explaination across the web. Thank you!!

    • @AnthonyAragues
      @AnthonyAragues 6 месяцев назад

      so glad it helped. I try to make content specifically for those scenarios :)

  • @muditsingh8490
    @muditsingh8490 6 месяцев назад

    Can this be created for wordpress woocommerce please reply

    • @AnthonyAragues
      @AnthonyAragues 6 месяцев назад

      I don;t know how you want it to behave but in theory anywhere you can put a canvas you can do this.

  • @jakeburnett6763
    @jakeburnett6763 7 месяцев назад

    at 5:30, "npx gltfjsx ../public/model.glb" is put into the terminal, i have done the same (i have already done "cd src") and i get an error code "npm error code ENOENT This is realted to npm not being able to find a file" what can i do to fix this? Thanks in advance!

    • @AnthonyAragues
      @AnthonyAragues 7 месяцев назад

      if your glb is there, then you might just be missing gltfjsx, npm install it globally... feel free to drop by Discord for help

    • @jakeburnett6763
      @jakeburnett6763 7 месяцев назад

      @@AnthonyAragues thank you, i don't have a discord but i will make one now just to join, what is the npm global install code? great tutorial btw you're helping me loads

    • @AnthonyAragues
      @AnthonyAragues 7 месяцев назад

      @@jakeburnett6763 "npm install gtlfjsx --global"

    • @AnthonyAragues
      @AnthonyAragues 7 месяцев назад

      @@jakeburnett6763 some of these videos got outdated, but I can usually help people get going pretty quick through Discord

    • @og_23yg54
      @og_23yg54 3 месяца назад

      @@jakeburnett6763downgrade npm to 16 version

  • @JohanNærby
    @JohanNærby 7 месяцев назад

    I have just started with three.js recently. This is awesome and has motivated me to start with something similar. Thanks for the video! Hope to see more similar content

    • @AnthonyAragues
      @AnthonyAragues 7 месяцев назад

      come share your work on Discord! discord.gg/pegfYcpCwT

  • @CyberSecJourn
    @CyberSecJourn 7 месяцев назад

    Not sure why I got a message from you about "Unban?"

    • @AnthonyAragues
      @AnthonyAragues 7 месяцев назад

      supposed to be URBAN

    • @CyberSecJourn
      @CyberSecJourn 7 месяцев назад

      @@AnthonyAragues Ok, This is BlenderSith by the way. Was just wondering why it came over to my Cybersecurity channel

  • @Jacadasag
    @Jacadasag 8 месяцев назад

    npx gltfjsx ../public/model.glb only created a .jsx file for me? why didn't it make the .js file too?

  • @O3_arch
    @O3_arch 8 месяцев назад

    Thank you 😍

  • @gk98s
    @gk98s 9 месяцев назад

    This is the first video I watched on your channel and I'm shocked to just have noticed that you only have 1.5k subscribers, I hope and think that your channel would grow fast because you're good at talking and I somehow was able to watch a 11 minute video without skipping and being distracted. Keep up the great work

    • @AnthonyAragues
      @AnthonyAragues 9 месяцев назад

      One of the kindest comments ever. Thanks. I don’t mind the humble start. It’s pretty niche stuff. But I expect it to eventually be what sets apart amazing web experiences

  • @kugayazilim
    @kugayazilim 9 месяцев назад

    Addon Blender web addon ruclips.net/video/tQ2h7LzspKI/видео.htmlsi=JeAstfbSuHaZQh7v

  • @kugayazilim
    @kugayazilim 9 месяцев назад

    Blender web addon ruclips.net/video/tQ2h7LzspKI/видео.htmlsi=JeAstfbSuHaZQh7v

  • @TaigiTWeseDiplomat--Formosan
    @TaigiTWeseDiplomat--Formosan 9 месяцев назад

    :)

  • @sandecooking-bn2fb
    @sandecooking-bn2fb 9 месяцев назад

    Hello lest talk I have a question

  • @winodyawijegunawardhana
    @winodyawijegunawardhana 10 месяцев назад

    in my project that model.js wasn't created any reason?

    • @AnthonyAragues
      @AnthonyAragues 10 месяцев назад

      come by discord and I'll get you started, screenshots and errors help

  • @BrigitteJoseph-b8f
    @BrigitteJoseph-b8f 10 месяцев назад

    Woah i just came upon ur page and this is exciting stuff man!

    • @AnthonyAragues
      @AnthonyAragues 10 месяцев назад

      let me know how it works for you!

  • @dwbpicture
    @dwbpicture 10 месяцев назад

    Thank You for tutorial very awesome

  • @chrislanejones
    @chrislanejones 10 месяцев назад

    Thank you for making this, I have been looking for more React Three Fiber documentation.

    • @AnthonyAragues
      @AnthonyAragues 10 месяцев назад

      it's complex, there's never enough examples

  • @Gabirell
    @Gabirell 10 месяцев назад

    “ I am your floating head developer at the corner” 😂😂😂 liked and subscribed!😅

  • @malickgm507
    @malickgm507 10 месяцев назад

    Well your playlist is very helpful and addressing many issues which aren't available on yt yet. I hope you get more reach. I am having another issue which I couldn't find actually, or if you can create a tutorial about it then it will be helpful. Basically, I am trying to animate a model in fbx/gltf and I imported that animated model which I want to play that animation while scrolling only. I couldn't find a working solution and if you can help that will be really helpful

    • @AnthonyAragues
      @AnthonyAragues 10 месяцев назад

      Sure I can do a video on that

    • @malickgm507
      @malickgm507 10 месяцев назад

      @@AnthonyAragues That will be awesome. Thanks

    • @AnthonyAragues
      @AnthonyAragues 10 месяцев назад

      check this out, it uses drei scroll controls which is what I'm sure you need ruclips.net/video/pXpckHDDNYo/видео.html @@malickgm507

    • @malickgm507
      @malickgm507 10 месяцев назад

      @@AnthonyAragues I have seen this but he is animating the camera in r3f using gsap. I was trying to play animation already present in blender model on scroll. I found one example and will try that out and I am pretty sure that could work. Btw thanks for your response :)

  • @djohnworthy1040
    @djohnworthy1040 10 месяцев назад

    Amazing content<3

  • @collinsk8754
    @collinsk8754 10 месяцев назад

    Short and Clear. 👍👍

  • @rodiontref
    @rodiontref 10 месяцев назад

    Antonio, thank you for your mentorship! Good video, interesting aspects. Can I suggest you the topic of a video or a series of videos - creating some, maybe funny, spaceship configurator - a simple low-poly model, from modeling with explanations, from creating assets, preparing for export, and then implementing it in React 3 Fiber, also with explanations - what and why. Implement a stylish application that is adaptive to devices. I am sure there is a need for such content. Beginners need initial basic concepts, and even those who are little familiar with the vast amount of modern technology, to simply start doing something progressively and then, seeing your small progress, gain the courage to develop further. In any case, I continue to follow your work - your work is good and necessary! 🚀🛰🛸

    • @AnthonyAragues
      @AnthonyAragues 10 месяцев назад

      good suggestion. ? I may do that. Right now I'm working on a larger series for procedurally generated environments, but I'm also developing tools to make it easier so it's going slow

    • @rodiontref
      @rodiontref 10 месяцев назад

      @@AnthonyAragues Good luck with your development! We are waiting for the result of your creativity

  • @Jungheinz
    @Jungheinz 10 месяцев назад

    Hi, is it possible to export finished models to UE5?

  • @CatapgTV
    @CatapgTV 11 месяцев назад

    why export it in glb and auto generate a gltf, when you can export in gltf? Honest question

    • @AnthonyAragues
      @AnthonyAragues 11 месяцев назад

      glb is compressed, you can leave it as glb in gltfjsx conversion as well.

    • @CatapgTV
      @CatapgTV 11 месяцев назад

      is there any specific reason to export as glb instead of gltf from Blender? Sorry I am more of a 3D artist and not a developer, have been having issues with the model showing the materials with bugs such as glass having different types of glass properties depending of the mesh triangulation. So I want to understand if that’s because I am exporting and using gltf instead. I have an issue with big meshes basically, even if I triangulate the mesh to fix these material issues if starts showing the triangles of the mesh itself having these material artifacts

    • @AnthonyAragues
      @AnthonyAragues 11 месяцев назад

      no problem, feel free to drop by the discord for chat anytime.@@CatapgTV glb is just smaller in size so it can save in bandwodth when deployed, that's the only reason I can think of. your glass and material issues have nothing to do with glb vs gltf. you can watch the video on "Materials" in this series it might helps, but also willing to help you on Discord as you run into things

  • @captainofthewhitetower
    @captainofthewhitetower 11 месяцев назад

    Can you like intersct with an object and have widget pop up?

    • @AnthonyAragues
      @AnthonyAragues 11 месяцев назад

      yes, come bye to the discord and we can discuss

  • @francescocalvi7096
    @francescocalvi7096 11 месяцев назад

    Wow this looks awesome. Looking at similar plugins in blendermarket right now and all of them only key in meshs, ignoring everything else. If it said available for 4.0+ and had onion skinning for a larger frame range I think it would be a hands down incredible product (if not already)! I'm going to test this out today and see if everything works in 4.0 still

  • @hildajimenez9568
    @hildajimenez9568 11 месяцев назад

    Im looking forward to watch the whole series during my free time! So i hope to learn alot from you!

  • @dsfnlsadfljasjf2083
    @dsfnlsadfljasjf2083 11 месяцев назад

    thanks but the music is annoying please remove it or decrease the volume

    • @AnthonyAragues
      @AnthonyAragues 11 месяцев назад

      I started a newer easier one and it doesnt have any music: ruclips.net/video/1Qd9VVbEoZ8/видео.html

  • @realitydesigners
    @realitydesigners 11 месяцев назад

    this was amazing learned alot in this one!

  • @patrinov
    @patrinov Год назад

    This is the best 3D channel in RUclips, you deserve more followers than this…. Keep up the good work brother

  • @SpencerMagnusson
    @SpencerMagnusson Год назад

    Nice, thanks for sharing. That's brilliant for integrating the svg into the wall with the knife tool.

  • @oatmocha
    @oatmocha Год назад

    Super excited for the animation tool!

    • @AnthonyAragues
      @AnthonyAragues Год назад

      that makes sense. and theres several ways to go with it, might be several updates: Theater, something like greensock, and then playing animations int he blend file on objects. I want to start with the blend file ones because it's what I know best

  • @voidofjoy1366
    @voidofjoy1366 Год назад

    Very useful tool man 💪

  • @tousifahamed11
    @tousifahamed11 Год назад

    this is really great

  • @aiarch
    @aiarch Год назад

    this is a big leap. 👍

  • @AchHadda
    @AchHadda Год назад

    Couldn't find the repo

    • @AnthonyAragues
      @AnthonyAragues Год назад

      try this new ones please: ruclips.net/video/1Qd9VVbEoZ8/видео.html

  • @artemis3688
    @artemis3688 Год назад

    link to github repo? old isnt working

    • @AnthonyAragues
      @AnthonyAragues Год назад

      try this new one, it's simplified: ruclips.net/video/1Qd9VVbEoZ8/видео.html