Best of 3D — 2024
- 1
- 2
Google Open Source Blog·2y
Google Blocks is now Open Source
Google Blocks, a tool for creating 3D objects and scenes via VR headsets, is now open source. This allows developers to use, distribute, and modify the code under the Apache 2.0 License. The existing version remains available for supported VR headsets, but the product is no longer actively developed. Enthusiasts are encouraged to innovate and develop new experiences with it.
- 3
Game Developers·1y
I created a tutorial series for learning to make RTS games (like AoE)
Learn how to create a 3D real-time strategy game similar to Stronghold Crusader and Age of Empires using the Godot engine. The provided tutorial series offers a step-by-step guide for game development enthusiasts.
- 4
Theo - t3․gg·2yI can’t believe they built this in React
The post explores the creation of an interactive 3D badge for the Vercel Ship 2024 event using React 3 Fiber, an advanced tool for rendering 3D elements in React. It breaks down the tech stack, including Blender for model preparation, React, React 3 Fiber, and React 3 Rapier for physics. The guide covers setting up a 3D environment, integrating physics, and handling user interactions, offering readers a comprehensive look into developing interactive 3D components on the web.
- 5
Wawa Sensei·2y
Make a 3D Avatar Builder w/ Threejs and React - Part 5
Part five of the 3D avatar builder tutorial series covers creating a dress from scratch using Blender and making it compatible with the existing character builder framework. It includes steps for generating thumbnails and hiding assets based on other assets, such as preventing outfits from overlapping awkwardly. The tutorial also addresses exporting the dress as a glb file, configuring materials, and ensuring the asset animates correctly. Finally, it discusses updating the UI to reflect asset compatibility constraints, enhancing the user experience by providing visual feedback for locked items.
- 6
Threejs Tips and Inspiration·2y
[ Project + Source Code] Build a Beautiful Landing Page with React Fiber & Three.js
Learn to build a stunning landing page with 3D elements using React Three Fiber and Three.js in this free course. Create a 3D DNA chain and a transparent pill, and make them interactive in the later part. Access the live demo, source code, and full tutorial video.
- 7
Threejs Award Winning Project Breakdown - Windland 3D Digital City - Source code review
Explore the detailed source code review of Windland, an immersive 3D project created with Three.js, covering components like 3D city models, post-processing effects, ambient lighting systems, and particle systems. Stay tuned for a follow-up video on building a night mode.
- 8
- 9
Godot·2y
Design of the Skeleton Modifier 3D
Godot 4.3 introduces the SkeletonModifier3D node to improve bone animation by handling it outside the AnimationMixer and eliminating the limitations of the previous pose override system. This new design ensures a consistent processing order, making complex scene management easier. Users can create custom SkeletonModifier3D nodes for specific needs and use signals to retrieve modified pose values. Future versions will include additional built-in SkeletonModifier3D nodes like IK and constraints.
- 10
freeCodeCamp·2y
Build a 3D Art Gallery with Three.js
Learn how to build an interactive 3D art gallery using Three.js. This course covers scene creation, camera setup, renderer development, geometry/material/texture creation, meshing, animation, controls, real-time UI configuration, and adding VR support.
- 11
Hacker News·2y
nmfisher
Thermion is a framework for building cross-platform 3D applications using Dart and Flutter. It divides its functionality into two packages: 'thermion_flutter' for Flutter-specific tasks, and 'thermion_dart' for general Dart applications. Key components include the ThermionViewer class for managing 3D scenes, and the ThermionFlutterPlugin and ThermionWidget for embedding 3D content within Flutter applications. Thermion supports a variety of functionalities such as scene management, rendering control, and animation.
- 12
PyImageSearch·1y
Create a 3D Object from Your Images with TripoSR in Python
Learn how to create a 3D object from a single image using TripoSR, a state-of-the-art model for fast-feedforward 3D reconstruction. This guide walks through setting up the environment, uploading and preparing the image, initializing and running the TripoSR model, and generating and exporting the 3D model. The tutorial highlights the speed and accuracy of TripoSR, processing inputs in less than 0.5 seconds on an NVIDIA A100 GPU, and its application across various fields such as e-commerce, game development, and virtual reality.
- 13
Gamefromscratch·2y
Quixel Megascans to be 100% FREE FOR EVERYONE UNTIL END OF 2024!!! ...Then Free For Nobody.
Quixel Megascans will be free for everyone until the end of 2024 when accessed through the new Epic Games marketplace, Fab. This includes textures, 3D objects, and more, available for all game engines, not just Unreal Engine. From 2025, Quixel Megascans will no longer be free, so users are encouraged to acquire assets before the deadline to retain perpetual usage rights.
- 14
Homegrown rendering with Rust
Embark Studios is developing a creative platform using Rust to enable user-generated content with advanced 3D rendering. Initially, they focused on gameplay and other essential features before diving into rendering, resulting in the creation of two renderers with modern features like ray tracing and real-time global illumination. They introduced an experimental renderer, 'kajiya,' which is open-sourced but still a work in progress. For production, they have a more robust renderer built on Vulkan API, which extends 'kajiya' features to support broader device compatibility and gameplay functionalities. The Rust-based `rust-gpu` project allows seamless GPU programming, highlighting the language's potential for future graphics and game development.
- 15
Introducing the improved ufbx importer in Godot 4.3
Godot 4.3 introduces native .fbx support through the integration of Samuli Raivio's ufbx library. This new ufbx importer replaces the need for the external FBX2glTF converter, offers better platform support, and includes numerous technical improvements. Existing projects will continue using FBX2glTF by default, but new imports will use ufbx. Several enhancements have been made to improve the import of animated characters and skeletons, aiming to address past issues. Users are encouraged to test the new importer and report any bugs encountered.
- 16
Threejs & React Avatar Builder Tutorial - Part 7: Post Processing
Learn how to add blooming post-processing effects, create smooth loading animations, and optimize GLB models for download in a 3D avatar builder using Three.js and React. Key steps include using the React post-processing library, enhancing mobile experience, creating a black loading screen with smooth transitions, and improving loading animations using React Spring. The tutorial concludes by demonstrating model optimization techniques for reducing file sizes using the GLTF transform API.
- 17
Unreal Engine 5.5!
Unreal Engine 5.5 has been released in preview with several new features. Highlights include nanite skeletal meshes for faster rendering of complex characters, significant performance improvements in Lumen for rendering, and the introduction of mega lights which enable the use of thousands of light sources in scenes. Additionally, new animation tools allow for real-time deformation and editing within Unreal Engine, and updates for chaos physics debugger and mobile UI visualization have also been included.
- 18
New to game development? This is how you ask for specific help and build valuable contacts.
Starting in game development can be daunting, but clear and specific questions can make a big difference. Define what you want to learn, introduce yourself with your background, and ask precise questions. Use available resources like Dev.Diary, Unity Learn, and Unreal Engine documentation to show your commitment and get the help you need.
- 19
Collections·2yDev Snapshot: Godot 4.4 Dev 1
Godot 4.4 Dev 1 introduces new features, including a Metal rendering backend for improved performance on Apple Silicon, 3D physics interpolation for smoother entity movements, and the Betsy GPU texture compression tool. Additional enhancements include lightmap bicubic sampling, improved string formatting, array insertion, and optimized HDR image loading.
- 20
- 21
Lun Dev Code·2y
Master 3D Click Positioning in Three.Js in 5 Minutes
Learn how to convert 2D mouse clicks into 3D object placements using Three.js. The tutorial covers setting up a canvas, capturing mouse events, converting 2D coordinates to 3D space using raycasting, and placing 3D objects based on the click position. Additional tips include ensuring the object lands correctly in the 3D environment, even if the view causes it to float momentarily.
- 22
Community Picks·2y
3D in TypeScript using Ray Casting
This post explores the concept of ray casting in a 3D perspective on a 2D map, utilizing TypeScript for implementation. The author explains the basic setup, including the HTML canvas and transforms, and how to map 2D grid coordinates to screen coordinates. The core of the post delves into the mechanics of the ray casting algorithm, involving direction vectors, linear equations, and snapping points to grid boundaries. The author also discusses various considerations, such as handling zero values in directions and remapping mouse movements to grid coordinates. Finally, a hands-on coding session demonstrates the implementation of the ray casting technique.
- 23
- 24
- 25
Dev Squad·2y
🚀 Starting Your Three.js Journey: Essential Resources for Beginners
Three.js is a powerful JavaScript library that simplifies creating 3D graphics on the web. Key resources to start learning include the official Three.js documentation, Three.js Fundamentals for beginners, Bruno Simon's in-depth course, Discover Three.js for practical projects, the GitHub repository for source code and examples, and YouTube tutorials from channels like The Net Ninja and Traversy Media. Additionally, understanding WebGL basics through MDN Web Docs can provide deeper insights into Three.js functionality.
