[NEW PLUGIN] - Audio Player with Real-Time Decibel Visualization

RocketBubble · 2025-01-21T14:49:25.536Z

Introducing the Advanced Audio Player with Real-Time Decibel Visualization plugin for Bubble.io!

Elevate your Bubble applications by integrating an interactive audio player that not only plays your audio files but also visualizes their decibel levels in real-time.

audio_player

Key Features:

- Comprehensive Playback Controls: Play, pause, and stop your audio tracks with ease. 

Real-Time Decibel Visualization: Experience an animated waveform that mirrors the audio’s decibel levels as it plays. 
Customizable Aesthetics: Tailor the waveform’s color, style, and background to align with your app’s design. 
Multi-Format Support: Compatible with popular audio formats including MP3, WAV, and OGG. 
Responsive Design: The player adapts seamlessly to various screen sizes and container dimensions. 
Interactive Seeking: Navigate through the audio track by clicking on the waveform. 
Volume Control: Adjust the volume with intuitive controls and receive visual feedback. 
Time Display: Keep track of playback with current time and total duration indicators.
Variable Playback Speeds: Choose from multiple playback speeds (1x, 1.5x, or 2x) to suit your listening preference.

Demo: Experience the plugin in action

Editor Access: Explore the plugin in the Bubble Editor

Plugin page: Install here

How to Use:

Add the Plugin: Drag and drop the Advanced Audio Player onto your Bubble page. 
Set Audio Source: Upload an audio file or provide a URL. 
Customize Appearance: Use the provided properties to match the player to your app’s design. 
Configure Events: Integrate playback events into your workflows as needed. 
Enjoy Enhanced Audio Playback: The plugin will handle playback and visualization seamlessly.

Technical Requirements:

Browser Compatibility: Ensure the user’s browser supports the Web Audio API. 
Recommended Browsers:

Chrome 74+
Firefox 75+
Safari 14.1+
Edge 79+

Notes:

- Performance Considerations: Visualization performance may vary based on device capabilities. 

File Size Recommendation: For optimal performance, keep audio files under 50MB. 
Format Support: The plugin supports most common audio formats, including MP3, WAV, OGG, and AAC.

Enhance your Bubble.io applications with this dynamic audio player, providing users with an engaging and interactive listening experience.

jo1 · 2025-01-21T18:52:05.984Z

Nice job! Progress bar movement is feeling stuttered, a smooth and consistent movement would look much better.

RocketBubble · 2025-01-22T05:59:07.269Z

Thank you for the feedback!

That’s a great point, and I completely agree.

I’ve just uploaded a new version that improves the progress bar movement to make it much smoother and more consistent.

Let me know what you think!

jo1 · 2025-01-22T06:32:00.757Z

It looks great man, kudos for the fast fix!