3DCSLogo

Creating Dynamic Visuals with Three.js

Introduction to 3D Animation and WebGL API

Three.js is a popular front-end library that uses the WebGL API to create and display animated 3D graphics in a browser leveraging the compute power of the client computer’s Graphics Processing Unit. In this post we are going to find out what Three.js is used for, how it works, and make an interactive animated Codesmith logo!

This Repo

Contains all the code needed to render the two demos discussed in the blog post. I added more code to the cube demo to show how loops, groups, and mapping can be used to more effectively "animate" a scene. Because the code is all contained in a single HTML file, clone this repo to your local machine and use your IDE to open the index.html file on Chrome. Happy coding!

Link to Article:

https://codesmith.io/blog/3d-logo-with-threejs