Skip to content

Make Processing

조회 수 8278 추천 수 0 댓글 4
Atachment
첨부파일 '4'
?

단축키

Prev이전 문서

Next다음 문서

+ - Up Down Comment Print 수정 삭제
?

단축키

Prev이전 문서

Next다음 문서

+ - Up Down Comment Print 수정 삭제

정말 감사합니다

고쳐주신 부분에서

한번 변화만 있고 다고 캠으로 돌아가게 하고싶었는데

계속 돌아가버리더라구요 엔터를 한번만 누르고 다시영상에서 이미지로 돌아가는부분이 계속 반복되는 구동이 있어서

(0.0)에서 시작되게 하고 싶었는데

그래도 정말로 알려주신 부분에서 힌트를 얻어서 

그게 좀안되 보여서 다시 제가 어느정도 수정 보완하여서 이렇게 함수 코드를 만들어 보았습니다

 import processing.video.*;

 

boolean first = true;

int i;

float im, imax, imin;

float lasty, x, y;

 

// parameters (play here)

 

float ANGLE_SEED = 13; // 13 / 257 / 77

float amod = ANGLE_SEED;

float amod_inc = 0.5; // angle change for a new line

boolean MODIFY_ANGLE = true;

float smod = 0.7; // size modifier

/////////////////////////추가된 소스 /////////////////////////

boolean start = false;       // 키가 눌려졌는지 체크
boolean end = false;

/////////////////////////////////////////////////////////////

Capture cam;

 

void setup() {

  size(640, 480);

  cam = new Capture(this, 640, 480);

  imax = 640 * 480;

  imin = 0;

  smooth();

}


int a=0;
void draw() {

  if (first) {

    if (cam.available() == true) {

      cam.read();

      image(cam, 0, 0);

      //cam.copy(cam, 0, 0, cam.width, cam.height, 0, 0, cam.width, cam.height);

    }

  }

/////////////////////////// 추가된 소스 ///////////////////////////////

  if (start == true && end ==true) {   // 기존에 keypress 로 되어 있는 것을 키가 눌려진상태를 유지해야 하기때문에 boolean 으로 바꿈
  a++;
  if(a >=480){
    end = false;
    a = 0;
  }
///////////////////////////////////////////////////////////////////////

    first =false;
 
    cam.loadPixels();

 

    im += 640;

    //if (im > imax) im = imax;

    for (i = int(imin); i < im; i++) {

      x = i%cam.width;

      y = floor(i/cam.width);

 

      if (MODIFY_ANGLE && (lasty != y)) amod += amod_inc;

 

      color cc = cam.pixels[i];

      stroke(cc);

      fill(cc);

 

      float bri = brightness(cam.pixels[i]);

      float sat = saturation(cam.pixels[i]);

 

      if (bri > 245) draw_lines(bri, x, y, amod - x/3, smod);

      else if (bri < 10) draw_lines_dark(bri, x, y, amod - x/3, smod);

      else {

        strokeWeight(sat / 15);

        float a = (360.0 / 255.0) * sat + amod;

        float x2 = x + bri/4 * random(0.7, 1) * smod * cos(radians(a));

        float y2 = y + bri/4 * random(0.7, 1) * smod * sin(radians(a));

        line(x, y, x2, y2);

      }

      if ((sat > 200) && (bri > 150)) { //

        draw_circle(sat, x, y, amod, smod);

      }

      lasty = y;

    }

    imin = im;

    if (im == imax) {

      im =0;

    }

  }


}

 

void draw_lines(float s, float x, float y, float amod, float smod) {

  int im = int((s - 245) / 5);

  for (int i=0; i < im; i++) {

    float b = random(amod, amod+90);

    float l = im * random(10 * smod, 40 * smod);

    float x2 = x + l * cos(radians(b));

    float y2 = y + l * sin(radians(b));

    strokeWeight(( 1 - (0.5 * im)) * smod);

    line(x, y, x2, y2);

  }

}

 

