Silverback9

#야생으로

Creative Coding 독학 제276일 2024년12월28일(토)

오늘은 로켓에 DNA를 장착하는 날이예요~~^^* YEAH~~^^*

겨울 공기에 익숙한 요즘~~^^* 더운 곳 부드러운 밤공기를 마시며 공연 1작품 편안하게 감상하셔요~~^^* 토요일이니까요~~^^* 저는 곧 코딩 공부 정리해서 돌아올게요~^^*

네~~^^*

어제 우리는 하늘로 올곧게 날아 오르는 하얀 로켓 하나를 만들었는데요~~^^*

이번엔 무작위 속도를 가진 작고 반투명한 로켓을 만들어 보겠습니다~~^^*

function Rocket() {
  this.pos = createVector(width/2, height);
  this.vel = p5.Vector.random2D();
  this.acc = createVector();
  
  this.applyForce = function(force) {
    this.acc.add(force);
  }
  
  this.update = function() {
    this.vel.add(this.acc);
    this.pos.add(this.vel);
    this.acc.mult(0);
  }

  this.show = function() {
    push();
    noStroke();
    fill(255, 150); 
    translate(this.pos.x, this.pos.y);
    rotate(this.vel.heading());
    rectMode(CENTER);
    rect(0, 0, 25, 5); 
    pop();
  } 
 
} 

이제 이 로켓이 여러 개가 생성되어 population 군집을 이루도록 해 볼게요~~^^*


function Population() {
  this.rockets = [];
  this.popsize = 25;

  for(var i = 0; i < this.popsize; i++) {
    this.rockets[i] = new Rocket();
  }
  
  this.run = function() {
   
    for(var i = 0; i < this.popsize; i++) {
      this.rockets[i].update();
      this.rockets[i].show();
    }
  //population 군집 this.rockets[]의 개체들의 위치변화를 반영하여 시각적으로 보여줍니다. 
  }
}
var population;

function setup(){
  createCanvas(400, 400); 
  population = new Population();
}

function draw(){
  background(0);
  population.run();
}

네~~^^* 25개의 rocket 로켓 개체를 가진 population 군집을 만나보러 갈까요~~^^*

이번에는 모든 rocket 로켓들이 자신들의 DNA에 따라 제각각 움직이도록 만들어 보겠습니다~^^*

200프레임을 하나의 수명으로 보고, 프레임마다 서로 다른 무작위 속도값이 적용되어 rocket들이 순간순간 서로 다른 움직임 변화를 통해 살아 움직이는 변화무쌍한 모습을 가지도록 하는 DNA입니다.

var lifespan = 200;
//200 frame 동안 각 frame 별로 무작위 속도로 움직이려고 합니다. 

function DNA () {
  this.genes = [];
  for(var i = 0; i < lifespan; i++) {
     this.genes[i] = p5.vector.random2D();
  //200 frame 각각 서로 다른 무작위 속도를 가집니다.  
  }
}
  
function Rocket() {
  this.pos = createVector(width/2, height);

  this.vel = createVector(); 
  //초기 속도는 0로 세팅하겠습니다. 

  this.acc = createVector();

  this.dna = new DNA(); 
  //DNA를 생성합니다. 

  this.count = 0; 
  //this.dna.genes[this.count]에 쓰이며, 배열의 순서를 나타내게 될 것입니다. 
  
  this.applyForce = function(force) {
    this.acc.add(force);
  }
  
  this.update = function() {
    this.applyForce(this.dna.genes[this.count]);
    //this.dna.genes[this.count]에 서로 다른 속도가 저장되어 있으므로
    //프레임마다 서로 다른 속도값이 힘에 적용되어 가속도에 더해집니다.  
    this.count++;    
 
    this.vel.add(this.acc);
    this.pos.add(this.vel);
    this.acc.mult(0);
  }

  this.show = function() {
    push();
    noStroke();
    fill(255, 150); 
    translate(this.pos.x, this.pos.y);
    rotate(this.vel.heading());
    rectMode(CENTER);
    rect(0, 0, 25, 5); 
    pop();
  } 
 
}

그럼 우리~^^* DNA 장착한 로켓들의 재미있는 움직임을 보러 함께 갈까요~~^^* YEAH~^^*

네~~^^* 오늘 저와 함께 생기발랄하게 움직이는 DNA를 가진 rocket 로켓들을 만들어 주셔서 감사합니다~~^^*

내일은 우리~~^^* target에 다가가는 방법을 고민하는 Smart Rocket 똑똑한 로켓 만들기를 시작해 볼까요~~^^*

하루 하루 작은 도전들을 실천하여 멋진 프로그램을 완성할 수 있을 것 같아요~~!!!

광대한 우주 속에서 우리 로켓의 속도는 참 느리겠지만~~^^* 그래도 우리 손으로 뚜닥뚜닥 로켓 제조해 보는 즐거움을 도전으로 기쁘게 맞이해 보면 좋겠어요~~^^*

우리도~~^^* 우리 각자의 DNA에 내장되어 있는 고유한 움직임으로 오늘 하루를 아름답게 유영해 보면 좋겠어요~~^^*

오늘도 기쁨 나누는 보람찬 하루 보내시고요~~^^*

따뜻하게 코~~ 주무셔요~~^^*

네~~^^* 꿈은 이루어 집니다~~^^*

댓글 남기기