Gaming Life

一日24時間、ゲームは10時間

<processing>段々線が太くなる螺旋円

 かなり評判のいいジェネラティブアートの本を最近読んでるんですが(リンク下、アフィは貼ってないよ)、めちゃくちゃ面白くて一章ごとになんか作りたくなる。で、Part2を参考にとりあえず一つ作ってみた。

[普及版]ジェネラティブ・アート―Processingによる実践ガイド

[普及版]ジェネラティブ・アート―Processingによる実践ガイド

作品

f:id:ai_gaminglife:20170621224835j:plain

ソースコード

float startx,starty;
float ribbonwidth;
float turn = 8;
float radius;
float x,y;

void setup(){
  size(900,600,P2D);
  smooth();
  frameRate(2);
  background(0);

  startx = 450;
  starty = 300;

  float lastx = -999;
  float lasty = -999;

  radius = 1.5;
  ribbonwidth = 0.25;
  color col = color(random(255),random(255),random(255));
  fill(col);
  stroke(col);
  for(float ang = -180; ang <= turn*360; ang += 5){
    radius += 1;
    float rad = radians(ang);
    x = startx + (radius * cos(rad)) ;
    y = starty + (radius * sin(rad)) ;
    ribbonwidth += 0.04;
    strokeWeight(ribbonwidth);
    if(lastx > -999){
      line (x,y,lastx,lasty);
    }
    lastx = x;
    lasty = y;
  }
  save("hogehoge.jpg");
}

void draw(){
}

解説

 Chapter4「円を書く間違った方法」に載っているものを少し改変。線の色は毎回ランダム。

反省

  • RGB値を完全にランダムに決めているのでブログアップ用の見栄えのいい色が中々出なかった。鮮やかな色が出やすくなるようにしたい。
  • 本当は新体操のリボンみたいなのを作りたかったけどまだ無理。そのうちリベンジってことで

<processing>ゲームのロード画面でよくみるアレを作ってみた

 OpenProcessingで見かけた作品のソースコードを少し改変して作ってみた。大部分が元の作品に近いのであまり自慢できるようなものでもないが、それでもブログで進捗晒すことで整理したい&モチベを保ちたいので晒すことにする。

作品(Gif)

f:id:ai_gaminglife:20170618190126g:plain

ソースコード

import gifAnimation.*;

GifMaker gifExport;

final int NUM = 24;
color c1 = color(191, 255, 0);
int click = 0;
void setup(){
  size(640,640);
  noStroke();
  smooth();
  frameRate(50);

  gifExport = new GifMaker(this, "export.gif");
  gifExport.setRepeat(0);
  gifExport.setQuality(10);
  gifExport.setDelay(20);
}

void draw(){
  background(0);
  translate(width/2, height/2);
  for(int i = 0; i < NUM; i++){
    float angle = i * 2*PI / NUM;
    float v = pow(abs(sin(angle / 2 + frameCount * 0.03)), 4);
    float r = map(v, 0, 1, 10, 20);
    fill(lerpColor(color(0,0,0), c1, v));
    ellipse((150 + r + click) * cos(angle),(150 + r + click) * sin(angle), r * 2, r * 2);
  }
  if(frameCount <= 50*3){
   gifExport.addFrame();
 } else {
   gifExport.finish();
 }
}

void keyPressed(){
  if(key == 'r'){
    c1 = color(255,50,50);
  }else if(key == 'g'){
    c1 = color(0,255,0);
  }else if (key == 'b'){
    c1 = color(0,50,255);
  }else if(key == 'y'){
    c1 = color(191, 255, 0);
  }else if(key == ENTER){
    click += 10;
  }else if(key == BACKSPACE){
    click = 0;
  }
}

解説らしき何か

 ・Enterをクリック->円拡大、BackSpaceで元に戻す
 ・r,g,b,yをクリック->それぞれ赤、緑、青、黄色に変化する

まとめ

 ファミチキたべたい