void draw_lines_dark(float s, float x, float y, float amod, float smod) {

  int im = int(s / 2);

  for (int i=0; i < im; i++) {

    float b = random(amod, amod+90);

    float l = im * random(10 * smod, 40 * smod);

    float x2 = x + l * cos(radians(b));

    float y2 = y + l * sin(radians(b));

    strokeWeight(( 1 - (0.2 * im)) * smod);

    line(x, y, x2, y2);

  }

}

 

void draw_circle(float s, float x, float y, float amod, float smod) {

  float dia = random(s / 50) * smod;

  float ll = random(s / 3.0) * smod;

  float ang = random(360);

  float x2 = x + ll * cos(radians(ang));

  float y2 = y + ll * sin(radians(ang));

  strokeWeight(1);

  ellipse(x2, y2, dia, dia);

}

///////////////////////////// 추가된 소스 //////////////////////////////////

void keyPressed()

{

  if(key == 10)   // 엔터키의 키코드값(키보드와 컴퓨터 마다 다를수 있음)

  {

    if(start == false)

    {

      start = true;
      end = true;
      a = 0;

    }

    else

    {

      start = false;
      end = false;
      a = 0;
  im =0;
      first = true;

    }

  }

}

 

 

 

 

 

 

///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

또 궁금한점이 이미지말고 다른 이미지들을 여러게 만들어서

→를 누르면 이미지들이 변하고 엔터를 누르면 다시 영상으로 돌아가게 하고 싶은데

그이미지를 숫자 함수를 바꾸면서 이미지를 바꾸려고 하는데 잘알되네요 ..

넣으면 캠이 작동이 안되어 버리고 ..

어떻게 하여야 하는건지 ㅜㅜ

지금 파일첨부에서 1.2.3.4.번의 이미지를 을 →를 누르면

이미지가 위에서 아래로 바뀌면서 변하게 캠을 이용하여 만들고 싶은데요.

엔터를 누르면 다시 영상이 나오고 ㅜ  

 

(1)

 

 

 

 

PImage ritoque;

 

void setup(){

  ritoque = loadImage("ritoque_futbol.jpg");

  size(ritoque.width, ritoque.height);

  noStroke();

  noLoop();

  colorMode(HSB, 255);

  smooth();

  background(255);

}

 

void draw(){

  int spacer = 6;

  for(int y = 0; y < height; y += spacer){

    for(int x = 0; x < width; x += spacer){

      color c = ritoque.get(x,y);

      pincel(x, y, c, spacer);

    }

  }

}

 

void pincel(float x, float y, color c, float amp){

  int puntos = round(random(5,56));

  for(int i = 3; i <= puntos; i++){

    float h = hue(c) + random(-10, 10);

    float s = saturation(c) ;

    float b = brightness(c) + random(10, 70);

    pushMatrix();

    translate(x,y);

    fill(h,s,b);

    float tam = random(4, amp/2);

    ellipse(random(-amp, amp),random(-amp, amp), tam, tam);

    rect (random (10,45), random (10,40), tam, tam);

    popMatrix();

  }

}

 

void keyPressed(){

  redraw();

}

(2)

// Kimberlee Botha

 

 

PImage a;

PImage destination;

int pointillize = 10;

int smallPoint = 5;

int largePoint;

int top, left;

 

 

void setup() {

 

  size(500,1000);

  a = loadImage("greenwandgreen.jpg");

  noStroke();

  background(40);

  smooth();

largePoint = min(width, height) / 10;

//center the image on the screen

left = (width - a.width) / 2;

top = (height - a.height) /2;

}

 

