Entries

インタラクティブ・プログラミング勉強会 第1回 乱数

巷では、スマホは「手触り」が重要・・・って話が持ち上がりつつあるが、使い易さと気持ちよさを両方できる人材が不足している。広告Flash業界で培われたインタラクションのノウハウは、だんだんと失伝しつつあり、ビジュアルや動きをちゃんとコーディングできるスマホ系の人材なかなかいない。新しく勉強するパスもほとんどない。

そんなわけでTHE GUILDの社員研修として勉強会をすることに。目標は1年ぐらいでこの程度のモリモリ動くものを作れるようにすること。で、2年目に動きや手触りに、合理性や必然性、使い易さを付加できるとこまでもっていく。

第1回はインタラクティブの根幹となる乱数について。



1: 乱数とは

ランダムな値を返す関数、機能。 乱数はインタラクティブ・プログラミングの根源。静的な絵とは根本に異なる、永遠に定着しない絵を作り出す。

インタラクティブなプログラミングでは、知識以上にその応用力が問われる。基本的には数Ⅱまでの数学力でも、十分にプロとして仕事していける。

// 0〜100の乱数を得る。
float val = random(100);
// 50 〜 100 の乱数を得る。
float val = random(50, 100);


2: 乱数の使い道

乱数は以下のような分野で使われる。根本的な意味では、多様性を出すためか、結果を1つに収束させない為に用いられる。

  • オブジェクトに多様性を与える
  • 初期値をばらけさせる
  • 大量のモノを配置する
  • 移動方向を決定する
  • 一定確率で挙動を変える
  • 自然をシミュレートする
  • 正規分布で誤差を出す
  • ノイズ
  • f/f1揺らぎ(ファジー)
  • 複数の選択肢から1つを選ぶ



3. 行動の分岐

if (random(100)<30){
     //30%の確率でこちらを実行
}else{
     //70%の確率でこちらを実行
}
if (random(100)<30){
     //30%の確率でこちらを実行
}else if(random(100)<40){
     //28%の確率でこちらを実行
     //70%分岐のあと40%分岐してるので28%。
}else{
     //42%の確率でこちらを実行
     //70%分岐のあと60%分岐してるので42%。
}
float rnd= random(100);
if(rnd<30){
     //30%の確率(0〜29)でここを実行
}else if(end<50){
     //20%の確率(30〜49)でここを実行
}else{
     //50%の確率(50〜100)でここを実行
}


複数の選択肢から1つを選ぶ
複数の選択肢から1つを選ぶ挙動。行動パターンを選択する場合などに用いる。

//整数で0〜10番をランダムに取り出す
int num = int(random(0,10));



ランダムウォーク
ランダムな移動量や速度を用いて、不規則に移動すること。小蠅の飛行や、株価の動きなどがこれに近い。

//ランダムウォーク(位置)
x += random(-1,1);
//ランダムウォーク(速度)
vx += random(-1,1);
x += vx;
//ランダムウォーク(加速度)
ax += random(-1,1);
vx += ax;
x += vx;



4: 正規分布

下記2つの乱数は意味が大きく違う。

float val = random(100);
float val = (random(100) + random(100) + random(100) + random(100) + random(100) + random(100)) / 6;

前者は均一な乱数。後者は中央(50周辺)に、偏った乱数になる。

サイコロを想像するとイメージしやすい。サイコロと2つふった場合、1ゾロは36分の1だが、7の目は1-6, 2-5, 3-4など複数存在する。

正規分布は自然の乱数では多くみられるため、こちらを採用するほうがオーガニックな感触にしやすい。

・自然の乱数は正規分布が多い。
・例えば身長の分布では。平均身長に近いほど人が多く、極端な身長の人ほど少ない。
・ピッチャーの投げる球や、朝起きる時間、歩行速度などのバラツキなど、様々な要素が複雑に絡み合うものは、だいたい正規分布になる。



課題:またたき
乱数を使って星空のようなまたたきを作る。
星には一等星もあれば五等星もある。さまざまな星をシンプルな乱数で実現する。



課題:ランダムウォーク
ランダムに移動するオブジェクトを作ってみよう。
以下のようなものを作ってくらべてみよう。サンプル

・座標がランダムに移動するもの
・速度がランダムに変化していくもの
・加速度がランダムに変化していくもの
・進行方向がランダムに変化していくもの
・進行方向の変化速度がランダムに変化していくもの
・進行方向の変化か速度がランダムに変化していくもの



課題:変異
一定確率で行動パターンや、形状が変化するオブジェクトを作ってみよう。



授業のスケッチ

オレ、例題。


cocoponによるランダムウォークのスタディ

fladdict.netっぽいのできました @fladdict

ikeayさん(@ikeay)が投稿した動画 -


某ギーク女優による、僕のランダムウォーク習作の再現スケッチ。