Controlling Blender Shapekeys using Three.js
Controlling Blender Shapekeys with Threejs: “Pariah”
Creative coding is the art of wielding programming languages as a tool for artistic exploration. It’s where logic meets aesthetics, producing digital experiences that transcend traditional software development. 🎨🚀
We use code to sculpt visuals, orchestrate sounds, and design interactive environments, pushing the boundaries of what’s possible in digital art and performance. 🎶🌐
Think of it as crafting digital experiences with code, where the output is expressive, evocative, and often unexpected. 🤯
Generative art employs algorithms and autonomous systems to produce artwork, where the artist defines the rules, and the computer generates the variations. 🌟
It’s a process of setting parameters and witnessing the emergence of complex patterns and forms, often revealing intricate and surprising results. 🤩
Essentially, we’re building systems that create art, exploring the potential of computational creativity. 🌸
p5.js (javascript/typescript): ✏️ Your friendly neighborhood sketchpad! Perfect for quick, interactive 2D visuals and learning the basics. It’s like finger painting with code, super accessible and fun! 🎉
Processing (Java): 💪 The OG creative coding powerhouse! Offers a robust environment for 2D and 3D exploration. It’s like a well-equipped art studio, with lots of tools and depth. 🌀
Three.js (javascript/typescript): 🌐✨ Dive into the 3D realm! It’s like building your own virtual reality sandbox, with stunning visuals and endless possibilities for immersive experiences. 🚀
| Feature | p5.js | Processing (Java) | Three.js |
|---|---|---|---|
| Pros | |||
| Ease of Use | Very easy, beginner-friendly | Easier than Three.js, but steeper than p5.js | Steeper learning curve, but powerful |
| Web Integration | Seamless web integration, browser-based | p5.js mode allows web integration | Designed for web, excellent performance |
| Community | Large and active community | Large and mature community | Large and growing community |
| 2D Graphics | Excellent for 2D, simple animations | Excellent for 2D, robust features | Capable, but not its primary focus |
| 3D Graphics | Basic 3D capabilities | Robust 3D capabilities | Excellent, dedicated 3D library |
| Learning Curve | Gentle | Moderate | Steep |
| Cons | |||
| Performance | Can be slower for complex 3D scenes | Java can have overhead, p5.js mode also has limitations | Can be complex to optimize for very large scenes |
| 3D Features | Limited 3D functionality | Steeper learning curve for 3D than 2D | Requires understanding of WebGL |
| Dependencies | Minimal | Java Runtime Environment (Java mode) | Requires understanding of JavaScript, WebGL, and 3D concepts |
| Development Environment | Browser based or simple text editor | Java IDEs or p5.js web editor | Requires understanding of javascript development and build tools |
Controlling Blender Shapekeys with Threejs: “Pariah”
Final Live Code
Final Live Code
Live Code
Final Live Code
Final Live Code
Final Live Code
Final Live Code
Final Live Code
Final Live Code
Final Live Code
Final Live Code