void draw() {

 

 

  for(int i = 0; i <1000; i=i+30){

  float pointillize = map(mouseX, 0, width, smallPoint, largePoint);

  float fill = map(mouseY, 500, width, smallPoint, largePoint);

  int x = int(random(a.width));

  int y = int(random(a.height));

  int z = int(random(a.height/3));

  color pix = a.get(x, y);

  noStroke();

  //fills the random circles with the image "greenwandgreen.jpg" at random transparancy

  fill (pix, random(1,80));

  ellipse(left + x, top + y, pointillize, pointillize);

  fill (pix, random(1,80));

  stroke(0,70,120, random(0,20));

  //blue lines starting on the right hand side of screen moving randomly over image towards the left side

  line (500,i,random(0,500), random(0,1000));

  

   fill(10,10,20,50);

  noStroke();

 fill(pix, random(1,100));

  rect(left + x,top + y, pointillize, pointillize);

ellipse(left + x,top + y, pointillize, pointillize);

rect (left + x, top + y, pointillize, pointillize); 

 

  }

 

  }

 

//void keyPressed()

  

//Takes PNG screenshots when you push S

  

//Careful - doesn't prompt when overwriting files!

  

//{

  

  //if(key == 's' || key == 'S')

  

  //{

  

    //String filePath = selectInput("Saving PNG - Select or Type File Name");  // Opens file chooser

  

   // if(filePath != null)

  

   // {

  

    //  save(filePath + ".png");

  

   // }

  

 // }

  

//}

(3)

