ビスケットのあれこれ

ビジュアル言語ビスケット(Viscuit)に関するあれこれを書いてゆきます.

作曲マシン

2013-12-29 03:19:47 | 1
ビスケットで音楽を作ります.

一番よくやる方法は,オルゴールと同じで,ステージの上での絵の並び方で曲を表現するという方法です.たとえば,最近YouTubeでも紹介されていましたが,このような作品が一つの例でしょう.これは,すでに誰かが作曲した曲をビスケットに演奏させるというものですね.

それに対して,今回紹介したいのは「ビスケット自身で曲を作る」プログラムです.

作曲マシンの基礎はループをどのように作るかになります.一番簡単には,

のように,1から8までの絵を描いて,それを順に繰り返すようなプログラムです.これで8個分,8分音符としたら8つで4拍の繰り返しを作れます.
メガネの右側に音アイコンを入れるとそのメガネが動いたときに音がでます.音アイコンを複数入れると和音になります.ここには,まだ他のプログラムがありませんから,誰にも邪魔されずに長さが8で繰り返されます.

ところがここに,

のようなメガネを追加します.これは,3が三角にぶつかると8に進む,というものです.三角にぶつからなければ4に進みますが,ぶつかるかどうかはステージでの絵の配置で決まるので,ここでループが崩れて曲が面白くなってきます.
これを実行するとこんな風になります(要Flash).ビスケットの実装が悪くて,リズムが少しよたってしまっていますが.

ここで,音楽の素人なりに,心地よい音楽について考えてみます.重要なのは2点です.

一つは,メガネの右側に入れる音アイコンの種類です.適当に入れて心地よく聞こえるように入れれのでよいのですが,そのコツとしては,5音音階(ペンタトニックスケール)と呼ばれる1オクターブのなかの5つの音を使う,という方法です.Wikipediaでは,中国の音階や琉球音階などが紹介されています.演歌もそうですね.私が一度ワークショップでやったときは,1オクターブの7つの音のなかで使わない音を2つ適当に決めてください.それ以外の5つの音を好きに使ってよいです,という指示を出しました.何か聞いたことがあるような雰囲気になります.

逆に半音階を含む全部の音を使ったからと言って,心地よくないかというとそうでもないのです.そのヒントは,もう一つのポイント,繰り返し構造にあります.最初は変なメロディに感じていた曲も,ある部分が繰り返されるように聞かされると,なぜか心地よくなってくるから不思議です.ただしきっちりと繰り返すのではなく,時々その繰り返しが裏切られたりすると,そこがまたしびれます.

ビスケットでの作曲マシンの肝は,どうやって繰り返し構造を作るかということになります.完全にランダムではダメですし,正確にきっちりと繰り返すのでもダメです.その中間です.ここがビスケットらしい部分になります.

これまで,この「やや繰り返し」を作り出すためにいくつかの方法が発見されてきました.その一つがこれです,

二つの絵の配置で繰り返しを作っています.これで作った演奏はこうなります.それぞれのメガネの指示に従って,二つの絵がぐるぐる回ります.この繰り返しの特徴は時々間違えることです.その間違えが「やや繰り返し」になってくれています.

この一連のメガネの作り方にはコツがあります.適当にやると,すぐにどれか少しのメガネだけで小さな繰り返しが出来てしまって,なかなか面白くなりません.できるだけ長いループを作るのが重要です.

やり方は,まずステージに二つの音符を適当な配置で置きます.そして,それと出来るだけ同じ配置でメガネの左側を作ります.

次に,その配置とはちょっとズレた別の配置をメガネの右側に作ります.すると,ステージの音符はその配置に近くなるように動いて止まります.

もし止まらなかった場合は,今作った右側の配置が左側の配置に近すぎるということなので,そこで止まるようにずらしてください.
次に,その止まった配置と同じものを,新しいメガネの左側に作ります.

