Visualiseur Audio Dynamique — Dossier Unique

Sommaire / Table of Contents

• 1. English (Anglais)
• 2. Français
• 3. Español (Espagnol)
• 4. Português (Portugais)
• 5. 日本語 (Japonais)
• 6. 中文 (Chinois)

---

1. English (Anglais)

Dynamic Audio Visualizer

This project is an interactive audio visualizer using the p5.js library to create dynamic visualizations based on microphone input.

Features

• Audio Visualization: Concentric circles that change size and color based on detected audio frequencies.
• Animated Particles: Enable or disable animated particles driven by frequency energy.
• Color Palette: Choose from different color palettes (default, warm, cool).
• Adjustable Sensitivity: Fine-tune the audio visualization sensitivity.

Installation

1. Clone the repository:

   git clone https://github.com/Lehomar2vinci/PestoVIsualizer

2. Navigate to the project directory:

   cd PestoVIsualizer

Usage

1. Open listener.html in your browser.
2. Use the on-screen controls to adjust sensitivity, select a color palette, and enable particles.
3. Click “Start” to activate microphone input and begin visualization.

Having Issues?

If you encounter errors (e.g., the microphone not working), make sure:

• Your browser has access to the microphone (check browser permissions).
• You are running a secure context (HTTPS) if required by your browser.

For more help, consult the p5.js documentation or the p5.sound.js docs.

Main Files

• listener.html: Contains the HTML structure and UI controls.
• listener.css: Contains the CSS styling for the user interface.
• listener.js: Contains the JavaScript logic for audio visualization and particle animation.

Dependencies

• p5.js: A JavaScript library for creative coding and interactivity.
• p5.sound.js: An extension of p5.js for handling sound input and analysis.

Contributing

Contributions are welcome! Feel free to open issues or submit pull requests.

License

This project is licensed under the MIT License. See the LICENSE file for more details.

---

2. Français

Visualiseur Audio Dynamique

Ce projet est un visualiseur audio interactif utilisant la bibliothèque p5.js pour créer des visualisations dynamiques basées sur l’entrée audio du microphone.

Fonctionnalités

• Visualisation Audio : Des cercles concentriques dont la taille et la couleur varient en fonction des fréquences détectées.
• Particules Animées : Activation/désactivation de particules animées en fonction de l’énergie des fréquences.
• Palette de Couleurs : Choisissez parmi différentes palettes de couleurs (par défaut, chaud, froid).
• Sensibilité Réglable : Ajustez la sensibilité de la visualisation audio.

Installation

1. Clonez le dépôt :

   git clone https://github.com/Lehomar2vinci/PestoVIsualizer

2. Accédez au répertoire du projet :

   cd PestoVIsualizer

Utilisation

1. Ouvrez listener.html dans votre navigateur.
2. Utilisez les contrôles à l’écran pour ajuster la sensibilité, sélectionner une palette de couleurs et activer les particules.
3. Cliquez sur « Démarrer » pour activer l’entrée microphone et lancer la visualisation.

En cas de problème ?

Si vous rencontrez des erreurs (par exemple, le microphone ne fonctionne pas), assurez-vous :

• Que votre navigateur a l’autorisation d’utiliser le microphone.
• Que vous utilisez un contexte sécurisé (HTTPS) si votre navigateur l’exige.

Pour plus d’aide, consultez la documentation p5.js ou la documentation de p5.sound.js.

Fichiers Principaux

• listener.html : Contient la structure HTML et les contrôles de l’interface.
• listener.css : Contient le style CSS de l’interface.
• listener.js : Contient la logique JavaScript pour la visualisation audio et l’animation des particules.

Dépendances

• p5.js : Une bibliothèque JavaScript pour la création interactive.
• p5.sound.js : Une extension de p5.js pour la gestion et l’analyse du son.

Contribuer

Les contributions sont les bienvenues ! N’hésitez pas à ouvrir des issues ou à proposer des pull requests.

Licence

Ce projet est sous licence MIT. Consultez le fichier LICENSE pour plus de détails.

---

3. Español (Espagnol)

