Kami mempelajari beberapa topik tentang GitHub, Hacker News, dan Reddit pada alat visualisasi audio. Kami berbicara tentang perpustakaan terbuka dan solusi yang sering disebutkan yang bermanfaat bagi pengembang aplikasi web atau game.
Foto Pixabay / Lisensi Pixabay- Pizzicato . Untuk bekerja dengan konten audio di browser, spesifikasi Audio Web , yang dikembangkan oleh konsorsium W3C, digunakan . Web Audio API memiliki 28 antarmuka untuk memfilter, memvisualisasikan, dan mengelola saluran audio. Pustaka Pizzicato JavaScript memperluas fungsi ini dengan memungkinkan Anda menambahkan lebih banyak efek ke melodi ( tremolo , reverb , efek distorsi quadrafuzz ) dan membuat komposisi baru berdasarkan suara individu. Penulis perpustakaan mempresentasikan proyek yang menunjukkan kemampuannya - aplikasi ini memainkan melodi tergantung pada jumlah komit dari pengguna GitHub.
- Sedang memproses . Perpustakaan untuk mengimplementasikan fungsi dasar bahasa Pemrosesan. Ini dikembangkan pada tahun 2001 untuk memvisualisasikan data di web. Hari ini digunakan oleh ribuan seniman, perancang dan pengembang, termasuk untuk visualisasi audio . Perpustakaan menggunakan JS untuk animasi, dan kanvas untuk bekerja dengan gambar. Dua buku (PDF) dari penulisnya akan membantu mempelajari fitur-fitur bahasa - " Memproses: Buku Pegangan Pemrograman " dan " Memulai dengan Memproses ".
- Peaks.js . Ini adalah komponen JavaScript untuk menampilkan dan berinteraksi dengan grafik gelombang suara. Grafik dapat ditingkatkan dan ditandai pada mereka dengan bagian semantik warna yang berbeda, seperti pidato dan musik. Perpustakaan dikembangkan oleh para ahli dari BBC, mereka menggunakan komponen kanvas dari HTML5. Peaks.js hanya dapat menggambar grafik berdasarkan data yang sudah jadi dan menempatkannya di halaman situs. Jika Anda perlu membuat gelombang suara, Anda dapat beralih ke alat lain dari ekosistem BBC: waveform-data untuk JS, bentuk audiowave untuk C ++ dan audio_waveform untuk Ruby.
Foto oleh Jason Corey / CC BY- p5.js. Ini adalah perpustakaan visualisasi yang dibuat oleh tim Pemrosesan pada tahun 2014. Ini memungkinkan Anda untuk "menggambar menggunakan kode" (membuat elemen seni dan animasi), di mana halaman di browser bertindak sebagai kanvas. P5.js memiliki perpustakaan tambahan untuk diintegrasikan dengan objek HTML5 lainnya - teks, video, audio, atau mengambil gambar dari webcam. Ada editor di situs web resmi proyek di mana Anda dapat mengevaluasi semua fitur alat.
- pixi.js. Mesin rendering 2D berdasarkan kanvas dan WebGL, yang mendukung tekstur dan sprite. Penulis perpustakaan memposisikannya sebagai analog dari Three.js, sehingga sangat cocok untuk membuat antarmuka grafis yang kompleks (misalnya, pemutar musik) dan visualisasi. Demo dengan fitur "musikal" dari pixi.js dapat ditemukan di situs web codepen (Anda perlu mengunduh musik dari komputer Anda).
- sketch.js . Perpustakaan kecil untuk membuat objek seni dalam JavaScript - beratnya hanya dua kilobyte. Semua metode menggambar CanvasRenderingContext2D, WebGLRenderingContext dan HTMLElement didukung. Di situs resmi Anda dapat menemukan beberapa contoh visualisasi yang diimplementasikan menggunakan sketsa. Dokumentasi dengan semua informasi yang diperlukan untuk memulai dengan alat ini ada di GitHub .
- Two.js. API Universal untuk menggambar di Kanvas, SVG atau WebGL dengan bias dalam grafik vektor. Cocok untuk bekerja di lingkungan tanpa kepala dan awan. Contoh implementasi tersedia di sini .
- Bentuk gelombang audio Aplikasi untuk Linux dan Mac OSX (Windows belum didukung) yang bekerja dari baris perintah dan menghasilkan data gelombang berdasarkan rekaman audio (dalam format MP3, WAV, FLAC atau OGG). Untuk melakukan ini, aplikasi membentuk trek mono, dan kemudian menghitung nilai minimum dan maksimum sampel. Data disimpan dalam format JSON, dat atau PNG. Setelah mereka dapat ditransfer ke perpustakaan, yang menampilkan grafik gelombang suara di situs, misalnya, Peaks.js yang sudah disebutkan.
Foto Pixabay / Lisensi Pixabay- Gelombang Audio Edaran . Pustaka JS yang memvisualisasikan gelombang suara dalam bentuk grafik lingkaran. Untuk membuatnya, ECharts digunakan, juga data tentang frekuensi dan nada BPM . Demo dapat ditemukan di sini dan di sini .
- Cinder . Kerangka kerja C ++ untuk pembuatan gambar, yang dibuat sebagai pesaing untuk Processing.js. Alat ini memungkinkan Anda untuk bekerja dengan grafik 2D dan 3D, memiliki decoder bawaan untuk WAV, MP3 dan OGG, serta fungsi pemrosesan sinyal digital (misalnya, blok normalisasi dan perhitungan nilai rms).
- Visualizer Musik 3D . Visualizer sederhana dibangun berdasarkan Three.js dan Web Audio API, yang menggunakan fungsi trigonometri untuk membuat bentuk. Contoh pekerjaan dapat ditemukan di sini . Proyek ini dapat digunakan sebagai referensi saat membuat visualisator "matematika" Anda sendiri.
Pada 18 Juni, penjualan peralatan dimulai di Audiomania. Kami memberikan pemutar vinil, amplifier stereo, rak buku, dan speaker lantai, serta headphone in-ear dengan diskon besar hingga 70%. Misalnya, speaker Polk Audio S10 dapat diambil untuk 14.900 rubel, dan headphone Audio-Technica ATH-E40 untuk 6.490 rubel.
Hot AUDIOSALE 2019 adalah kesempatan bagus untuk membeli gadget audio yang sudah lama Anda tonton.
Koleksi kami yang lain:
Di mana mendapatkan sampel audio untuk proyek Anda: pilihan sembilan sumber daya tematik 12 sumber daya tematik dengan trek yang dilisensikan di bawah Creative Commons Pilihan toko online dengan musik Hi-Res
Apa yang ada di iPod pertama: dua puluh album yang dipilih Steve Jobs pada tahun 2001 Kami pensiun - kami membahas gadget audio yang dulu populer yang sudah "kedaluwarsa"