PImage ritoque; 

  void setup (){ 

   ritoque = loadImage ("ciudadabiertap.jpg"); //carga imagen

       size (ritoque.width, ritoque.height);  //tamaño

  background (251,255,250); //fondo

   colorMode(HSB, 155);    //funcion para colores

  noStroke();              //sin contorno

  noLoop(); 

  smooth();               //suaviza

   

   

void draw(){ 

   

  int sp=5; 

  for (int y=0; y<height; y+=sp){ 

    for (int x=0; x<width; x+=sp){ 

      color c = ritoque.get(x,y); 

      pincelTotal(x,y,c,sp); 

    } 

  } 

   

void pincelTotal(float x, float y, int c, int p){ 

  int pincel=round (random(4,7)); 

  for(int i = 0; i <= pincel; i++){ 

    float h = hue(c) + random(10, 25);         //tonalidad

    float s = saturation(c) +random(85);       //saturacion

    float b = brightness(c) + random(15, 25);  //brillo

    pushMatrix(); 

    translate(x,y); 

    fill(h,s,b,45);                            //nitidez

    float d = noise(1, p/2); 

   rotate(1);

    

triangle(random(20,25),random(25.28),random(20,15),random(18,10),28,random(18,17));

     

    popMatrix(); 

  } 

   

void keyPressed(){ 

  redraw();  

(4)

pImage ciudadAbierta;

void setup (){

size (640,480);

ciudadAbierta=loadImage ("ciudadabierta.JPG");

colorMode(HSB, 255);

background (ciudadAbierta);

noStroke();

//noLoop();

smooth();

}

void draw(){

int a=4;

for (int y=0; y<height; y+=a){

for (int x=0; x<width; x+=a){

color c = ciudadAbierta.get(x,y);

pincelTotal(x,y,c,a);

}

}

}

void pincelTotal(int x, int y, int c, int p){

int pincel=round (random(7,11));

for(int e = 0; e <= pincel; e+=3){

float h = hue(c) + random(-20, 20);

float s = saturation(c) + random(50);

float b = brightness(c) + random(-10, 25);

pushMatrix();

translate(x,y);

fill(h,s,b);

float d = random(1, p);

rect(random(-p, p),random(-p, p), d*200, d*1);

popMatrix();

}

}

void keyPressed(){

redraw();

}


1.jpg 2.jpg 3.jpg 4.jpg

  • profile
    smileblue 2012.06.08 10:48

    지방 강의 때문에 이제서야 글을 보게 되었네요..많이 늦었습니다.~^^;;


    문의 하신 내용은 위의 첫번째 소스(웹캠 붙인 소스)에서 나중에 첨부하신 1,2,3,4 소스에 적용된 효과를 주고 싶으시다는 말씀이시죠? 그리고 방향키를 누르면 1,2,3,4 효과가 순차적으로 바뀌고요? 이렇게 바뀌는 효과는 엔터키를 누르면 실행 되고 다시 엔터키를 눌렀을때는 영상으로 나오게 되고?  이것을 말씀하시는 건지요..^^

    글이 좀 복작하게 적혀 있는 것 같아서 문의 드립니다.~~

  • ?
    조아진 2012.06.08 17:44

    제가 할려고 하는 프로세싱의 컨셉은 회화의 느낌을  프로세싱으로 회화의 단점의 긴시간의 작업물을

    단시간에

    다양하게 숫자값을 변환하여 표현해 내는것입니다

    그래서 값들을 변환하여 붓터치의 느낌과같은 위에의 이미지의 느낌을 표현해내고자 하는데

    재미를 위해 캠을 연동하여 표현하려고 합니다

    장미축제나 축제의 장소에 이 프로그램을 구연하여 그장소에 자신이 들어가있는 하나의 그림을 가져가는것이지요

    그래서 캠을 이용하는것인데

    캠이 되다가 엔터를 누르면 그림이미지가 1234가 보이는것인데 그림이 위에서 아래로 내려오면서

    변하는것입니다 키보드에 있는→를 누르면 1에서 2의 그림으로 또 누르면 2에서 3의 그림으로 3에서 4의 그림으로 변하는것입니다 또 4에서 3의 그림으로 가고싶으면 키보드에 ←를 누르면 되고 다시 캠의 영상으로 돌아가고 싶으면

    엔터를 누르면 다시 영상으로 돌아가는것입니다

     

    ////////////////////////////////////////////////////////////////////////////////////////

    그런데 지금 제가 한것에서 1234의 그림이미지처럼 나오는것을 못하겠네요 화살표를 누르면 넘어가는것도..

    그렇게 하면 캠이 구동이 안되어 버리고 ,ㅜ

    위에 1234의 함수코드는  이런이미지를 만드는 함수인데 제가 만들려는 프로세싱안에 넣는데 도움이 될것같아

    넣어보앗습니다 이렇게 이미지가 보엿으면 해서요

  • profile

    ㅎㅎㅎ 엄청 긴 소스를 주셨군요..^^;;

    우선 소스 코드가 중복되는 부분도 많고 색상이  RGB, HSB 모두 섞여 있네요.. 소스를 합쳐서 보기는 했는데..

    분석은 본인이 직접 하셔야 할것 같습니다. 그리고 적용해 보니 3번 과 4번 필터의 차이를 모르겠네요..

    소스를 합쳐 놓기는 했지만 주석으로 나눠 놓았으니 쉽게 구별이 가능할 것 같습니다.


    소스 실행 => 웹캠 화면이 나옴

    방향키(오른쪽)를 누르면 필터가 바뀌(적용되는데 약간의 시간이 걸림)


    테스트환경 : OSX 10.7.3

    프로세싱 : v1.5.1



     import processing.video.*;
    Capture pic;
    
    //PImage pic;
    int pic_num = 0;
    
    
    /////////////  for filter 2 /////////////////////
    
    int pointillize = 10;
    int smallPoint = 5;
    int largePoint;
    int top, left;
    ////////////////////////////////////////////////
    
    void setup() {
    
    //  pic = loadImage("0.jpg");
      pic = new Capture(this, 800, 600, 30);
      size(pic.width, pic.height);
      background(255);
      smooth();
      noStroke();
    
    //  noLoop();
      /////////////  for filter 2 /////////////////////
    
      largePoint = min(width, height) / 10;
      //center the image on the screen
      left = (width - pic.width) / 2;
      top = (height - pic.height) /2;
      ////////////////////////////////////////////////
    }
    
    void draw() {
    
    
      switch(pic_num) {
      case 0: 
        println("ready");  // 
        image(pic, 0, 0);
        break;
      case 1: 
        println("filter 1");  // finlter 1
        colorMode(HSB, 255);
        int spacer = 6;
        for (int y = 0; y < height; y += spacer) {
          for (int x = 0; x < width; x += spacer) {
            color c = pic.get(x, y);
            pincel(x, y, c, spacer);
          }
        }
    
        break;
      case 2: 
        println("filter 2");  // filter 2
        colorMode(RGB, 255);
        for (int i = 0; i <1000; i=i+30) {
          float pointillize = map(mouseX, 0, width, smallPoint, largePoint);
          float fill = map(mouseY, 500, width, smallPoint, largePoint);
          int x = int(random(pic.width));
          int y = int(random(pic.height));
          int z = int(random(pic.height/3));
          color pix = pic.get(x, y);
          noStroke();
    
          //fills the random circles with the image "greenwandgreen.jpg" at random transparancy
    
          fill (pix, random(1, 80));
          ellipse(left + x, top + y, pointillize, pointillize);
          fill (pix, random(1, 80));
          stroke(0, 70, 120, random(0, 20));
    
          //blue lines starting on the right hand side of screen moving randomly over image towards the left side
    
          line (500, i, random(0, 500), random(0, 1000));
          fill(10, 10, 20, 50);
          noStroke();
          fill(pix, random(1, 100));
          rect(left + x, top + y, pointillize, pointillize);
          ellipse(left + x, top + y, pointillize, pointillize);
          rect (left + x, top + y, pointillize, pointillize);
        }
    
        break;
      case 3: 
        println("filter 3");  // filter 3
        colorMode(HSB, 255);
        int sp = 5; 
        for (int y=0; y<height; y+=sp) { 
          for (int x=0; x<width; x+=sp) { 
            color c = pic.get(x, y); 
            pincelTotal(x, y, c, sp);
          }
        }
        break;
      case 4: 
        println("filter 4");  // filter 4
        colorMode(HSB, 255);
        int a = 4;
        for (int y=0; y<height; y+=a) {
          for (int x=0; x<width; x+=a) {
            color c = pic.get(x, y);
            pincelTotal(x, y, c, a);
          }
        }
        break;
      case 5: 
        println("filter 5");  // filter 5
        break;
      }
    }
    
    
    /////////////////////  for filter 1 //////////////////////////////
    void pincel(float x, float y, color c, float amp) {
      int puntos = round(random(5, 56));
      for (int i = 3; i <= puntos; i++) {
        float h = hue(c) + random(-10, 10);
        float s = saturation(c) ;
        float b = brightness(c) + random(10, 70);
        pushMatrix();
        translate(x, y);
        fill(h, s, b);
        float tam = random(4, amp/2);
        ellipse(random(-amp, amp), random(-amp, amp), tam, tam);
        rect (random (10, 45), random (10, 40), tam, tam);
        popMatrix();
      }
    }
    ////////////////////////////////////////////////////////////////
    
    /////////////////////  for filter 3 //////////////////////////////
    void pincelTotal(float x, float y, int c, int p) { 
      int pincel=round (random(4, 7)); 
      for (int i = 0; i <= pincel; i++) { 
        float h = hue(c) + random(10, 25);         //tonalidad
        float s = saturation(c) +random(85);       //saturacion
        float b = brightness(c) + random(15, 25);  //brillo
        pushMatrix(); 
        translate(x, y); 
        fill(h, s, b, 45);                            //nitidez
        float d = noise(1, p/2); 
        rotate(1);
    
        triangle(random(20, 25), random(25.28), random(20, 15), random(18, 10), 28, random(18, 17));
    
        popMatrix();
      }
    }
    ////////////////////////////////////////////////////////////////
    
    
    /////////////////////  for filter 4 //////////////////////////////    
    void pincelTotal(int x, int y, int c, int p) {
      int pincel=round (random(7, 11));
      for (int e = 0; e <= pincel; e+=3) {
        float h = hue(c) + random(-20, 20);
        float s = saturation(c) + random(50);
        float b = brightness(c) + random(-10, 25);
        pushMatrix();
        translate(x, y);
        fill(h, s, b);
        float d = random(1, p);
        rect(random(-p, p), random(-p, p), d*200, d*1);
        popMatrix();
      }
    }
    ////////////////////////////////////////////////////////////////
    
    
    void keyPressed()
    {
      println("press");
      if (key == 'r' || key == 'R')
      {
        redraw();
      }
    }
    
    void keyReleased()
    {
      if (keyCode == RIGHT)
      {
        pic_num++;
        if (pic_num > 4)
        {
          pic_num = 1;
        }
      }
      background(255);
    }
    
    void captureEvent(Capture pic) {
      pic.read();
    }





  • ?
    조아진 2012.06.13 09:06

    정말 감사합니다

    이미지의 3번째 그림이 프로세싱 상에는 안보이는데,, ㅜ가로길이값 위에 있는 그림이요 ㅜ


Q&A

질문하는 공간입니다. 회원이면 누구나 질문/답변 할 수 있습니다.

List of Articles
번호 제목 글쓴이 날짜 조회 수
297 Video 관련 하여 질문드립니다. 2 s8848m 2013.09.06 17451
296 Max/Msp 에서 OSC externals 파일들을 넣는 곳이 어딘지 궁금해서 질문드립니다. 1 file beautyfullcastle 2013.08.30 17121
295 아두이노 관련 질문드립니다. 7 망고 2013.10.09 10791
294 프로세싱 폰트관련 질문입니다. 1 방보람 2012.06.01 9628
293 프로세싱 캠에 대해 문의좀 해보려구요 ,, 4 조아진 2012.06.04 9620
292 감사합니다 ㅎ 3 방보람 2012.06.03 9292
291 프로세싱문의요 1 file 조아진 2012.06.04 8964
290 움직이는 오브제를 정지시키고 프린터로 출력.. 1 오후세시 2011.10.26 8563
289 프로세싱 시리얼통신에 관련하여 질문드립니다^^ 3 file songyun114 2013.06.12 8291
» 필터 이미지를 넣는 부분에서 문제가 . 4 file 조아진 2012.06.06 8278
287 키넥트 관련 질문드립니다 4 songyun114 2013.07.15 8117
286 processing 외부 txt 파일 한글 깨짐문제 1 biclen 2013.07.27 7881
285 사용자가 직접 타이핑 하기. 3 오후세시 2011.10.15 7708
284 processing과 vvvv 2 맨땅 2013.10.05 7578
283 다시올립니다 급해요 ㅜ 1 file 조아진 2012.10.12 7435
282 이재중 선생님께 질무운~ 5 file 망고 2013.09.27 7417
281 [질문] 프로세싱 2.0 b8에서 스탠드 얼론의 형태로 어플리케이션 생성시 오류가 납니다. 2 file soundnscape 2013.04.28 7147
280 한 번 더 질문 드릴게요 4 file 유구르트 2012.12.20 7005
279 이재중 선생님께, 프로세싱 워크샵 질문~ 2 file 망고 2013.06.18 6708
278 안녕하세요 :) 3 yuriri 2012.06.14 6637
Board Pagination ‹ Prev 1 2 3 4 5 6 7 8 9 10 ... 15 Next ›
/ 15

나눔글꼴 설치 안내


이 PC에는 나눔글꼴이 설치되어 있지 않습니다.

이 사이트를 나눔글꼴로 보기 위해서는
나눔글꼴을 설치해야 합니다.

설치 취소

Designed by sketchbooks.co.kr / sketchbook5 board skin

Sketchbook5, 스케치북5

Sketchbook5, 스케치북5

Sketchbook5, 스케치북5

Sketchbook5, 스케치북5

Copyright (c) 2012 Make Processing. All Right Reserved.

smileblue

sketchbook5, 스케치북5

sketchbook5, 스케치북5

나눔글꼴 설치 안내


이 PC에는 나눔글꼴이 설치되어 있지 않습니다.

이 사이트를 나눔글꼴로 보기 위해서는
나눔글꼴을 설치해야 합니다.

설치 취소