Visualizador de Audio Dinámico

Este proyecto es un visualizador de audio interactivo que utiliza la biblioteca p5.js para crear visualizaciones dinámicas basadas en la entrada de audio del micrófono.

Características

• Visualización de Audio: Círculos concéntricos que cambian de tamaño y color según las frecuencias de audio detectadas.
• Partículas Animadas: Habilita o deshabilita partículas animadas basadas en la energía de las frecuencias.
• Paleta de Colores: Elige entre diferentes paletas de colores (por defecto, cálida, fría).
• Sensibilidad Ajustable: Ajusta la sensibilidad de la visualización de audio.

Instalación

1. Clona el repositorio:

   git clone https://github.com/Lehomar2vinci/PestoVIsualizer

2. Ingresa al directorio del proyecto:

   cd PestoVIsualizer

Uso

1. Abre listener.html en tu navegador.
2. Utiliza los controles en pantalla para ajustar la sensibilidad, seleccionar la paleta de colores y habilitar las partículas.
3. Haz clic en "Iniciar" para activar la entrada del micrófono y comenzar la visualización.

¿Problemas?

Si encuentras errores (por ejemplo, el micrófono no funciona), asegúrate de:

• Dar permiso al navegador para usar el micrófono.
• Usar un contexto seguro (HTTPS) si tu navegador lo requiere.

Para más ayuda, consulta la documentación de p5.js o la documentación de p5.sound.js.

Archivos Principales

• listener.html: Contiene la estructura HTML y los controles de la interfaz de usuario.
• listener.css: Contiene los estilos CSS de la interfaz.
• listener.js: Contiene la lógica en JavaScript para la visualización de audio y la animación de partículas.

Dependencias

• p5.js: Una biblioteca de JavaScript para la creación e interactividad.
• p5.sound.js: Una extensión de p5.js para manejar el sonido y su análisis.

Contribuir

¡Las contribuciones son bienvenidas! No dudes en abrir issues o enviar pull requests.

Licencia

Este proyecto está bajo la licencia MIT. Consulta el archivo LICENSE para más detalles.

---

4. Português (Portugais)

Visualizador de Áudio Dinâmico

Este projeto é um visualizador de áudio interativo que usa a biblioteca p5.js para criar visualizações dinâmicas com base na entrada de áudio do microfone.

Recursos

• Visualização de Áudio: Círculos concêntricos que mudam de tamanho e cor de acordo com as frequências de áudio detectadas.
• Partículas Animadas: Ative ou desative partículas animadas baseadas na energia das frequências.
• Paleta de Cores: Escolha entre diferentes paletas de cores (padrão, quente, fria).
• Sensibilidade Ajustável: Ajuste a sensibilidade da visualização de áudio.

Instalação

1. Clone o repositório:

   git clone https://github.com/Lehomar2vinci/PestoVIsualizer

2. Navegue até o diretório do projeto:

   cd PestoVIsualizer

Uso

1. Abra o arquivo listener.html no seu navegador.
2. Use os controles na tela para ajustar a sensibilidade, selecionar uma paleta de cores e ativar partículas.
3. Clique em "Iniciar" para ativar a entrada do microfone e começar a visualização.

Problemas?

Se você encontrar erros (por exemplo, o microfone não funciona), verifique:

• Se o navegador tem permissão para acessar o microfone.
• Se você está usando um contexto seguro (HTTPS), caso o navegador exija.

Para mais ajuda, consulte a documentação do p5.js ou a documentação do p5.sound.js.

Arquivos Principais

• listener.html: Contém a estrutura HTML e os controles da interface de usuário.
• listener.css: Contém o estilo CSS da interface.
• listener.js: Contém a lógica em JavaScript para a visualização de áudio e animação de partículas.

Dependências

• p5.js: Uma biblioteca JavaScript para criação e interatividade.
• p5.sound.js: Uma extensão do p5.js para manipulação e análise de som.

Contribuição

Contribuições são bem-vindas! Fique à vontade para abrir issues ou enviar pull requests.

Licença

