ストリングドロップゴムひもと玉で作曲する音楽ゲーム（無料・ブラウザ）

遊び方 — ひもを張り、玉を落として曲にする

1. ひもを張る：盤面を指やマウスでなぞると、なぞった線にゴムひもが1本張られます。短いひもほど高い音です。ひもは20本まで張れます。鳴っている途中でも張れます——音は止まりません。
2. 張力を変える：ひもを軽くタップすると選ばれます（青く光ります）。張力のつまみを動かすと、強く張るほど高い音になり、同時にたわみが浅くなります。ゆるめると深く垂れて音が下がります。音名はつまみの右に出ます。
3. 穴に玉を割り当てる：盤面の上には穴が5つあります。穴のボタンを押して選び、その下の列で木・ガラス・金属・ゴム・石のどれを落とすか決めます。玉の種類で音色も跳ね方も変わります。
4. リズムを打ち込む：いちばん下の16個のマスが1周分のリズムです（8分音符×16＝2小節）。押した拍でその穴から玉が落ちます。
5. 再生：再生を押すと最初から流れます。音が出るのはこのボタンを押したあとだけです。ブラウザが操作なしの自動再生を止めるので、それまでは音の仕組みそのものを起動していません。再生したあとは、ひもを足しても玉を変えてもテンポを動かしても止まりません。
6. 盤面を見わたす：盤面は画面より広く 960×1280 あります。表示のつまみで拡大縮小、全体で盤面まるごと、盤面を動かすでドラッグして移動できます。スマホは2本指でつまむ、パソコンはホイールでも拡大縮小できます。右上の小さな地図が、いまどこを見ているかを示します。
7. 共有：共有リンクを押すとURLが1本できます。その1本に、ひもの位置と張力・穴の玉とリズム・テンポ・音階・乱数の種まで入っています。

音の高さは弦の式そのままです

このゲームの音程は、当てずっぽうの数式ではなく弦の基本振動数の式で決めています。

f = (1 / 2L) × √(T / μ)

L はひもの長さ、T は張力、μ はひもの線密度（1メートルあたりの重さ）です。ここから読み取れることは2つです。

• 周波数は長さに反比例する：ひもを半分の長さにすると、音はちょうど1オクターブ上がります。ギターで弦の真ん中を押さえると1オクターブ上がるのと同じ理屈です。
• 周波数は張力の平方根に比例する：張力を4倍にすると音は2倍の周波数、つまり1オクターブ上がります。2倍にしただけでは1オクターブ上がらず、約7半音（完全5度）ぶんです。

「たわみ」はこの張力を目に見せるためのものです。両端を留めた重いひもは放物線に垂れ、その垂れ幅 s は

s = w L² / (8T)（w はひも1メートルあたりの重さ）

で決まります。張力が小さいほど深く垂れ、同じ張力ならひもが長いほど二乗で深く垂れます。つまり「深く垂れているひも＝張力が小さい＝音が低い」が、数字を読まなくても形だけで分かります。垂れたひもは当たり判定もそのままの形で下に膨らんでいるので、玉はたわみの底へ転がっていきます。

ひとつだけ現実と合わせられなかったところがあります。目に見えるほど垂れるゴムひもの振動数は数ヘルツしかなく、そのままでは耳に聞こえません。そこで出力する周波数を一律に7オクターブ（128倍）持ち上げています。倍率はすべてのひもで同じ定数なので、長さと張力の関係は1ミリも崩れません。持ち上げたあとの生の周波数は、選んだ音階のいちばん近い音へ寄せて（スナップして）から鳴らします。これをしないと、微妙に外れた音だらけになって曲になりません。

玉の種類と音色

穴ごとに割り当てる玉が、音色と跳ね方の両方を決めます。波形は Web Audio API のオシレータで合成していて、音源ファイルは1バイトも読み込んでいません。

