UV unwrap method(s)

I am pretty hesitant to ask for this because i know most people do this in Blender, but i have this fantasy of creating generative ‘art’ in Babylon so it would be extremely helpful.
Been struggling with writing a Box projection myself but with very limited succes :wink:

I’ll let my artificial assistant answer your question: :wink:

Creating generative art in Babylon.js is definitely possible and can be a rewarding experience! While many people may use Blender for 3D modeling and rendering, Babylon.js offers a powerful JavaScript framework for creating interactive 3D experiences directly in the browser.

To help you with your box projection in Babylon.js, let’s break down the process into steps:

  1. Setting up the scene: Start by setting up the Babylon.js scene with the necessary components. This includes creating a canvas element in your HTML file and initializing a Babylon.js engine.
  2. Creating a box mesh: Use Babylon.js to create a box mesh. You can specify the width, height, and depth of the box according to your desired dimensions.
  3. Creating materials: For box projection, you’ll need six different materials, each representing one face of the box. You can create these materials using the Babylon.js StandardMaterial class or other appropriate material types. Assign unique textures or colors to each material to differentiate the faces.
  4. Applying materials to box faces: Assign the materials you created to the corresponding faces of the box mesh. You can access the individual faces of the box using their indices.
  5. Setting up the camera: Position and orient the camera in the scene to capture the desired projection of the box. You can use Babylon.js camera classes like ArcRotateCamera or FreeCamera to control the camera movement and viewpoint.
  6. Rendering the scene: Finally, render the scene using the Babylon.js engine you initialized earlier. This will display your box projection in the canvas element on your webpage.

Remember, the above steps provide a high-level overview, and you’ll need to write the code to achieve each of these tasks. The Babylon.js documentation (https://doc.babylonjs.com/) is an excellent resource that provides detailed examples, guides, and API references to help you implement specific features.

Additionally, there are various Babylon.js tutorials, forums, and communities available online where you can seek further assistance or inspiration for your generative art project. Don’t hesitate to explore and experiment with different techniques and effects to achieve the desired visual output.

Good luck with your generative art project in Babylon.js!

Hey chatGPT, give me some examples of “generative art”, please

Certainly! Generative art refers to artwork that is created using algorithms, mathematical equations, or procedural methods. It often involves the use of randomness and parameterization to generate unique and unexpected visual outcomes. Here are a few examples of generative art:

  1. Fractals: Fractals are self-repeating geometric patterns that exhibit intricate detail at various scales. Artists can use algorithms like the Mandelbrot set or Julia set to generate visually stunning fractal images.
  2. Algorithmic Drawings: Using algorithms and mathematical equations, artists can create intricate and complex drawings that evolve over time. These drawings may be based on geometric shapes, curves, or patterns that are manipulated programmatically.
  3. Data Visualization: Generative art can be used to visualize data in creative ways. By mapping data points to visual elements, such as colors, shapes, or movements, artists can create captivating representations of complex datasets.
  4. Particle Systems: Artists can use particle systems to simulate the behavior of individual particles, such as fire, smoke, or water. By applying rules and forces to these particles, unique and dynamic visual effects can be generated.
  5. Procedural Textures: Instead of manually creating textures, artists can use algorithms to generate textures procedurally. This allows for the creation of intricate and unique textures that can be applied to 3D models or used in 2D artworks.
  6. Generative Typography: Artists can explore generative techniques to create unique and expressive typography. By defining rules and parameters, letterforms can be generated algorithmically, resulting in visually striking and unconventional type designs.
  7. Interactive Installations: Generative art can be combined with interactive elements to create immersive installations. By incorporating sensors, cameras, or user input, the artwork can respond and adapt to the environment or the audience’s actions in real-time.

These examples just scratch the surface of the possibilities in generative art. The field is vast and continually evolving, with artists pushing the boundaries and experimenting with new techniques and technologies to create visually compelling and conceptually rich artworks.

Here are some works of the members which can be declared as “generative art”:

“Balloon knitting” by Avin Lambrero | Babylon.js Playground (babylonjs.com)

volumetric Light | Babylon.js Playground (babylonjs-playground.com)

Particle Container/Collider | Babylon.js Playground (babylonjs-playground.com)

HEX Spehre | Babylon.js Playground (babylonjs-playground.com)

and many other examples…

1 Like

The examples from Blender are way better …
I’m on a mission and it’s going to take me a lot of time i know.
What I think of as generative ( let’s forget about the ‘art’ bit for a sec ), is that when the script starts running you will not know the outcome beforehand. It’s will be different every time ( think throwing dice ).
Hence i am kinda doomed to getting to understand the basics of what is possible in BABYLON.js to be able to define events that might happen in a scene instead of importing assets from Blender. That is why i was interested in your perlin stuff for instance. In the past i have been making 2D stuff …
in case you’re interested look here, now i want to make things that are animated … evolve …
We’ll see.

Thanks for your help so far @CodingCrusader :slight_smile:

I like abstract art and your calm music composition is very nice.

There are far better examples created with babylon.js. Check out the demos on the homepage:
Babylon.js Community Demos (babylonjs.com)

“better” and “worse” are only one-sided views and always depend on the point of view. You can’t write web applications with blender, and it’s hard to take a family with luggage on a long trip with a Lamborghini Diablo.


thank you for taking the time to have a look and listen
and i agree wholeheartedly on taste being super personal