forked from ryukau/UhhyouWebSynthesizers
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
421 lines (399 loc) · 16.3 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8>
<title>UhhyouWebSynthsizers</title>
<style>
body {
font-family: sans-serif;
max-width: 700px;
margin: auto;
padding: 2em 0.5em 2em 0.5em;
}
header {
border-bottom: solid 1px #c0c0c0;
}
footer {
border-top: solid 1px #c0c0c0;
}
span#lastModified {
float: right;
}
h1,
h2,
h3,
h4,
h5,
h6 {
width: 100%;
box-sizing: border-box;
margin: 1em 0 0.5em 0;
}
div#main {
margin-bottom: 2em;
}
li {
padding: 0.1em;
}
li:hover {
background-color: #eeeeee;
}
div.languageBlock {
margin: 0;
}
dl {
width: 100%;
overflow: hidden;
box-sizing: border-box;
}
div.description {
display: flex;
width: 100%;
box-sizing: border-box;
padding: 0.1em 0;
}
div.description:nth-child(odd) {
background-color: #eeeeee;
}
dt {
width: 30%;
box-sizing: border-box;
vertical-align: top;
padding: 0;
margin: 0;
background-color: inherit;
}
dd {
flex-grow: 1;
max-width: 70%;
box-sizing: border-box;
vertical-align: top;
padding: 0;
margin: 0;
background-color: inherit;
}
</style>
</head>
<body>
<header>
<p>
<label>Language</label>
<select id="language">
<option value="en">English</option>
<option value="ja">日本語</option>
</select>
<span id="lastModified">Last Modified: 2023-03-27</span>
</p>
</header>
<h1 id="title">Uhhyou Web Synths Collection</h1>
<div id="main">
<div class="languageBlock" lang="en">
<p>Some of the recent generators don't work on Firefox 104. Currently recommending to use Chrome or Safari (Blink or WebKit based browser). See <a href="https://github.com/ryukau/UhhyouWebSynthesizers#known-issue">this link</a> for more details.</p>
<h2>Impulse Response</h2>
<p>These are intended to be used with external IR convolver.</p>
<dl>
<div class="description">
<dt><a href="./L4Reverb/synth.html">L4Reverb</a></dt>
<dd>Reverb using 4 times nested lattice allpass filter.</dd>
</div>
<div class="description">
<dt><a href="./FDNReverb/synth.html">FDNReverb</a></dt>
<dd>Reverb using feedback delay network.</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/Pulseverb/index.html">Pulseverb</a></dt>
<dd>Reverb using modulated band-limited impulse train (BLIT).</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/Freeverb/index.html">Freeverb</a></dt>
<dd>Reverb using Freeverb algorithm.</dd>
</div>
</dl>
<h2>Synthesizer</h2>
<dl>
<div class="description">
<dt><a href="./OneCycleWaveform/synth.html">OneCycleWaveform</a></dt>
<dd>Single cycle waveform generator.</dd>
</div>
<div class="description">
<dt><a href="./MaybeSnare/synth.html">MaybeSnare</a></dt>
<dd>Snare drum synthesizer using self modulating FDN.</dd>
</div>
<div class="description">
<dt><a href="./WireWireCollision/synth.html">WireWireCollision</a></dt>
<dd>Simulation of collision of 2 wires.</dd>
</div>
<div class="description">
<dt><a href="./WireWallCollision/synth.html">WireWallCollision</a></dt>
<dd>Simulation of a wire colliding into rigid wall.</dd>
</div>
<div class="description">
<dt><a href="./ClangSnare/synth.html">ClangSnare</a></dt>
<dd>Snare drum like sound synthesizer based on ClangCymbal.</dd>
</div>
<div class="description">
<dt><a href="./PadChoir3/synth.html">PadChoir3</a></dt>
<dd>PADchoir using formant data.</dd>
</div>
<div class="description">
<dt><a href="./ResonantBD/synth.html">ResonantBD</a></dt>
<dd>Bassdrum synthesizer using oscillation of SVF.</dd>
</div>
<div class="description">
<dt><a href="./SingenBD3/synth.html">SingenBD3</a></dt>
<dd>FM bassdrum synthesizer with strange stereo image.</dd>
</div>
<div class="description">
<dt><a href="./PadCymbal2/synth.html">PadCymbal2</a></dt>
<dd>Improved PADcymbal with the addition of layer and serial comb filter.</dd>
</div>
<div class="description">
<dt><a href="./ClangCymbal/synth.html">ClangCymbal</a></dt>
<dd>Cymbal synthesizer using FDN. Stable feedback is the difference to FDNCymbal. Mostly same as <a href="https://ryukau.github.io/VSTPlugins/manual/ClangSynth/ClangSynth_en.html">VST 3 version</a>.</dd>
</div>
<div class="description">
<dt><a href="./SerialCombCymbal/synth.html">SerialCombCymbal</a></dt>
<dd>Cymbal-esque sound using serial comb filter.</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/WobblingMetalBoard/index.html">WobblingMetalBoard</a></dt>
<dd>Approximation of wobbling thin metal plate sound.</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/Bubbles/index.html">Bubbles</a></dt>
<dd>Sound of bubbles that is formed when droplets fall onto water surface.</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/Singen0.3/index.html">Singen0.3</a></dt>
<dd>Yet another FM synthesizer.</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/PADchoir2/index.html">PADchoir2</a></dt>
<dd>PADchoir with an alternative interface.</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/FDNCymbal/index.html">FDNCymbal</a></dt>
<dd>Cymbal-like sound using feedback delay network.</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/PADchoir/index.html">PADchoir</a></dt>
<dd>PADsynth algorithm.</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/WaveBox/index.html">WaveBox</a></dt>
<dd>3D wave simulation. Slow.</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/WaveCymbal2/index.html">WaveCymbal2</a></dt>
<dd>WaveCymbal that use implicit method for wave propagation.</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/WaveCymbal/index.html">WaveCymbal</a></dt>
<dd>Combination of 1D wave simulation and Karplus-Strong algorithm. It sounds like dragging a bunch of empty cans.</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/KSCymbal/index.html">KSCymbal</a></dt>
<dd>Collision of 2 Karplus-Strong string.</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/Pluck/index.html">Pluck</a></dt>
<dd>Karplus-Strong algorithm.</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/PADcymbal/index.html">PADcymbal</a></dt>
<dd>Cymbal-ish sound by inputting random frequency components into PADsynth algorithm.</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/Singen0.2/index.html">Singen0.2</a></dt>
<dd>Another FM synthesizer.</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/ECAFM/index.html">ECAFM</a></dt>
<dd>ECAC + FM.</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/SingenBD2/index.html">SingenBD2</a></dt>
<dd>FM bass drum synthesizer.</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/Singen0.1/index.html">Singen0.1</a></dt>
<dd>FM synthesizer.</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/SinChord/index.html">SinChord</a></dt>
<dd>Random chord using naive oscillators.</dd>
</div>
</dl>
<h2>WebAudio</h2>
<dl>
<div class="description">
<dt><a href="./oldsynth/ECAC/index.html">ECAC</a></dt>
<dd>Additive synthesizer using elementary cellular automaton.</dd>
</div>
</dl>
</div>
<div id="main">
<div class="languageBlock" lang="ja">
<p>新しいシンセサイザは Firefox 104 では動作しません。現在のところは Chrome か Safari 、あるいは Blink か WebKit ベースのブラウザをご利用ください。詳細は<a href="https://github.com/ryukau/UhhyouWebSynthesizers#known-issue">このリンク先 (英語) </a>に掲載しています。</p>
<h2>インパルス応答</h2>
<p>IRコンボルバに読み込んで使うインパルス応答を合成します。</p>
<dl>
<div class="description">
<dt><a href="./L4Reverb/synth.html">L4Reverb</a></dt>
<dd>格子構造のオールパスフィルタを 4 つ入れ子にしたリバーブ。</dd>
</div>
<div class="description">
<dt><a href="./FDNReverb/synth.html">FDNReverb</a></dt>
<dd>Feedback delay network (FDN) を1つ使ったリバーブ。</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/Pulseverb/index.html">Pulseverb</a></dt>
<dd>インパルスを適当にモジュレーションしたリバーブ。</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/Freeverb/index.html">Freeverb</a></dt>
<dd>Freeverbアルゴリズムによるリバーブ。</dd>
</div>
</dl>
<h2>シンセサイザ</h2>
<dl>
<div class="description">
<dt><a href="./OneCycleWaveform/synth.html">OneCycleWaveform</a></dt>
<dd>オシレータの 1 周期分の波形を生成。</dd>
</div>
<div class="description">
<dt><a href="./MaybeSnare/synth.html">MaybeSnare</a></dt>
<dd>自己変調するFDNを使ったスネアドラムのシンセサイザ。</dd>
</div>
<div class="description">
<dt><a href="./WireWireCollision/synth.html">WireWireCollision</a></dt>
<dd>2つの弦がぶつかるシミュレーション。</dd>
</div>
<div class="description">
<dt><a href="./WireWallCollision/synth.html">WireWallCollision</a></dt>
<dd>弦が壁にぶつかるシミュレーション。</dd>
</div>
<div class="description">
<dt><a href="./ClangSnare/synth.html">ClangSnare</a></dt>
<dd>ClangCymbal を改変したスネアドラム風の音。</dd>
</div>
<div class="description">
<dt><a href="./PadChoir3/synth.html">PadChoir3</a></dt>
<dd>フォルマントのデータを使ったPADchoir。</dd>
</div>
<div class="description">
<dt><a href="./ResonantBD/synth.html">ResonantBD</a></dt>
<dd>SVF の発振を使ったバスドラムシンセサイザ。</dd>
</div>
<div class="description">
<dt><a href="./SingenBD3/synth.html">SingenBD3</a></dt>
<dd>ステレオ感が怪しい FM バスドラムシンセサイザ。</dd>
</div>
<div class="description">
<dt><a href="./PadCymbal2/synth.html">PadCymbal2</a></dt>
<dd>レイヤと直列コムフィルタを追加した改良版PADcymbal。</dd>
</div>
<div class="description">
<dt><a href="./ClangCymbal/synth.html">ClangCymbal</a></dt>
<dd>FDNを使ったシンバルシンセサイザ。FDNが発散しないように調整されている点がFDNCymbalと異なる。ほぼ<a href="https://ryukau.github.io/VSTPlugins/manual/ClangSynth/ClangSynth_ja.html">VST 3版</a>と同じ。</dd>
</div>
<div class="description">
<dt><a href="./SerialCombCymbal/synth.html">SerialCombCymbal</a></dt>
<dd>直列につないだコムフィルタによるシンバルのような音。</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/WobblingMetalBoard/index.html">WobblingMetalBoard</a></dt>
<dd>薄い金属板を揺らしたときのような音。</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/Bubbles/index.html">Bubbles</a></dt>
<dd>水滴が水面に落ちた時に生じる泡の音。</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/Singen0.3/index.html">Singen0.3</a></dt>
<dd>FMシンセサイザ。</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/PADchoir2/index.html">PADchoir2</a></dt>
<dd>UIを変更したPADchoir。</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/FDNCymbal/index.html">FDNCymbal</a></dt>
<dd>Feedback Delay Networkを使ったシンバルのような音。</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/PADchoir/index.html">PADchoir</a></dt>
<dd>PADsynthアルゴリズム。</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/WaveBox/index.html">WaveBox</a></dt>
<dd>3次元の波のシミュレーション。</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/WaveCymbal2/index.html">WaveCymbal2</a></dt>
<dd>WaveCymbalの波のシミュレーションの解き方を変更。</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/WaveCymbal/index.html">WaveCymbal</a></dt>
<dd>1次元の波のシミュレーションとKarplus-Strongアルゴリズムの組み合わせ。シンバルというより紐につないだ空き缶を引きずったときのような音。</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/KSCymbal/index.html">KSCymbal</a></dt>
<dd>2つのKarplus-Strongを使って弦をぶつけた時のような音を合成。</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/Pluck/index.html">Pluck</a></dt>
<dd>Karplus-Strongアルゴリズム。</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/PADcymbal/index.html">PADcymbal</a></dt>
<dd>ランダムな周波数成分をPADsynthアルゴリズムに入力してシンバルのような音を合成。</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/Singen0.2/index.html">Singen0.2</a></dt>
<dd>FMシンセサイザ。</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/ECAFM/index.html">ECAFM</a></dt>
<dd>ECAC + FM。</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/SingenBD2/index.html">SingenBD2</a></dt>
<dd>FM バスドラムシンセサイザ。</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/Singen0.1/index.html">Singen0.1</a></dt>
<dd>FMシンセサイザ。</dd>
</div>
<div class="description">
<dt><a href="./oldsynth/SinChord/index.html">SinChord</a></dt>
<dd>エイリアスノイズが出る素朴なオシレータで適当なコードを合成。</dd>
</div>
</dl>
<h2>WebAudio</h2>
<dl>
<div class="description">
<dt><a href="./oldsynth/ECAC/index.html">ECAC</a></dt>
<dd>Elementary Cellular Automatonに基づいて倍音を加算合成。</dd>
</div>
</dl>
</div>
</div>
<footer>
<ul>
<li><a href="https://github.com/ryukau/UhhyouWebSynthsizers">Source Code</a> (github.com)</li>
<li><a href="https://ryukau.blogspot.com/">Blog</a> (Blogger)</li>
</ul>
</footer>
<script>
function changeLanguage(lang) {
for (let element of document.getElementsByClassName("languageBlock")) {
element.style.display = element.lang === lang ? "unset" : "none";
}
}
document.getElementById("language").addEventListener(
"change", e => changeLanguage(e.target.value), false);
changeLanguage(document.getElementById("language").value);
</script>
</body>
</html>