Este projeto está licenciado sob a Licença MIT. Consulte o arquivo LICENSE para mais detalhes.

---

5. 日本語 (Japonais)

ダイナミックオーディオビジュアライザー

このプロジェクトは、p5.js ライブラリを使用して、マイク入力に基づく動的なビジュアライゼーションを作成するインタラクティブなオーディオビジュアライザーです。

機能

• オーディオビジュアライゼーション: 検出された周波数に応じてサイズと色が変化する同心円。
• アニメーションパーティクル: 周波数エネルギーによって駆動されるパーティクルを有効／無効に切り替え可能。
• カラーパレット: デフォルト、ウォーム、クールなど、さまざまなカラーパレットを選択可能。
• 感度調整: オーディオビジュアライゼーションの感度を調整可能。

インストール

1. リポジトリをクローン:

   git clone https://github.com/Lehomar2vinci/PestoVIsualizer

2. プロジェクトディレクトリに移動:

   cd PestoVIsualizer

使い方

1. listener.html をブラウザで開きます。
2. 画面上のコントロールを使って感度を調整したり、カラーパレットを選択したり、パーティクルを有効にしたりします。
3. 「開始」 ボタンをクリックしてマイク入力を有効にし、ビジュアライゼーションを開始します。

トラブルシューティング

マイクが動作しないなどのエラーが発生する場合は、以下を確認してください:

• ブラウザがマイクの使用を許可しているか。
• 必要に応じて、安全な接続 (HTTPS) を使用しているか。

詳細は p5.js のドキュメント または p5.sound.js のドキュメント を参照してください。

主なファイル

• listener.html: HTML 構造と UI コントロールを含むファイル。
• listener.css: UI のスタイルを記述した CSS ファイル。
• listener.js: オーディオビジュアライゼーションとパーティクルアニメーションのロジックが書かれた JavaScript ファイル。

依存関係

• p5.js: クリエイティブコーディングとインタラクティブな表現のための JavaScript ライブラリ。
• p5.sound.js: p5.js の拡張ライブラリで、サウンド入力と分析を扱うためのもの。

コントリビュート（貢献）

貢献は歓迎です！Issue を立てたり、Pull Request を送ったりしてください。

ライセンス

このプロジェクトは MIT ライセンスのもとで公開されています。詳細は LICENSE ファイルを参照してください。

---

6. 中文 (Chinois)

动态音频可视化器

本项目是一个使用 p5.js 库的交互式音频可视化器，可根据麦克风输入创建动态可视化效果。

功能

• 音频可视化: 同心圆会根据检测到的音频频率改变大小和颜色。
• 动画粒子: 可以启用或禁用由频率能量驱动的粒子动画。
• 颜色调色板: 可选择不同的颜色调色板（默认、暖色、冷色）。
• 可调敏感度: 调整音频可视化的敏感度。

安装

1. 克隆存储库：

   git clone https://github.com/Lehomar2vinci/PestoVIsualizer

2. 进入项目目录：

   cd PestoVIsualizer

使用

1. 在浏览器中打开 listener.html。
2. 利用界面上的控件来调整敏感度、选择颜色调色板以及启用粒子效果。
3. 点击 “开始” 以启用麦克风输入并开始可视化。

遇到问题？

如果遇到错误（例如麦克风无法使用），请确保：

• 您的浏览器已授权使用麦克风。
• 您在需要时使用了安全连接（HTTPS）。

如需更多帮助，请参阅 p5.js 文档 或 p5.sound.js 文档。

主要文件

• listener.html: 包含 HTML 结构和用户界面控件。
• listener.css: 包含用户界面的 CSS 样式。
• listener.js: 包含音频可视化和粒子动画的 JavaScript 逻辑。

依赖

• p5.js：一个用于创意编程和互动艺术的 JavaScript 库。
• p5.sound.js：p5.js 的扩展库，用于处理声音输入和分析。

贡献

欢迎任何形式的贡献！请随时提交 issue 或 pull request。

许可证

本项目基于 MIT 许可证。有关更多细节，请参阅 LICENSE 文件。