Referencing Sound

My wind sound clip came from TheFreeSoundProject which is a creative commons site. It is a .wav file and loops seemlessly. :)

Final Code - Transformation

// Import Sound Library
import ddf.minim.*;
import ddf.minim.signals.*;
import ddf.minim.analysis.*;
import ddf.minim.effects.*;

Minim m;
AudioPlayer mplayer;


// Import image for background.
import processing.pdf.*;
PImage img;


// Number of circles being drawn in each frame of the animation.
int N = 450;
Particle particles[] = new Particle[N];


void setup(){
  size(500,500);


  m = new Minim(this);
  
  // Image being used in background (because I did not like the previous gradient palette being used)
  img = loadImage("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIxNotkC6R82ct_hGv1o8IVgkK8O3aDXV_5yZlIm4PTvIArs-kIVw3LRll6Tso_3JcUgzhwNjlFMI9egYWb9lBkzJDj90y8bTnDOVpH9eZbT4InsCvVFParBVtbP1VGRXnJ4lyNT3Blus/s1600/blue-sky.jpeg");
  img.resize(width, height);
  background(img);
  
  createParticles();


}

void draw(){
  
//This prevents the sketch from building up and redraws the animation each frame
  for(int i=0; i<width; i++){
     image(img,0,0,width,height);
     line(0,i,width,i);
  }
   


 //Defines class Particle and it's objects being drawn.
 for(int j=0; j<N; j++){
      particles[j].move();
      particles[j].mouse();
  }
  
}

void createParticles(){
  
   // This creates the "particles" for each frame


    for(int i=0; i<N; i++){
        particles[i] = new Particle(random(width), random(height), int(random(100)));
    }
  
}



class Particle{
// This is a class, which contains a composite of functions and data.  


    float x;
    float y;
    int s;
     
     Particle(float _x, float _y,  int _s){
        x = _x;
        y = _y;
        s = _s;
        
    }
     
    void move(){
      
        // This is where the movement of the circles across the screen is defined


        x += random(6);
        y += random(5) - 2;
         
        if(x<0) x = width;
        if(x>width) x = 0;
        if(y<0) y = height;
        if(y>height) y = 0;
        
    }
    
    void mouse(){
   
    // This is where the mouse interaction is defined.


     if(mousePressed){
      
        smooth();
        noStroke();
        float dia = dist(x, y, mouseX, mouseY);
        dia = constrain (dia,0,150);
        fill(240,random(10,15)); 
        ellipse( x, y, dia, dia);
     }
     else {
     
       // This is where the animation is told to continue if the mouse is not pressed


         smooth();
         noStroke();
         fill(240,random(10,15)); 
         ellipse( x, y, 150, 150);
     
      }
    }
}




void mousePressed(){
    //This Function starts the wind sound (at the same time of the void mouse() function and then loops it so that the sound continues infinitely.
       mplayer = m.loadFile("wind_final.wav");
       mplayer.loop();


}

Below are a couple of screen shots of the interaction...

 

Sound.

Sound proved to be more difficult than I had anticipated. Spent most of the day working on simply getting a code from OpenProcessing to work when I ran it on my laptop and not through the website. I was able to identify the problem when I looked up minim sound code through the site "Code Log". This made me realise that the URL I was attempting to use must not have been linking to the sound itself. I also found that if I were to use a file upload then I would need that file to be in the correct folder in order for the code to find the sound and use it.

The code that I used as a main source for my own sound input was one by Cameron Greatorex that looked at sound initiated by the click or press of a mouse button. I used his code (Click to see) involving sound for the initiation of sound to coincide with the initiation of movement in the sketch. This required some alterations to his sound code, and also meant I did not have to use all of his sound code.

On a side note, I decided that I wanted the wind noise to continue and not stop and start with the clicking of the mouse, which clears the cloud away. This is because of the cloud movement across the screen, I feel that this movement should be backed with the sound of wind.

I had to make changes to the particle class, in the void mouse() function, due to the fact that I wanted the clouds to only separate when the mouse was pressed. But wanted the animation of clouds to continue when the mouse was not pressed. This was pretty straight forward stuff after all, and I was surprised at how far my coding knowledge has come :)

