Giter Site home page Giter Site logo

awesome-threejs's Introduction


logo

Awesome Threejs Awesome badge

3️⃣ A curated list of awesome ThreeJS resources

Contents

Core

Books

3D Theory

Creative Coding

  • The Nature of Code: Amazing book by a very funny author about a bunch of stuff to make experiences more natural based on the Processing language by @shiffman

ThreeJS

Courses

ThreeJS

  • ThreeJS Journey: A great course accessible for the most beginner programmer who wants to learn how to make ThreeJS 3D experiences from scratch. by @bruno_simon

Shaders

Articles

Documentation

3D Theory

Tutorials

Water

Generative Art

Collision detection

Inspiration

Common

  • same.energy: Visual search engine by keyword or picture (a bit like Pinterest)
  • Pinterest: Good source of inspiration

Shaders

  • ShaderToy: Prepare to be blown away by this shader sharing platform.

Videos

Shaders

Resources

Matcaps

3D assets

  • Poliigon: Assets for 3D artists (Textures, Models, HDRI)
  • Poly Haven: Public CC0 3D Asset Library (Textures, Models, HDRI)

Textures

  • 3D textures: Free PBR textures with Diffuse, Normal, Displacement, Occlusion, Specularity and Roughness Maps.
  • Arroway Textures: Digital textures for 3D rendering and real-time use.
  • ambientCG: - CC0 textures for Physically Based Rendering

GLSL Shaders

Tools

Scene Creation

  • Polygonjs: Node-based WebGL design tool, used for procedural geometry, particles, materials and animation.

3D modeling

  • Blender: Free and powerful to create your own 3D assets. A lot of export file extensions are available.
  • Houdini: To create procedural 3D assets. The free licence "Houdini Apprentice" can be used to learn (no commercial usage)
  • Spline: A promising tool for 3D modeling, collaboratively.

Materials

Cube Texture

  • HDRI-to-CubeMap: A tool to convert your HDRI file into a Cube map that can be load as a CubeTexture in ThreeJS. by @matheowis

Shaders

  • GraphToy: Powerful tool to wrap your head around and test shaping signals in GLSL by @iquilezles
  • ShaderShop editor: Visually impactful editor to work on shaping signals, by drag and dropping patterns. (Mindblowingly awesome) by @mandy3284

Sandbox

  • codesandbox: Sandbox to experiment and share with people. ThreeJS template can be easily found.
  • codepen: Found it hard to configure for ThreeJS x Typescript, but a good sandbox to try out new things.
  • threejs-editor: A nice tool to, for example, try out your Blender exports and how they will react in ThreeJS.

Hosting

  • vercel: Easy tool to host your projects, and free for a personal/hobbyist type of projects.

Libraries

Related Frameworks

React

Angular

Vue

Svelte

Physics

Collision detection

Pathfinding

Characters

  • ossos A complete character skinning & animation library for the web
  • mannequin.js Library for procedural character generation. Armature included

Demonstrations

Water

  • fft-ocean Fast Fourier Transform ocean rendering for Three.js
  • skunami.js Marvellous project with realistic water interaction
  • Shallow water Demo project that shows water ripple effect

Collision detection

Community

Core

Contribute

Contributions welcome! Read the contribution guidelines first.

Or you can reach me on Twitter:

Twitter

Related Lists

awesome-threejs's People

Contributors

kalmarv avatar johnsamilin avatar axiomecg avatar frading avatar onsummer avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.