[ Video ]
[ About ]
Twitterで見かけた「炎のエフェクトの作り方」を参考に作成してみました。該当のツイートを保存しそこねて、ご紹介出来ないのが残念です…(結構探したけど見つからなかったので、タイトルがそもそも違うのかも)
ソースコードからも読み取れますが手法としては、
1．配列の0行目にランダム(今回はNoise関数使用)の値を入れる
2.1行目は(x – 1, y – 1), (x, y – 1), (x + 1, y – 1)の3点の平均値を入れる
3.2行目以降は上記の3点に加えて,(x, y – 2)の値を加えた4点の平均を加える
4.3を最終行まで繰り返す
※ 該当する番地が存在しない場合は、無視してね
Excelでも関数と条件付き書式の組み合わせて簡単に作成出来て面白かったので、openFrameworksに取り込んでみました。
[ Source ]
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 |
#pragma once #include "ofMain.h" #include "ofFbo.h" class ofApp : public ofBaseApp { public: void setup(); void update(); void draw(); void keyPressed(int key) {}; void keyReleased(int key) {}; void mouseMoved(int x, int y) {}; void mouseDragged(int x, int y, int button) {}; void mousePressed(int x, int y, int button) {}; void mouseReleased(int x, int y, int button) {}; void windowResized(int w, int h) {}; void dragEvent(ofDragInfo dragInfo) {}; void gotMessage(ofMessage msg) {}; ofFbo fbo; int rect_size; vector<vector<ofColor>> colors; }; |
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 |
#include "ofApp.h" //-------------------------------------------------------------- void ofApp::setup() { ofSetFrameRate(60); ofBackground(0); ofSetWindowTitle("Insta"); ofSetRectMode(ofRectMode::OF_RECTMODE_CENTER); this->rect_size = 10; this->fbo.allocate(ofGetWidth(), ofGetHeight()); } //-------------------------------------------------------------- void ofApp::update() { this->colors.clear(); float x_count = ofGetWidth() / this->rect_size; float y_count = ofGetHeight() / this->rect_size; for (int y = 0; y < y_count; y++) { vector<ofColor> tmp_colors; for (int x = 0; x < x_count; x++) { if (y == 0) { float value = ofMap(ofNoise(x * 0.03, ofGetFrameNum() * 0.005), 0, 1, 0, 255); tmp_colors.push_back(ofColor(value)); } else { float value = 0; int count = 0; for (int tmp_x = x - 1; tmp_x <= x + 1; tmp_x++) { if (tmp_x >= 0 && tmp_x < x_count) { value += this->colors[y - 1][tmp_x].r; count++; } } if (y >= 2) { value += this->colors[y - 2][x].r; count++; } float average = value / count + ofMap(ofNoise(x * 0.05, y * 0.1 - ofGetFrameNum() * 0.5), 0, 1, -5, 5); if (average < 0) { average = 0; } else if (average > 255) { average = 255; } tmp_colors.push_back(ofColor(average)); } } this->colors.push_back(tmp_colors); } this->fbo.begin(); for (int y = 0; y < this->colors.size(); y++) { for (int x = 0; x < this->colors[y].size(); x++) { ofSetColor(this->colors[y][x]); ofDrawRectangle(ofVec2f(x * this->rect_size + this->rect_size / 2, ofGetHeight() - (y * this->rect_size + this->rect_size / 2)), this->rect_size, this->rect_size); } } this->fbo.end(); } //-------------------------------------------------------------- void ofApp::draw() { this->fbo.draw(ofGetWidth() / 2, ofGetHeight() / 2); // RectModeにつられる } //======================================================================== int main() { ofSetupOpenGL(1280, 720, OF_WINDOW); ofRunApp(new ofApp()); } |