跳ね返りの数字は、以前より全体で1.5倍ほど上げてあります（木は0.60、石は0.26でした）。1回鳴って落ちるだけの玉が多く、音数が足りずに曲にならなかったからです。いまは玉ひとつで4〜6割多く鳴ります。0.9を超えると跳ね上がりすぎて次に当たるまでが遠くなり、かえって鳴る回数が減るので、そこまでは上げていません。

移調はオクターブ単位だけにしてあります。半音単位でずらすと、同じひもなのに玉によって和音が濁ってしまうためです。オクターブなら重ねても濁りません。

重さと跳ね返り係数はリズムのほうに効きます。跳ね返りの大きいガラスは1本のひもの上で何度も跳ねて連打になり、跳ねにくい石は数回鳴って落ちていきます。空気抵抗を重さで割って掛けているので、軽い玉ほど落ちるのが遅く、同じ拍に落としても着弾の間合いがずれます。同じ配置でも、穴に割り当てる玉を変えるだけで曲が変わります。

盤面は広く、音は止めません

盤面は960×1280です。もとは480×640で、跳ねた玉がすぐ端に着いて終わってしまい、フレーズが伸びませんでした。縦横を2倍（面積で4倍）にしたので、玉は何度も跳ねながら下へ渡っていけます。張れるひもも14本から20本に増やしました。

広げたぶん、画面には入りきりません。そこで表示の拡大縮小を付けました。つまみで45%〜200%、全体で盤面まるごと、盤面を動かすを選ぶとドラッグで見る場所を変えられます。スマホなら2本指でつまむ、パソコンならホイールでも動きます。右上の小さな地図に盤面ぜんぶといま見ている枠が出るので、拡大していても迷いません。拡大縮小は見え方だけの話で、物理にも音にも一切効きません。200%で作った曲と45%で作った曲は同じように鳴ります。

そしてもうひとつ、ひもを張っても曲は止まりません。以前は1本張るたびに玉を出し直していたので、そのたびに音が途切れ、いま何を作っていたのか分からなくなっていました。いまは落ちている玉も拍もそのままで、ひもだけが増えます。消すときも、玉の種類を変えるときも、テンポを動かすときも同じです。テンポを変えたときは時計だけを張り替えて、同じ拍の同じ位置に居させています（そうしないと、拍の番号が飛んで玉がまとめて湧きます）。作り直すのは、お手本に戻す・全消去・共有された曲を取り込む・再生ボタンを押し直す、の4つだけです。

同じ配置なら必ず同じ曲になります

玉が同じ点にきれいに積み上がらないよう、落とす位置に±1.5ピクセルのごく小さなばらつきを入れています。このばらつきは乱数の種から決まる疑似乱数で、種は曲そのものと一緒に持ち回しています（共有リンクにも入っています）。物理計算は1秒を120等分した固定の刻みで進めているので、画面のなめらかさや端末の速さで結果が変わることもありません。共有したリンクを開いた相手の画面でも、同じ順番・同じ間合いで同じ音が鳴ります。

共有のしくみ

共有リンクは ?s= のうしろに曲を畳み込んだ文字列です。サーバーには何も置かず、外部への送信もありません。数値はすべて36進法にして、区切りには encodeURIComponent がそのまま通す記号（*・!・~）を使っています。カンマや縦棒を使うと %2C のように3文字へ膨らみ、それだけでURLの長さを食うためです。

畳んでいるのは、テンポ・音階・乱数の種、ひも1本ごとの両端の座標と張力、穴ごとの玉の種類と16ビットのリズムです。全部入れても400文字ほどで、上限の1800文字にはまず届きません。それでも超えたときはあとから張ったひもから順に落として、穴とリズムだけは必ず残します。何を落としたかは画面に出ます。

リンクを開いた側では、いきなり曲が差し替わることはありません。画面の上に案内が出て、取り込むを押したときだけその曲になります。せっかく作りかけていたものが、リンクを踏んだだけで消えるのを避けるためです。