そこで,さらにこの二つの配置とも違う新しい配置をメガネの右側に入れます.

すると,そこでアニメーションがまた止まるはずです.これを繰り返して行くと,どうしてもアニメーションが止まらなくなるので,そこでやめます.

整理すると,新しくメガネを作るときは,いま止まっている配置と同じ配置をメガネの左側に入れて,それまでのメガネの左側のどれとも近くないような配置をメガネの右側に入れて,その配置でアニメーションが止まるようにする,ということです.こうすると,長い繰り返しができます.ただし非常に曖昧な方法でループのステップが表現されているので,時々間違えます.この間違えが心地よくなります.時々間違えるとのは,誤差が蓄積して行くことで生じますが,誤差の蓄積の仕方も大体同じなので,間違えるタイミングも大きなループになります.あるフレーズAを3回繰り返すと1回違うフレーズになる,というのが繰り返されます.その誤差の蓄積も多少ずれるのでその全体の繰り返しが長く続くと時々,フレーズAが4回繰り返して1回間違うということが入ったりします.閏年が4年に一度ですが,100年に一度だけは閏年ではない,というのに似ています.

これだけでも楽しいのですが,さらに応用としては,ステージに入れる音符の絵を3つにする,というのがあります.音符は一つだけだと,動かないのでそこで止まっています.二つの組になった音符は音を鳴らしながら少しずつ動いて行きます.止まっている音符とぶつかったとき,3つの音符での相手の組み替えが起こります.3つ交互にペアを組み替えて進む場合もありますし,あっさり乗り換える場合もあります.これも別な不確定要素になります.

もう一つの方法は,2種類の絵で表現します.

回転する楽器と,ハンマーの絵です.楽器は単独では回転します.ハンマーは下に下がります.
楽器の青の部分にハンマーが当たると,楽器は半時計回りに周り,ハンマーは押し上げられ,何か音を出します.楽器のどの色に当たるか,というので5つのメガネが作られています.どれも次に隣の色がハンマーに当たるように回転させています.

ところが,楽器単独は一つ飛ばして回転しています.当たるとハンマーは押し上げられるので,ハンマーが次に楽器にぶつかるまでの間,楽器は素早く回転します.これで次にどの色に当たるのかが非常に微妙になっています.ハンマーが押し上げられる距離も色によって違いますが,ここに乱数の要素は入っていないため,同じ色に当たった場合は毎回同じ距離だけ飛ばされます.ここが繰り返しの要素が入っているところです.繰り返し具合をどれくらい強くするかは,単独の楽器の動きで調整されます.たとえば,単独の楽器が動かなければ,たぶん順番に色を叩くだけになるでしょうが,このように2つ分移動させるとかなりランダムっぽさがかなり増します.

この例では,楽器を沢山置いて,ハンマーも3つ置いています.ハンマーと楽器の組は,動かしているとすこしずつズレるので,別の動いていない楽器に近づいてゆき,そこでハンマーと楽器の組が入れ替わります.

動かしてみるとこうなります.
やってみると,リズムが面白かったので,鳴らす楽器をパーカッションにしてみました.非常に複雑で面白いリズムを聞くことができます.

まとめると,テキトーな音楽理論に基づき,全部の種類の音程を入れずに5種類くらいの音程で作ることと,完全な繰り返しでもなくランダムでもないような構造をいかに作り出すか,が重要であります.

どちらもまだ色々なバリエーションが考えられるでしょうね.

(後で,Flashが見れない人ようにYouTubeで動画をアップする予定です)

じゃんけんのシミュレーション

2013-12-21 12:04:12 | 1
以前,伝染病の感染のシミュレーションを紹介しました.これは指数関数と線形関数の性質を数学を使わずに説明できるというビスケットらしい例ですが.

今回は,3すくみのシミュレーションを作ってみます.



グー,チョキ,パーの絵を描いて,ぶつかると勝った方に絵が変わるというものです.たとえば,グーとチョキがぶつかると,グーが勝つのでチョキがグーに変わります.これを3つ作って.