Background fixed :D

Luke and Ben R put me into what was happening in the draw function, I was still using Funatti's palette code which was riding over my background (which was only being drawn in the first frame). Ben suggested I use image in the loop or erase it all together and let the sketch build up. I did not want the latter at all, so played around with image in the for loop, and managed to get the background to draw every frame :)

Changing the code to work in my favour.

Funatti's code is great but I wanted to make it my own by changing the quality of the background, as the previous background has lines and colour that I did not like.

• I am working on using the import image process that worked so well in my previous wallpaper code. and using that as my background.
• In doing so I ran into the problem of having to resize, I looked this up in the reference and was able to successfully resize the image to the dimensions of my application.
• However Now I have the issue of the background flashing in the first frame of animation then completely disappearing altogether. I have a feeling this is because of the class function that I am using but it is a bit out of my depth so I am seeking help from tutors at this point.

The other aspect I am looking to change in the code is the interaction.

• I have looked at getting rid of functions that I will not need due to the mouse function that will have this information in it already. I have deleted void draw in the class and replaced it with void mouse, which draws the shapes and also alters the shapes according to how far away the mouse is.
• Next I was unhappy with how big the circles got when the mouse was so far away. So Luke informed me of a constrain tool, which is incredibly simple and straight forward! :) So slotted that in place.

Another observation I made was when I switch the code to P2D, the animation slows down considerably and doesn't seem to cope, I thought that in switching to P2D this would help with the background image and the general run of the code, but I am not entirely sure I have defined it in the right area(s) or I have a feeling I have two opposing definitions for what the background should be.

NEXT STEP: To add sound that links in with the interaction of the mouse.

Found new code for moving clouds!

Funatti has a code that explores a cloud scene that is very effective and I would like to focus on his code due to the way he creates movement of cloud forms across the screen. You can find the original code HERE.

Below is part of Funatti's code that explores a 'class' - A class is a composite of data and methods (functions) which may be instantiated as objects. As I found out through the Processing Reference, and Luke & Ben.

class Particle{
    float x;
    float y;
    int s;
    
     Particle(float _x, float _y,  int _s){
        x = _x;
        y = _y;
        s = _s;
    }
    
    void move(){
        x += random(6);
        y += random(5) - 2;
        
        if(x<0) x = width;
        if(x>width) x = 0;
        if(y<0) y = height;
        if(y>height) y = 0;
    }
    
   void draw(){
        fill(255,15);
        noStroke();
        ellipse(x,y,s,s);
    }
}


The above relates to other parts of the code that have created "particles" and array's . However what I am interested in is the void move() function. As this is where the movement of the circles across the screen comes into play. Note being: the class function will be helpful in the interaction of the mouse with the circles and their radius length. As I will be able to create another function within the particle class labelled "void mouse()" which will describe the interaction of the mouse with the clouds (ellipses) being drawn and moved.

First concept of transformation.

Below is my code for a very basic looking cloud scenario...


[Inspired by David Bouchard on OpenProcessing, who used array's to store data. **Click Here** to see the source of inspiration.]


PImage img;



float x[] = new float[250];
float y[] = new float[250];

void setup() {
  size(500, 500);
 
  img = loadImage("http://www.freefoto.com/images/9907/04/9907_04_20---Blue-Sky-and-White-Clouds_web.jpg?&k=Blue+Sky+and+White+Clouds");

  smooth();
  noStroke();

  for (int i=0; i < x.length; i++) {
    x[i] = random(width);
    y[i] = random(height);
  }
}

void draw() {
 
  background(40,75,155,100);
 
  for (int i=0; i < x.length; i++) {
   
    smooth();
    int a=floor(random(0,img.width));
    int b= floor(random(0,img.height));

    color myColor = img.get(a,b);
   
    float dia = dist(x[i], y[i], mouseX, mouseY);
    fill(myColor,random(1,45));
    ellipse(x[i], y[i], dia, dia);
  }


}

Concept sketches for day scene

The sketch moves according to the mouse position. 'Cloud' like forms will move away from mouse and sounds like wind and possibly tweeting noises will be made at the click of a mouse.