ビスケットの作り方

よく聞かれる質問に，「ビスケットをやったあと何を勉強すればよいですか」というのがあります．ビスケットは必ずしもコンピュータの専門家を目指していない，すべての人を対象に作りましたが，この質問は，もう少し専門的な方向に進むにはどうしたらよいですか？という意味でしょうね．

それに何と答えたらよいか，これまでずっと考えて来ました．ビスケットの次はスクラッチでしょうという人たちも居るかもしれません．でも僕はやはり本物の言語に進んで欲しいと思っています．もちろん，キーボードの入力ができないといけませんが，その方がずっと何でもできる感がありますから．それに最近の言語は小学校高学年くらいから十分に進めることができるくらい易しく出来てます．

では，その本物の言語で何を作ってもらうか．

もう，ゲームは作らなくていいと思います．というのはゲームはビスケットで十分に作れるからです．ビスケットでは作れないゲームというのもあるにはありますが，売り物・製品としてのゲームに近くなるだけで，ビスケットから比べて作業が大変なわりには，ビスケットでゲームを作ったとき以上の面白さには中々ならないと思うからです．もうちょっとレベルの高いことをやらせたいですね．

で，やはり僕はプログラミング言語を作るということをやってもらいたい．プログラミング言語は，コンピュータのパワーの源みたいなものです．コンピュータが発展して来た理由は，一つがハードウェアがもの凄く進化したこと．どんどん小さく安く高性能になって行った．そしてもう一つのソフトウェア側の理由が，プログラミング言語を作ったことです．プログラミング言語が高性能になればなるほど，簡単にすごいプログラムを作れるようになります．その両輪でコンピュータが発展して来たのだと僕は思っています．

プログラミング言語はどういうものかといっても，それはなかなか何かに例えて説明することは難しいですね．「プログラムは料理のレシピに似ている」ということは良く言われたりしますが，その例えからは，プログラミング言語にまでは行き着かないですね．一つのプログラミング言語を知ったとしても，これから発明されるであろうプログラミング言語の可能性の広がりは想像できないでしょう．結局，プログラミング言語とは何かを知るには，少なくとも二つ以上のプログラミング言語を知っている必要があると思います．

そこで，今回GWに，ビスケット塾をやっているNPO法人デジタルポケットにお願いして，特別講座を開催させてもらうことにしました．Javascriptの入門なんだけど，題材がビスケットを作る，という挑戦です．対象はビスケットを良く知ってて，キーボードがそこそこ打てる人．一応小5以上です．

ビスケットのメガネをどうすればどう動くか，というのは大体わかると思いますが，同じ動きをJavascriptにさせるにはどうしたらよいでしょうか．そういうことを順番に考えて行きます．

もちろんビスケットには，非常に難しいアルゴリズムが入っているので，それを全部つくるということは無理なので．ここでは，ビスケットを少し簡単にしたミニビスケットに挑戦します．少しといっても，ビスケットで作った大抵のゲームはこの範囲で作れてしまいますから，そこそこパワーがありますよ．

プログラミング言語には大きく分けて，コンパイラとインタプリタという2種類があります．最近よく目にする言語はインタプリタが多いですが，それらを裏で支えている言語がコンパイラです．

インタプリタはプログラムを解釈しながら実行し，コンパイラは最初に全部解釈してしまって，一気に実行するというものです．ビスケットは当然インタプリタです．たとえばプログラムの実行中にプログラムの中身を変更すると途中から実行が変わるという面白い性質を持っています．ビスケットもメガネの中を途中でいじると魚の動き方がすぐに変わりますよね．

でも，今回はビスケットのコンパイラに挑戦です．途中でビスケットのプログラムを変更することはできません．まずは今まで通りに，インタプリタのビスケットで動きを作ります．それが完成したら，今度はコンパイラにかけて，そのビスケットのプログラムと同じ動きをするJavascriptのプログラムを生成する，ということです．先ほど言ったミニビスケットというのはここの部分でして，あまり複雑なビスケットのプログラムは受け付けません．限定したビスケットのプログラムだけJavascriptのプログラムになる，ということです．

さて，コンパイラを作るときに，最初によくやるのが，人間が手作業でコンパイラの代わりをすることです．なにかビスケットのプログラムを用意します．そしたら，それと同じ動きをするJavascriptのプログラムを人間がコンパイラになって，変換して行くのです．たとえば，魚が左に進むように作りました．それと同じ動きをするプログラムは魚のx座標を減らして行くことになりますよね．魚がボールにぶつかったとき，すこし跳ね返りました．それはと同じ動きをさせるには，魚とボールがぶつかるかどうかを調べるて，ぶつかったら，それぞれボールと魚の座標を変化させます．

部品が回転しないようにして作れば，ビスケットは結構簡単につくれます．それでもUFOにロケットが当たるゲームとか迷路を抜けるゲームくらいはつくれます．部品が回転できるようにすると，一気に難しくなって，三角関数が登場しますが，これはプログラミング言語とは別の話なので，そういう計算が得意な人だけやればよいです．

