ドラムマシン、シンセ、サンプラーがわずか数分で完成。非プログラマーなのにClaude + Artifactsのプロンプト開発が楽しすぎて限度超える(CloseBox)

テクノロジー AI
松尾公也

テクノエッジ編集部 シニアエディター / コミュニティストラテジスト @mazzo

特集

ドラムマシン、シンセ、サンプラーがわずか数分で完成。非プログラマーなのにClaude + Artifactsのプロンプト開発が楽しすぎて限度超える(CloseBox)
  • ドラムマシン、シンセ、サンプラーがわずか数分で完成。非プログラマーなのにClaude + Artifactsのプロンプト開発が楽しすぎて限度超える(CloseBox)
  • ドラムマシン、シンセ、サンプラーがわずか数分で完成。非プログラマーなのにClaude + Artifactsのプロンプト開発が楽しすぎて限度超える(CloseBox)
  • ドラムマシン、シンセ、サンプラーがわずか数分で完成。非プログラマーなのにClaude + Artifactsのプロンプト開発が楽しすぎて限度超える(CloseBox)
  • ドラムマシン、シンセ、サンプラーがわずか数分で完成。非プログラマーなのにClaude + Artifactsのプロンプト開発が楽しすぎて限度超える(CloseBox)
  • ドラムマシン、シンセ、サンプラーがわずか数分で完成。非プログラマーなのにClaude + Artifactsのプロンプト開発が楽しすぎて限度超える(CloseBox)
  • ドラムマシン、シンセ、サンプラーがわずか数分で完成。非プログラマーなのにClaude + Artifactsのプロンプト開発が楽しすぎて限度超える(CloseBox)
  • ドラムマシン、シンセ、サンプラーがわずか数分で完成。非プログラマーなのにClaude + Artifactsのプロンプト開発が楽しすぎて限度超える(CloseBox)
  • ドラムマシン、シンセ、サンプラーがわずか数分で完成。非プログラマーなのにClaude + Artifactsのプロンプト開発が楽しすぎて限度超える(CloseBox)

筆者のコンピュータ歴は22歳で買った8bitマシンMZ-80K2Eから数えると42年になりますが、BASICですらまともなプログラムを組めたことはありません。そんなノンプログラマーな自分が、大規模言語モデル(LLM)の助力で、初めてまともに動くプログラムを完成させることができました。

16ステップのドラムマシンやら数字キーを押すと指定したコードを弾けるアナログシンセサイザーやらキーボードで演奏するサンプラーなんかが、それぞれ数分で出来上がったのです。楽器アプリが簡単に作れるよと言われて試した開発環境はいくつもありますが、どれも途中で挫折、というかとっかかりすらわからないままでした。

今回、プロンプトを使ったソフト開発を試すことになったきっかけは、Claude 3.5で100和音のアンビエントシンセサイザーを作ったというこちらの記事。

Claude3.5、シンセサイザーつくれてすごい

使ったのは簡単なプロンプトだけ。ChatGPTやGeminiと並ぶ性能を持つClaudeの最新・最強版であるClaude 3.5 Sonnetで実験的に導入されているArtifactsという機能を活用したものです。

Claudeは月額20ドルのProプランにも入ってるし、SunoやUdioなどのAI作曲周りで活用しているので自分もできるのではと思い、記事の最初に書かれているプロンプトだけ読んだら「これはできそう!」とClaudeを開いてトライ開始。

■Artifactsはどうすれば使える?

ただ、Artifactsの設定がわかりません。Claudeにどうすれば使えるのか聞いてもダメ。

(▲Claude自身に聞いてもわからない)

結局、画面下の自分のアイコンをクリックして表示される設定画面からFeature Previewをクリックすると出てきました。

(▲Artifactsの設定をオンにしておく)

ここでArtifactsをオンにすると使えるようになります。

Artifactsとは、Claudeにコードスニペット、テキストドキュメント、ウェブサイトデザインなどのコンテンツを生成するよう依頼すると、対話ウィンドウの右に新しいペインが表示され、これらのコンテンツが表示されるという仕組みです。