盤面を広げたので、先頭の目印は sd1（480×640）から sd2（960×1280）へ上がりました。古い sd1 のリンクはこれまでどおり開けます。読むときに横へ240px ずらして、広い盤面の同じ場所へ置き直しているだけだからです。ひもの長さは1ミリも変えていないので音の高さはそのまま、穴の間隔も80pxのまま動かしていないので玉が落ちてくる位置も同じです。つまり古いリンクは、広くなった盤面の真ん中で同じ曲として鳴ります（跳ね返りを上げたぶん、鳴る回数だけは増えます）。ブラウザに保存してある作りかけも同じ扱いなので、開き直しても消えません。

音が割れないようにしていること

• 同時発音は10音まで：跳ね返りが増えると音が重なって飽和し、耳障りな割れ方をします。上限に達したときは、新しい音を捨てるのではなくいちばん古い音の尾を切って場所を空けます。新しいほうを捨てると拍の頭が抜けてリズムが崩れるためです。
• 同じひもは0.055秒あけて鳴らす：玉がひもの上で細かく震えると、1回の着地が何十回もの発音になってしまいます。
• 弱すぎる当たりは鳴らさない：ひもの上で転がっているだけの接触は音にしません。当たった速さがそのまま音量になります。
• 玉は8秒で消える：たわみの底に玉がたまり続けると、鳴りっぱなしになるうえ計算も重くなります。盤面に出ていられるのは64個までです。

作曲のコツ

• まず高さの階段を作る：長さの違うひもを上から下へ3〜4本、少しずつ角度をずらして並べると、玉が1個落ちるだけで分散和音になります。
• 低いひもは長く、ゆるく：ベースにしたい音は、長く張ってから張力を下げてください。深く垂れるので見た目でもすぐ分かります。
• 拍の頭は石か木：減衰の短い玉は輪郭がはっきりします。ガラスや金属は伸びるので、裏拍にまばらに置くほうがきれいに聞こえます。
• ひもを跨がせる：長いひもの端に短いひもの端を寄せると、跳ねた玉が次のひもへ渡ってフレーズになります。狙って作れるようになると一気に曲らしくなります。
• 傾きを互い違いにする：玉は斜面に垂直な向きへ跳ね返るので、右下がりのひもは玉を右へ、右上がりのひもは左へ飛ばします。同じ向きばかり並べると玉は一方向へ逃げて端で終わります。行ごとに向きを入れ替えると左右へ折り返しながら下りていき、1個の玉が何本ものひもを鳴らします。お手本の曲がその形です。
• 下まで使う：盤面は画面よりずっと下まであります。上で作った音が落ちてくる先に受け皿のひもを置くと、そのぶん曲が伸びます。全体表示にして、玉がどこへ飛んでいるかを見てから置き場所を決めてください。
• 音階を変えて印象を変える：同じ配置のまま音階をマイナーペンタや琉球に変えると、寄せ先の音だけが変わって曲の表情が変わります。半音（12音）にすると寄せがほとんど効かないので、物理そのままの不安定な響きになります。

よくある質問

ストリングドロップはどうやって遊びますか？

盤面を指でなぞるとゴムひもが1本張られます。上には5つの穴があり、再生を押すとリズムに合わせて玉が落ちてきます。玉がひもに当たると、そのひもの音が鳴ります。ひもを増やして高さと角度を変えれば和音や旋律になり、穴のリズムを変えれば拍が変わります。鳴っている途中でもひもは足せて、そのとき音は止まりません。音は最初に画面を触るまで鳴りません。ブラウザが自動再生を止めるからです。

音の高さはどうやって決まりますか？