コンパイラの良さは，いろんなところで動かしやすいということですね．インタプリタのビスケットはFlashで作られていたので，Flashが動くパソコンじゃないと作れませんでした．ところがコンパイルしてできたJavascriptはスマホやiPadでも動きます．iPad でも自分の作品を見ることだけはできるようになるんですよね．すごいでしょ．

1日だけの講座なのでどれくらい難しいところまで進めることができるか不明ですが，いままでビスケットの中身はブラックボックスだったのが少しはぼんやりと見えるくらいまで行ければよいなと思ってます．目標としては，自分が作ったビスケットのプログラムを自分でJavascriptに変換して，iPad などで見れるようにする，ってところですかね．

ビスケットのデータ構造はXMLなので，本当のコンパイラはこのXMLから自動的にJavascriptのプログラムを生成してくれればよいのですが，それはXMLを操作する方法とかわかればできるようになるかな．


GWスペシャル企画「ビスケットの作り方」

ビスケットの計算幾科学的な解釈

プログラミングは一言で言うとコンピュータに計算をさせる方法を伝えることである．

計算を伝える方法として，一番シンプルなのは，式を使うことである．コンピュータを動かすには動いて欲しい式をコンピュータに入れてやるのである．世界で最初のプログラミング言語FORTRANでは式をコンピュータが読める形式で書いた．その書き方は今でも様々な言語に影響を与えている．たとえば，ある数の二乗を計算させたいとすると， f(x) = x*x のように書く．

計算を伝える別の方法に，計算の例を教えるというものもある．

1が入力されたら1を返す．2が入力されたら4を返す．3が入力されたら9を返す．このように，計算して欲しい計算の具体例を示す．これは，二乗という概念や言葉を知らなかったり，x*xという式を知らなかった場合に使える．

自動プログラミング（コンピュータにプログラムを作らせる）の研究分野では，このような具体例からプログラムを自動生成する「例によるプログラミング PBE: Programming by Example」というのがある．入力と出力の組を幾つか与えて，f(x)=x*xという式を自動生成させるのである．古い研究ではあるが，生成できるときはできるし，難しい問題は全然できない．

さてビスケットはこのPBEに非常に近い動きをする．ただし式は生成せずに直接動く．特に例がたった一つでも動いてしまう．まず「1のときは1を返す」というのを教える．このとき「1の答えは？」という質問には1と答えられる．では「2の答えは？」に対してはたぶん2と答えるだろう．本当は4と答えて欲しかった．しかし「1.1の答えは？」に関しては1.1と答えるが，正しい答え（1.1*1.1 = 1.21）には（2と4の違いよりは）少し近い．教えた計算の例（1ならば1）に対して近い計算は近い答えが返る．

さて，もう少し進めて「2のときは4を返す」というのを二つ目の例として教える．すると，二つの質問「1の答えは？」と「2の答えは？」に関しては正確な答えがもらえる．しかし，「3の答えは？」に関しては多分5を返すであろう（2と3の差は1なので，その差を4に足して5になる）．これも酷い間違えではあるが，最初の1つしか例を与えていなかったときに「3の答えは3である」と答えることから比べるとずいぶんマシになった．本当の答えは3*3で9である（実はビスケットでは線形にしか計算していないので，どんなに例を追加したところでx*xを完璧に再現することはできないのであるが）．

このようにして，コンピュータに計算式を教えることなく，入力と出力の組だけを教えても計算をさせることができる．これがビスケットの計算の仕組みである．

ビスケットが対象にしているのは，数ではなく，絵の配置である．「絵と絵がこのように配置されていたときに，それをこのように配置し直す」という計算である．絵の並べ替えの方法ももちろん厳密な式で記述することができて，それをプログラムにすれば絵を動かすことができる．絵の配置を厳密に制御したい場合はこのようにするしかない．しかし，動かし方をもっと大雑把に伝えるので十分であれば，何も厳密な式など使わなくても，ビスケットの方法でよいだろう（ビスケットがまあまあ上手く行っているように見えるのは，絵の配置はパラメータが多く，式で表現するには複雑になることと，絵の配置で非線形な関数での並べ替えはあまりやらないからだろう）．

関数の入力と出力の組を与えるというのは，関数の仕様を与えると言っても良い．伝統的なスタイルでは仕様が与えられて，それを満足する計算の手順を組み立てるのがプログラミングであると定義される．一方で近代的には，仕様からプログラムを自動生成したり，ビスケットのように仕様のままコンピュータが動いたりというのも存在する．その場合に，今度はコンピュータにわかるように仕様を与えることが上位のプログラミングと考えることができる．

ビスケットの目的は少なくとも伝統的なプログラミングの教育ではない．仕様から手順への変換スキルは不要である．それをすっとばして，仕様を考えることに専念できる．それによって，コンピュータとはどういうものかを体験で理解する，ということなのである．


プログラミング教育を色々なツールで教えている人たちはもう一度よく考えて欲しい．仕様から手順への変換スキルを身につけさせたいのか，よい仕様を考えるスキルを身につけさせたいのか．