他のLLMでも対話によってコードを生成してくれるものがありますが、Artifactsでは対話を続けながらコードが表示され、しかもプレビューで実行できます。開発環境なしでプログラムがスムーズに組み上がっていくのは快適というか驚きですね。

■アナログシンセサイザーを作る

今回Claudeに出した最初の指示は、「ブラウザで動く簡単なアナログシンセサイザーを作って」。

質問への回答は左側に、そのコードを走らせた画面が右に表示され、再生ボタンを押すと、すぐに音が出ました。シンセサイザーの波形もサイン波、矩形波、のこぎり波、三角波としっかり基本を押さえています。その辺は指示してないのですが。

音高をスライダーで変えるのは寂しいので、アルペジオを実装してみました。これも一発でできました。

次にハイパスフィルターとレゾナンスを実装させます。ローパスフィルターにすべきところを間違って指示してしまいましたが、あとで修正すればいいか。

このあとはバグが出たり、バグフィックスしたら以前にあった機能がなくなったのを戻させたり、外注プログラマーの管理をしているような気分になりました。

一応の完成形がこちら。

VCO選択、ローパスフィルターとレゾナンスによるVCF、ADSRのエンベロープジェネレーターという、アナログシンセサイザーの基本構造はこれで出来上がりました。実はもっと機能を突っ込もうと思ったのですが、バグがやたらと出てくるのでここまで。

アルペジオだけの演奏はあまり面白くありません。画面も洗練されてないし。もうちょっと手軽に演奏してる感が出るやつないかな……。そうだ、ドラムマシンにしよう!

■16ステップドラムマシンを作ろう

画面設計をいい感じにしてくれるなら「Reactで」を入れればいいらしいというあやふやな知識から、「16ステップのドラムマシンをReactで実装して」と命令しました。

すると、回答とともに動く実装が表示。前のシンセと比べて色がついてるしダイナミックに表示が変わっていきます。

キック、スネア、ハイハット、クラップがそれぞれ16ステップで左から右に流れていく、一般的なドラムマシンが使えるようになりました。こんな適当なプロンプトでもできちゃうのです。

何度かバグのやり取りをしたあとでできたのがこちら。音色をリアルなものに変更するようにしたら、なかなか使えるサウンドになりました。再生中に入力するとちょっともたりますが、そういえばiPhoneアプリのドラムマシンって初期はこんな感じだったなと懐かしくなりました。このアプリ、iPhoneでも動くか後でやってみよう。

ドラムマシンはひとまず完成。では次は何をしようかと考えたところ、先日クラウドファンディングが開始された「かんぷれ」みたいなものを自分でも作れないかと思いつきました。


クラファン版かんぷれは、もともとインスタコードの基本機能をWebブラウザで動くようにしたプログラムをさらにハードウェア実装したというもの。その基本部分のとっかかり的なものを自分なりにやってみようというわけです。

そのかんぷれは現在48%の達成率。まだの人はぜひ。

■コード弾き専用シンセサイザーを作りたい

今回はちまちま機能を追加するのではなく、最初から機能を盛り込んでみました。「Reactを使って、楽器のコードをC、Dm、Em、F、G、Am、Bm7-5でボタンを押すだけで演奏できるシンセサイザーを実装して。音色はピアノ、オルガン、フルートから選べるようにして」と命令。これも一発でできました。

ただ、音が出るのは押している間だけなので、演奏が途切れがち。ここはやはり通常のシンセのフィルターとADSRが必要か、ということで、追加しました。半音ずつ音を上下できるようにしたり、その際にコードネームも変わるようにしたり、音が歪んでいるのを修正させたり、コードを追加したり。バグ取りと、バグ修正したときのデグレード(というんだという話を米国在住ソフトウェアエンジニアから聞きました)対策はたくさん。

この辺は、実際にソフトウェア開発に携わっていると、そういうことが起きにくいような対策があるそうです。みなさん大変ですね。