それぞれの絵が動くようにして,



ステージに5つずつ置いて動かしてみます.どうなるでしょうか.

動画をごらんください.


ぶつかりながら増えたり減ったりします.

パーが優勢になって

とうとうグーを滅ぼしてしまいました.すると,

チョキの天敵が居なくなるので,最後はチョキが優勝するのです.

絵の動く速度やぶつかり方などをちょっと変更すると結果が変わりますが,毎回同じなのは,滅ぼしてしまったものは負けるということです.

考えてみれば当たり前のことなんですが,やってみるまでは中々気がつきませんよね.
生物多様性が重要であるという一つの理由と言ってもいいのではないでしょうか.
あと,一番強いものより二番手がいいということも言えそうですね.

フラッシュが見れる方はこちらもどうぞ.

プログラミングができると,こういうシミュレーションによる実験が簡単にできるということでもあります.筧先生は「プログラミングは脳を拡張する」とおっしゃってましたが,まさにこういう遊びのことですね.

プログラミングは面白い.

未来にプログラミングがどうなるか

2013-12-03 11:31:13 | 1
「IT人材の育成として,今から子供にプログラミングを教えるべき」といっても,その子たちが大人になったときに,今と同じようなプログラミングが残っているのか?それが重要な仕事になっているのか?そういう疑問は当然あります.

未来にプログラミングがどうなるか,これに関しては誰にもわからないとか,未来は自分で作っちゃえ,とかいうよりは,プログラミング言語の研究者たちがどっちを目指して研究しているのか,ということで大体予想がつくと思います.その方向で僕の予想を書きます.

はっきりしているのは「コンピュータがプログラムを書く時代がくる」ということです.僕が博士課程の学生だったころ,研究室の助教授の赤間先生に「原田君,いつまでも人間がプログラムを書いていると思っちゃダメだよ」と散々言われました.僕は,プログラミングが好きで,得意で,研究テーマもオブジェクト指向だったので,要するに人間がプログラムを作る最高峰みたいなのを目指して研究していまして,それを頭ごなしに否定されたわけです.でも,赤間先生のおっしゃることが正しいと思います.先生は,人間が書き易いようなプログラムを考えるのではなく,コンピュータが扱い易いようにすべきと考え,アルゴリズムを直接書いちゃうのではなくて,パターンマッチで書いて,データ構造をものすごくリッチにする,といった研究をされてました.20数年前ですから,今の時代にやりなおせば,当時難しかったことが色々と解決するだろうなと思います.最近,それとはまったく独立して,江木君がEgisonという言語を開発しています.彼とは未踏で知り合いました.これもアルゴリズムを書かないでデータとパターンマッチをリッチにするという方向で,コンピュータがプログラムを書く時代に着々と向かっているわけです.

コンピュータがプログラムを書くと言っても,どういうプログラムが欲しいかは人間が命令しなければならないわけですよね.命令というよりは仕様と言ってもいいのですが.その仕様がそのままプログラムとして動いちゃえばいいのに,という研究の方向もあります.仕様を全部正確に書くのではなくて,最初はいい加減な仕様でよくて,そこで動いた結果を見て,気にいらない部分を直せばいいとか.

これって,ビスケットでやっているプログラミングそのものなんです.メガネは仕様と言ってもよいかもしれません.ビスケットが出来ることはまだまだ幼稚ですけれどね.ビスケットがプログラムに見えないというのは,「仕様が直接動いちゃえばいい」という流れを知らない人の意見です.プログラミング言語が進化すると,人間がコンピュータに最低限伝えなくちゃ行けないことは,どんどん少なくなってきているのです.

「ビスケットを学んだあと,本当のプログラミング言語にどうやって繋いで行くのか」という質問もあるのですが,もしかしたらビスケットが思いっきり進化して,それで済んじゃう時代がくるんじゃないか,という答えもあるんですよね.この先,プログラミングの形そのものが大きく変わります.

