ヒカリノアトリエ演出の、アバターとパーティクルの実装方法についてまとめました！

1. アバターと手から粒子
1

2. 演出の仕様
スクリーン(前)
・手の位置(片手)からパーティクルが出てくる.
・一定時間になったらパーティクルが消える.
スクリーン(後ろ)
・自分自身のアバター(白色)が投影される.
2

3. コードの説明
3

4. 使用するクラス
・ofApp.cpp
・ofApp.h
・P_Avater.cpp
・P_Avater.hpp
・P_Particle.cpp
・P_Particle.hpp
4

5. ofApp.h
・ofxOpenNI.hとP_Particle.hppを
呼び出す.
・kinectとkirinukiを宣言する.
・setupとupdateとdrawクラスを
宣言する.
・mP_ParticlesとP_handposを
宣言する.
5

6. ofApp.cpp(setup)
・FrameRateを60に設定する.
・背景を黒にする.
・kinectのsetupをする.
・P_Particleのsetupクラスを
呼び出す.
6

7. ofApp.cpp(update,draw)
・kinectのupdateをする.
・手の位置を検出する処理を書く.
・800～2800mm(深度)を切り抜く処理を書く.
・kirinukiをupdateをする.
・P_ParticleのupdateクラスをP_handposを引
数として呼び出す.
・P_Particleのdrawクラスを呼び出す.
7

8. P_Particle.h
・setup,update,drawのクラスを宣言する.
・updateには、_handposというofPoint型の引数
を宣言する.
・pos(ポジション)とvel(速度)を動的配列(vector)
で宣言する.
・G_count(カウント),G_index[](Particleの添え字)
をint型で、G_color(Particleの色)を初期値255
にしてfloat型で宣言する.
・Particle配列をofImageで宣言する.
8

9. P_Particle.cpp(setup)
・背景を黒にする.
・24枚画像があるので、24回のfor文を
回して画像をロードする.
・24枚の画像をそれぞれを扱うために、
G_index[]に0～23の数字を代入する.
・ポジションと速度をクリアする.
9

10. P_Particle(update)
・引数で持ってきた_handposを使用する.
・手のポジションを全画面に対応させる.
・x軸,y軸をそれぞれに-5～5までの範囲でランダムに取る.
・pとvをそれぞれposとvelに追加する.
10

11. P_Particle(draw)
・ポジションを設定する.
・G_index配列のj番目をG_countに
代入する.
・Particle配列のG_count番目をdraw
する.
・G_colorを徐々に下げていき、0に
なったらposとvelをクリアしG_colorを
255に戻す.
11

12. P_Avater.hpp
・drawクラスを宣言する.
・_kirinukiというofImage型の
引数を宣言する.
12

13. スクリーン後ろ側
・スクリーンの後ろ側には、P_Avaterのdrawクラスをkirinukiを引数
として呼び出す.
mP_Avaters.draw(kirinuki);
13

14. P_Avater.cpp
・引数で持ってきた_kirinukiを使用する.
・_kirinukiを全画面表示させる.
14

15. 完成！！！
15

16. 参考文献
・openFrameworks基礎 たくさんの図形を動かす 静的配列と動的配列
- 芸大グラフィックスプログラミング演習B
URL : https://www.slideshare.net/tado/geidai-graphb111027
・こじ研 (openframeworks)
URL : https://www.ei.tohoku.ac.jp/xkozima/lab/ofTutorial5.html
16