弦の基本振動数の式をそのまま使っています。周波数 f は f = (1/2L)×√(T/μ) で、L はひもの長さ、T は張力、μ はひもの線密度です。つまり長さを半分にすると音は1オクターブ上がり、張力を4倍にすると1オクターブ上がります。強く張ったひもはたわみが小さくなり、ゆるいひもは深く垂れます。たわみ s は s = wL²/(8T) で表示していて、垂れているほど張力が小さく、音が低いという関係が目で見えます。実寸のゴムひもの振動数は数ヘルツしかなく耳に聞こえないので、全体を7オクターブ（128倍）持ち上げて鳴らしています。倍率は全部のひもで同じなので、長さと張力の関係は崩れません。

穴によって出てくる玉が違うのはなぜですか？

穴ごとに玉の種類を割り当てられるようにしてあり、玉の種類が音色を決めるからです。木は三角波でほどよい減衰、ガラスは正弦波で長く伸びる鈴の音、金属はのこぎり波で倍音が多く硬い音、ゴムは正弦波を一瞬で切った鈍い低音、石は矩形波を短く切った硬い低音です。さらに玉ごとに重さと跳ね返り係数が違うので、同じひもに落としても跳ねる回数と間合いが変わります。音色だけでなくリズムまで変わるので、穴の割り当てが作曲の一部になります。

作った曲を人に渡せますか？

渡せます。共有リンクを押すと、ひもの位置と張力、穴の玉と16ステップのリズム、テンポ、音階、乱数の種をすべて1本のURLに畳み込みます。サーバーには何も置かず、外部への送信もありません。受け取った人がそのURLを開くと画面の上に案内が出て、取り込むを押したときだけその曲に差し替わります。玉のばらつきに使う乱数の種もURLに入っているので、相手の画面でも同じ曲が鳴ります。盤面を480×640から960×1280へ広げたときに版を sd1 から sd2 へ上げましたが、古い sd1 のリンクもそのまま開けます。読むときに広い盤面の同じ場所へ置き直しているだけで、ひもの長さも穴の間隔も変えていないので、音の高さも玉が落ちてくる位置も同じです。

音が鳴りません。どうすればいいですか？

まず再生ボタンを押してください。ブラウザは操作なしに音を出すことを禁じているので、最初のタップやクリックまで音の仕組みそのものを起動していません。次にミュートが入っていないか確かめてください。玉がまだ落ちきっていないだけのこともあります。玉はひもに当たったときだけ鳴り、当たり方が弱すぎるときと、同じひもが0.055秒以内に続けて鳴るときは鳴らしません。跳ね返りが増えると音が飽和して割れるので、同時に鳴らす音は10個までに制限しています。

盤面が画面に入りきりません。全体を見るには？

盤面は960×1280あり、はじめは全体が入る倍率で表示しています。表示のつまみで45%から200%まで拡大縮小でき、全体を押すと盤面まるごとに戻ります。盤面を動かすを選ぶとドラッグで見る場所を変えられ、スマートフォンなら2本指でつまむ、パソコンならホイールでも拡大縮小できます。右上の小さな地図に、盤面ぜんぶといま見ている範囲が出ます。拡大縮小は見え方だけのもので、物理にも音にも影響しません。倍率を変えても同じ曲が同じように鳴ります。

ひもを足すと曲が最初から始まってしまいますか？

始まりません。以前はひもを1本張るたびに玉を出し直していたので音が途切れていましたが、いまは落ちている玉も拍もそのままで、ひもだけが増えます。ひもを消すとき、穴の玉の種類を変えるとき、テンポを動かすときも同じで、曲は流れ続けます。最初からになるのは、お手本に戻す・全消去・共有された曲を取り込む・再生ボタンを押し直す、の4つだけです。

データは保存・送信されますか？

作った曲はお使いのブラウザのlocalStorageに保存され、次に開いたときに復元されます。計算も音の合成もすべてブラウザの中で完結し、外部サーバーへの送信は一切ありません。音源ファイルもダウンロードしておらず、すべてWeb Audio APIでその場で合成しています。