この10年はプログラミング言語的には失われた10年という気がします.Webやらスマホやらの勢いがありすぎて,そこでお金も儲かり過ぎて,みんなそこで「何を作るか」ということばかり考えていたと思います.「何を作るか」をあまりにも急ぎすぎると,手っ取り早い確実な技術をだましだまし使うことになります.だからプログラマーが直接プログラムをゴリゴリ書くことが中心になってしまった.でも,その勢いもだいぶ落ち着いてきたので「何を作るか」だけじゃなく「どう作るか」を考える余裕も出てくるのでは無いでしょうか.

未来には新しいプログラミング言語がどんどん出てきて,それがプログラミングを思いっきり簡単にしていきます.


プログラミングは何を学んだことになるのか

2013-12-01 03:55:54 | 1
いろんな方々に「プログラミングは子供の頃から学んだ方がいいですよ」ということを説いているのですけども,いつも聞かれるのが「これをやったら何を学んだことになるの?」という質問です.

良くある答えは「プログラミングをやると論理的な思考が育ちます」なんだけれど,それはもちろん育つでしょうけど,それだけじゃないよね.

まったく説明を止めちゃって「これからは,読み書きプログラミングだ」というかけ声も良く聞きます.これもわかるやつにしかわからない,合い言葉みたいなもので.わからない人を説得する役目にはなっていません.同じように,「他の国ではやられているんですよ」的なのも,外国の物なら無条件でOKな思想を持った人以外は,説得できないです.日本は,海外では一切やっていないようなことでも,いまだにまだやっている国ですから,その作戦はダメなんです.

今日は,もう3年になるのかな.ビスケットをやらせて頂いている,児童館での活動を見学に行ってきました.やらせて頂いているというのは,向こうからぜひやってくれ,というよりは,こちらからぜひやらせてください,というお願いに対して,「よくわからんけど,信用するよ」っていう信頼関係だけです.館長は,PTAや先生に色々と宣伝をしてくださっているそうだけれども,なかなか伝わらないそうで.それで,今日,僕が行ったときに,館長から「プログラミングをやると何を学んだことになるのですか」という,もう直球の質問を頂いたわけです.

この質問に,きっちり答えられなければ,隅々には広がりません.僕が熱く語って「じゃあ信用するよ」というレベルではダメで,それを聞いた人がその人の言葉で他人に説明できなければいけません.

この質問がなぜ難しいのか,というのはずっと考えていて,原因の一つは,コンピュータが特異な発明だった,ということなんだろうと思ってます.

他の山のようにある発明は,何かの差分で説明できます.写真は絵画の差分,自動車は馬車の差分で説明すれば,なんとなくわかります.ところが,コンピュータには前身となる発明が無いのです.まったくこれまでにない新しいものなのです.

もう一つは,コンピュータのすごさが桁違いということです.自動車が馬車よりすごいと言ったって,100倍も速く走ったり,遠くに行けたりはしません.直感がついて行けるすごさというのはそんなレベルです.ところが,コンピュータのすごさで出てくる数字は億とか兆とか.もう,あまりにもすごくてなんだかわからないですよね.

つまり,「コンピュータは何か」を言葉で説明することは出来ない,ということです.あきらめてください.

ところが,近代文明というのは,言葉のおかげで発達できました.言葉による知識伝達というのは,先人の経験を言葉に短縮することで,先人の経験と同じ時間をかけずに先にすすめる,ということです.言葉が無ければ,毎回リセットされて,人生の長さだけしか進歩できません.この言葉による知識伝達があまりにも上手く行ったので,本当は言葉では伝達できない部分が捨てられてきました.それが職人の技だったりするわけですが.

コンピュータも言葉では説明できません.ある程度わかれば,その延長線は想像することができるので,言葉だけでもなんとかなるでしょう.だから,せめて入門の部分までは経験が必要です.

