Particles in Animations (json generally)



  • How are those handled exactly? Like, how would you do a fireball of some sorts? I stumbled upon a particle generating website that would let you define it interactively within the browser and export as json

    Would a layout like this be compatible with this engine at all? I figured that since animations are json, those can be incorporated in such aswell?

    So an example would be a "burning" animation, whereas the character has drawn atop particles that are moving, would it be a seperate animation laid above the default or can it be within the normal characters animations? I guess the latter?

    I chose to pick this subcategory even though animation one would have sufficed aswell

    {
      "particles": {
        "number": {
          "value": 80,
          "density": {
            "enable": true,
            "value_area": 800
          }
        },
        "color": {
          "value": "#ffffff"
        },
        "shape": {
          "type": "circle",
          "stroke": {
            "width": 0,
            "color": "#000000"
          },
          "polygon": {
            "nb_sides": 5
          },
          "image": {
            "src": "img/github.svg",
            "width": 100,
            "height": 100
          }
        },
        "opacity": {
          "value": 0.5,
          "random": false,
          "anim": {
            "enable": false,
            "speed": 1,
            "opacity_min": 0.1,
            "sync": false
          }
        },
        "size": {
          "value": 3,
          "random": true,
          "anim": {
            "enable": false,
            "speed": 40,
            "size_min": 0.1,
            "sync": false
          }
        },
        "line_linked": {
          "enable": true,
          "distance": 150,
          "color": "#ffffff",
          "opacity": 0.4,
          "width": 1
        },
        "move": {
          "enable": true,
          "speed": 6,
          "direction": "none",
          "random": false,
          "straight": false,
          "out_mode": "out",
          "bounce": false,
          "attract": {
            "enable": false,
            "rotateX": 600,
            "rotateY": 1200
          }
        }
      },
      "interactivity": {
        "detect_on": "canvas",
        "events": {
          "onhover": {
            "enable": true,
            "mode": "repulse"
          },
          "onclick": {
            "enable": true,
            "mode": "push"
          },
          "resize": true
        },
        "modes": {
          "grab": {
            "distance": 400,
            "line_linked": {
              "opacity": 1
            }
          },
          "bubble": {
            "distance": 400,
            "size": 40,
            "duration": 2,
            "opacity": 8,
            "speed": 3
          },
          "repulse": {
            "distance": 200,
            "duration": 0.4
          },
          "push": {
            "particles_nb": 4
          },
          "remove": {
            "particles_nb": 2
          }
        }
      },
      "retina_detect": true
    }
    


  • @Elk said in Particles in Animations (json generally):

    an be incorporated in su

    what particle website is it that you are using ? I would like to know too @flameboy @stefan



  • one of the first that came to mind really

    https://vincentgarreau.com/particles.js/


  • Corleone Staff Forum Admin

    I actually use the testbed server for Corleone.

    If you'd like I can give you access to practice animations?


  • Forum Admin

    @Elk I think those particle definitions look even more complex than the ones we have in the game already (fireworks, snow) 😄 It's not easy to make an automatic converter since we have to do things a little bit differently for optimizations, can't use circles or svgs as particle (would be possible somehow but just using a png is much easier).
    You can define particles in .bani files and use them for NPCs or player animations. Right now you would need to define the particle emitters in each .bani file separately, but can make it possible in the future to attach another .bani to the player (maybe with player.aniarg1 etc.)



  • download.png
    it's pretty fun but it would be cool if someone could do a Guide on how to actually use it 😂


Log in to reply