このページの本文へ

日曜プログラマー大歓迎 JavaScriptの部屋 第14回

JavaScriptでチップチューンふう楽曲を自動演奏

懐かしのゲーム音楽の音色でお手軽作曲

2017年04月25日 18時00分更新

文● 加藤兄 プログラム作成・監修●松下浩則

  • この記事をはてなブックマークに追加
  • 本文印刷

●登場人物

尾地定数(おじ・さだかず) 自称「日曜プログラマー」。芽衣のおじ。

開発芽衣(かいほつ・めい) 尾地のめいで、近所に住む中学生。

おじ 矩形波とかノコギリ波とか懐かしかったなあ。
めい 4月25日発売の週刊アスキーNo.1124で取り扱った「ミュージック・シーケンサー」の音の話よね。
おじ JavaScriptで、ああいう昔のゲーム機みたいな音が出せるとは思わなかった。ゲーム機っていうか、パソコンもああいう「ビー」とか「ポー」みたいな音で、音楽を鳴らしていたんだ。
めい ふーん。昔の音なんだろうけど、私たちにもちょっと目新しく感じるわ。
おじ 1周まわって、ってやつか。それはそうと、今回のミュージック・シーケンサーについて説明してよ。
めい えっと、画面にドレミファソラシの7音とそれぞれ24列ぶんのボタンがあって、鳴らしたい音を緑色にしておくのよね。で、「PLAY」ボタンを押すとその通りに演奏してくれてくれるというやつ。
おじ つまり、自動演奏プログラムだね。

めい 一番右までいったら、また左から演奏を繰り返すんだった。ミニ作曲ソフトみたいな感じ。
おじ 音を鳴らすのは、前にやった「ミニピアノ」と同じくWeb Audio APIを使っていたね。
めい たしか「オシレータ―・ノード」とかいうのに周波数を設定して、「ゲイン・ノード」とかいうのに音の大きさを設定して、あとなんだっけ?
おじ 「デスティネーション・ノード」である、PCのスピーカーに接続。オシレータ―・ノードには波形を設定できたよね。
めい あ、そうそう! 波形だ波形。おじさんが最初に言ってた「くけいは」とか4種類から選べるんだった。

おじ それから、指定した時間だけ音を鳴らす方法も教えてもらったね。このプログラムでは0.2秒間だけ鳴らすっていう指定だった。結構、短い間隔で鳴らせるんだね。
めい うーん、そのへんよく覚えてないけど……あとまた画面はキャンバスに描いてるんじゃなくてボタンをいっぱ並べて作ってるんだった。
おじ なんで?
めい さあ?
おじ やっぱりか。まぁ詳しくは誌面を読んでもらうとして、プログラムは次のとおり。

めい 音程の数とか列の数とか増やせば、もうちょっと作曲っぽいこともできるかな?
おじ プログラムのどこをいじればいいのかわかる? 行番号9行から11行が音程の数、13行の24っていうのが列の数だね。
めい 読者のみなさんも、これを参考になんかおもしろい音楽のプログラムとか作ってみてね。
おじ おもしろいプログラムができたら、ぜひ投稿してください。

めい お待ちしてます~。

★アスキーの有料会員サービス「ASCII倶楽部」会員の方は、下記リンクをクリックすると直接ページが開きます。

日曜プログラマー大歓迎
JavaScriptの部屋

週刊アスキーNo.1124はBOOK☆WALKER、Kindle、kobo等電子書店で発売中!

週刊アスキー No.1124 (2017年4月25日発行)[Amazon]

電子版週刊アスキーの購入はこちらから

カテゴリートップへ

この連載の記事

注目ニュース

ASCII倶楽部

プレミアムPC試用レポート

ピックアップ

ASCII.jp RSS2.0 配信中

ASCII.jpメール デジタルMac/iPodマガジン