同じことは,料理や音楽にも言えると思います.全員が小学校でカレーライスくらいは調理すると思いますし,普通に生活してて,誰かが料理をしている様子は見ています.この人が一流シェフにならなくても,シェフへの道のりは大体想像できると思います.音楽も,全員がカスタネットやリコーダを演奏したことはあります.この延長線上にプロの音楽家の感動する曲がある,というのがわかります.

じゃあ,料理や音楽をやると何を学んだことになるのか,と聞かれてどう答えればいいのでしょうか.たぶん,どっちも論理的思考は身に付きますね.感性も豊かになる(これもいい加減な言葉ですが)でしょうし.他人を思いやる気持ちも育つと思います.当然,コミュニケーションもですね.それで,プログラミングもほぼ同じ,いろんな能力がつきます.

それに加えて,今日,参加してた小3の女の子が作ったゲームを見て,プログラミングならではの能力が確かにあるなと確信しました.

これは,まだ公開していないAndroidタブレット用のビスケットで作成したのですが,矢を飛ばしてハートに当てるというゲームです.

遊んでいる動画はこれです.
矢を長押しすると,前に進みます.うまくハートに当たればハートが大きくなります.3つのハートを大きくしてください.矢が爆弾に当たると失敗です.

実際に遊ぶには,これです.Flashが必要です.

メガネは

です.実に単純で,矢,ハート,爆弾それぞれが上に進むメガネ,矢を指で触ると前に進む,ハートに矢が当たったとき,爆弾に矢が当たったとき,という6つのメガネだけでできています.必要十分な数ですね.

このゲームのミソは,勝ちだけじゃなくて負けの要素を作っているというところです.しかも,そのバランスがちょうど良くて,矢を押している間だけ前に進む,という仕掛けで,色々と考えないと勝てないようになっており,格段に面白くなってます.僕が遊んでいる動画では,ハートは2つまでしか大きく出来ませんでしたが,慎重にやれば3つ全部ハートを大きくして,矢を生き残らせる大勝利ができるのでしょうね.

ゲームの作り方を教える際に,発射台から弾が出る,という題材を使うことはあります.この場合発射台を押した瞬間に弾が飛び出すので,弾を飛ばすタイミングだけのゲームになります.ところが,このゲームでは,指で押している間,矢が飛ぶとなっているため,コントロールの要素が複雑になり,パズル的な要素まで含まれるようになっています.指を離している間は,矢も上にすすむので,3種類の絵の動き方の速度の比が関係してこのパズルをいっそう難しくしています.ハートより爆弾の動きの方が速いのもにくいです.

このゲームの面白さを言葉で説明するとこんなに大変ですね.ゲームをやってみるとすぐにわかりますが.こんなことが,偶然にできたのかもしれませんが,自分で遊んでどういうバランスが良いのか試行錯誤した結果であることは違いないです.彼女は言葉でこのような説明はできないかもしれません.しかし,面白いゲームをつくるとはどういうことかを直感で理解していることは確かです.他の子はテクニックとしてすごいゲームはありましたが,同学年でちゃんと負けが入っているのは結構少ないです.バランスまでよいのは,かなり少ないです.僕がこうやってわざわざ取り上げて細かく解説するから,他の子のゲームとは違って見えますが,とりあげなければ,絵もそんなに凝ったものではないので,見過ごされるかもしれませんね.

ちなみに,この子は,小1のときからビスケットで遊んでくれて,先輩たちの作ったゲームで遊ぶことはありましたが,自分でゲームを作ったのは小3になってからですね.年に数回ずつやってます.

プログラミングができると,このように面白いゲームとは何か,という(言葉ではない)理解にも迫れました.たまたま,ゲームということで説明しましたけど,プログラミングの対象が違えば,そこには別の何かがあります.その応用範囲の広さが,プログラミングのすごいところです.それも知っている人だけが知っていることですよね.