それで出来上がったのがこちら。

これもちゃんと動いています。

このほかにもMMLでシーケンスできるようにしたり、新しいコードを作れるようにしたり、アルペジオ対応にしたり、といった機能案はあるのですが、Claudeがげ利用限度超過に引っかかり、それ以上は進めなくなってしまいました。実は3回ほど引っかかってます。

そのリミットがなければこの週末はずっとやっていたことでしょう。

実際にコードを書いたり修正したりしているわけではありませんが、自分のアイデアをすぐに実装してくれるパートナーがいつもそばにいる(利用制限内なら)というのは実に心強いものですね。

筆者はこれまでHyperCard、ファイルメーカーPro、AppleScriptなどでわりと実用的なスクリプトも組んでいましたが、このような体験はまったくの新感覚です。

自分では全くコードを書くことなく、だけれどもプログラムが作られる過程の中にいる喜びが得られる。

そしてまた別のものを作ってみました。今度はサンプラーです。

■サンプラーを作る

今度は、キーボードのキーに割り当てた音源を再生するサンプラーです。正確にはサンプラーのプレイヤー部分ですね。

命令は「Reactで、英数字キーに割り当てられるサンプラーを作って。それぞれのキーを押すとWAVやMP3を再生できるようにして」。

試行錯誤した結果できたのは、AからKまでのキーに、読み込んだ音源ファイルを割り当てるというもの。Claudeからの提案で、音量、リバーブ、ディレイのスライダーを追加しました。波形の表示も提案されて実装はしてくれたのですが、これはうまく動かず。

ここで再び限度超えにて終了となりました。

波形表示以外はちゃんと動いてます。作ったあとで気づいたのですが、キーを押せばアルファベットをしゃべってくれるというTexus InstrumentsのSpeak & Spellじゃないですかこれ。ただし自分の声。

(▲マイコン博物館で見つけたSpeak & Spell)

そして思い出したのが、トッド・ラングレンのソロとしての初来日があった1988年のステージ。この時はバンドメンバーなしで弾き語りで演奏していたのですが、その時に、Macintoshのキーボードだけを使ってカチャカチャ演奏しているシーンがありました。その時に使っていたのが、Super Studio Sessionというアプリ。キーに楽器音がアサインされているという、僕が作ったやつの進化版みたいなソフトでした。


これを開発したのは、初代MacintoshやNewton開発の中核人物であったスティーブ・キャップス。ギタースタイルのガジェット楽器であるジャミネーター(フレットにギターソロのフレーズがアサインされている)も彼の作品でした。

(▲我が家に2本あるジャミネーターのうち1本はスティーブ・キャップスのサイン入り)

自分は結局こういうのが大好物なわけで、それに近いソフトの開発を曲がりなりにも追体験できるというのはやはり楽しいのです。

翌朝(今日)、Claudeの制限が解除されたのでまた続きを。今度はQWERTY配列にして、すべてのアルファベットに対応させました。やっぱり楽しい!

ちなみにこのプログラムはHTMLファイル1つだけなので、保存してダブルクリックするとすぐに起動します(ダウンロードリンク)。

■FMシンセも作りました

またできてしまいました。今度はPCのキーボードで演奏できるFM音源シンセサイザーです。

DX7っぽいデザインでと指定したのに、黒っぽい画面だけが反映されているのはまあいいとして、よくできました。

特に指定していないのにポリフォニックになっているし、後で追加したらいい機能も提案してくれました。有能です。掛け算する波形の組み合わせとかプリセットとかも入っていますし、リバーブ、ディレイといったエフェクトも追加しました。

《松尾公也》

松尾公也

テクノエッジ編集部 シニアエディター / コミュニティストラテジスト @mazzo

特集

BECOME A MEMBER

テクノエッジ友の会に登録しませんか?

今週の記事をまとめてチェックできるニュースレターを配信中。会員限定の独自コンテンツのほか、イベント案内なども優先的にお届けします。