- プロンプト実行例
こんにちは！
かっこいい曲
かっこいいロック調のBGMを生成します。力強いベースラインとエネルギッシュなリズムを特徴としています。
html
1<!DOCTYPE html>
2<html>
3<head>
4 <title>Cool Rock BGM</title>
5 <style>
6 button {
7 padding: 10px 20px;
8 font-size: 16px;
9 margin: 10px;
10 }
11 </style>
12</head>
13<body>
14 <button onclick="startBGM()">Play</button>
15 <button onclick="stopBGM()">Stop</button>
16 <input type="range" min="0" max="100" value="70" oninput="changeVolume(this.value)">
17
18<script>
19let audioContext;
20let gainNode;
21let isPlaying = false;
22let scheduledNotes = [];
23
24const BPM = 140;
25const BEAT_LENGTH = 60 / BPM;
26
27function initAudio() {
28 audioContext = new (window.AudioContext || window.webkitAudioContext)();
29 gainNode = audioContext.createGain();
30 gainNode.connect(audioContext.destination);
31 gainNode.gain.value = 0.7;
32}
33
34function createOscillator(freq, type, startTime, duration) {
35 const osc = audioContext.createOscillator();
36 const oscGain = audioContext.createGain();
37
38 osc.type = type;
39 osc.frequency.value = freq;
40
41 oscGain.gain.setValueAtTime(0, startTime);
42 oscGain.gain.linearRampToValueAtTime(0.3, startTime + 0.01);
43 oscGain.gain.linearRampToValueAtTime(0, startTime + duration);
44
45 osc.connect(oscGain);
46 oscGain.connect(gainNode);
47
48 return osc;
49}
50
51const bassline = [
52 { note: 49, duration: 0.5 }, // G1
53 { note: 49, duration: 0.5 },
54 { note: 46, duration: 0.5 }, // F#1
55 { note: 49, duration: 0.5 },
56];
57
58const melody = [
59 { note: 73, duration: 0.25 }, // G4
60 { note: 71, duration: 0.25 }, // F4
61 { note: 68, duration: 0.25 }, // D4
62 { note: 71, duration: 0.25 }, // F4
63];
64
65function noteToFreq(note) {
66 return 440 * Math.pow(2, (note - 69) / 12);
67}
68
69function playSequence(startTime) {
70 const sequenceLength = 2; // 2秒で1ループ
71
72 // ベースライン
73 bassline.forEach((note, index) => {
74 const freq = noteToFreq(note.note);
75 const osc = createOscillator(freq, 'sawtooth',
76 startTime + index * BEAT_LENGTH,
77 note.duration);
78 osc.start(startTime + index * BEAT_LENGTH);
79 osc.stop(startTime + index * BEAT_LENGTH + note.duration);
80 scheduledNotes.push(osc);
81 });
82
83 // メロディ
84 melody.forEach((note, index) => {
85 const freq = noteToFreq(note.note);
86 const osc = createOscillator(freq, 'square',
87 startTime + index * BEAT_LENGTH,
88 note.duration);
89 osc.start(startTime + index * BEAT_LENGTH);
90 osc.stop(startTime + index * BEAT_LENGTH + note.duration);
91 scheduledNotes.push(osc);
92 });
93
94 // ドラム的なノイズ
95 for (let i = 0; i < 4; i++) {
96 const noiseOsc = createOscillator(150 + Math.random() * 50, 'square',
97 startTime + i * BEAT_LENGTH,
98 0.1);
99 noiseOsc.start(startTime + i * BEAT_LENGTH);
100 noiseOsc.stop(startTime + i * BEAT_LENGTH + 0.1);
101 scheduledNotes.push(noiseOsc);
102 }
103
104 if (isPlaying) {
105 setTimeout(() => {
106 playSequence(startTime + sequenceLength);
107 }, (sequenceLength - 0.1) * 1000);
108 }
109}
110
111function startBGM() {
112 if (!audioContext) {
113 initAudio();
114 }
115 if (!isPlaying) {
116 isPlaying = true;
117 playSequence(audioContext.currentTime);
118 }
119}
120
121function stopBGM() {
122 isPlaying = false;
123 scheduledNotes.forEach(osc => {
124 try {
125 osc.stop();
126 } catch (e) {
127 // 既に停止している場合のエラーを無視
128 }
129 });
130 scheduledNotes = [];
131}
132
133function changeVolume(value) {
134 if (gainNode) {
135 gainNode.gain.value = value / 100;
136 }
137}
138</script>
139</body>
140</html>この実装の特徴：
- パワフルなベースライン
- 低音域でのサwtooth波による力強い音色
- シンプルながらも印象的なフレーズ
- キャッチーなメロディ
- square波による特徴的な音色
- リズミカルなパターン
- ドラム的な要素
- ノイズ的な音を使用してリズム感を強調
- 規則的なパターンでグルーブ感を演出
- 音楽理論的な特徴
- Gマイナーをベースとした調性
- 4/4拍子の力強いリズム
- 140BPMの疾走感のあるテンポ
使い方：
- Playボタンで再生開始
- Stopボタンで停止
- スライダーで音量調整可能
注意点：
- ブラウザの自動再生ポリシーにより、ユーザーインタラクションが必要
- モバイルデバイスでの動作は端末の性能に依存
- メモリ使用量を最適化するため、停止時に不要なオシレーターを解放
コメント 0
他のプロンプトもチェック
計画立案
推奨モデル - ChatGPTまずは提案して欲しい内容を書く。あとは5つの提案を「好きか嫌いか」で判断するだけ！AIが学習してあなたが好みそうな提案をしてくれます！00780キャラクター作成
俺が今まで別サービスで使っていたchatbotです おすすめはgemini系、無料のflashでもopenaiより良い仕事します4022978GPTs
キャラクター作成
▼最新作はこちら▼ https://oshiete.ai/item_lists/73557973863457792 あなたの顔写真を送付するだけで顔面偏差値を数字で出力してくれます。各項目別に点数付けしてくれて、顔の強みや特徴まで分析してくれるツール。客観的評価を知りたい方はぜひ使ってみてください。622.76K9.86K
