# WCCChallenge: Sparkles

## **SparklesRItual**

For this week's Creative Code challenge by @[@sableRalph](@sableRalph) : ***Sparkles,*** I decided to code a Sparkle-filled ritual in **P5js, Hydra & Seis8s**

* The sparkles effect comes from **P5js**
    
* The ritual and movement come from modulating the **P5js** mouse movements via **Hydra**
    
* Audio is done with **Seis8s** with a customized filter overlayed on the coded section
    

## **Poetry**

***The Sparkles are fixated on their routine  
As some come faraway  
Others come near  
To see what fruit they will bear  
To see which ritual, will be played today  
And the interactions that come between***

## VIdeo

<iframe width="560" height="315" src="https://www.youtube.com/embed/TodwO0HQo94"></iframe>

## Code

### P5js

```javascript
//inspired by https://editor.p5js.org/baileycfoltz/sketches/MtTzUvNXa to hav the sparkles tell a story or in this case rather be a bit  chaotic in movement


function setup() {
  createCanvas(displayWidth, displayHeight);
}

function draw() {
  background(0);

  if (second() % 12 > 6) {
    sparkles("green", 1, 3, 5);
    sparkles("yellow", 1, 4, 4);
    sparkles("red", 1, 5, 3);
    sparkles("blue", 1, 6, 2);
  } else {
    sparkles("darkgrey", 1, 5, 3);
    sparkles("gold", 1, 4, 4);
    sparkles("white", 1, 3, 5);
    sparkles("hotpink", 1, 6, 4);
  }
}

function sparkles(spark, y, x, z) {
  for (var i = 0; i < height; i = i + 15) {
    fill(spark);
    noStroke();

    rect(
      mouseX * y + i * random(-2 ,2),
      mouseY * y + random(-50, 50),
      z,
      x + 1
    );

    push();
    scale(((second() % 12) + 1) / 10);
    translate(50, 100, 0);
    rect(
      mouseX * y + random(-2, 2) * i,
      mouseY * y + random(-50, 50),
      z,
      x + 2
    );
    pop();
  }
}
```

### Hydra

```javascript
s0.initScreen()

src(s0).kaleid(2).rotate(()=> sin(time)).scale(0.35).repeat(()=> time % 4+1).out()

speed = 0.5
```

### Seis8s

```css
#every 15 seconds the tempo changes to the following

1.tempo 0.0825
2.tempo 0.1625
3.tempo 0.2425
4.tempo 0.3225

acordes [re m, la, la, fa, do, do, fa, re m, la, la];
alternar 5 (acompanamiento (1 2 4)) $ acompanamiento (1 4) $ cumbia teclado; 
acompanamiento (2 3 4 4) $ cumbia teclado;
sample 4 $ teclado;
tumbao 5 $ cumbia congas;
vol 0.825 $ cumbia bajo;
cumbia guira;
acordes [do, sol, fa];
vol 1.2 $ punteo [1a 3a 3a 3a 5a 6a] [1 2 2.5 3.5] $ guira; 
tumbao [1a 3a 5a 6a] [1 3 4 4.5] $ bajo;
acompanamiento (2 3 3 4) $ teclado; 
vol 1.3 $ ritmo [1 2 3 4, 1 1.5 2 2.5 3 3.5 4, 1] $ guira;
ritmo [1 2 3 4, 2 4, 2,3,4,5] $ teclado;
marcha [(q p) (q p) (q t) (q p) (q p) (q p) (q a)] [1 2 3.2 4 4.5] $ congas;
```