Concept
BLOOM — an interactive musical web synthesizer where sound and visual space become one.
The project is built on the idea of transforming music into atmosphere. The user doesn’t just create a melody; they gradually form their own sonic world by controlling harmony, melody, textures, timbre, and rhythm.
The visual style is inspired by the game GRIS (2018): gentle watercolor hues, airy architecture, and fluid animations create a sense of calm and immersion.
BLOOM combines free improvisation with automatic generation of musical elements, allowing users to create compositions even without prior musical training.
Music System
Sound Architecture
The sound architecture of BLOOM is built upon the Web Audio API and the Tone.js library, which allow for the creation, processing, and playback of audio directly in the browser. Each of the five instruments has its own dedicated audio channel and effects chain, enabling independent control over their volume, timbre, and parameters.The system employs two primary methods of sound generation:* Sound Synthesis: Generating harmonies, melodies, and rhythmic elements in real time.* Sample Playback: Utilizing pre-prepared audio recordings to build vocal and atmospheric layers.All instruments converge into a master audio mixer, after which the signal passes through a master channel equipped with a limiting function before exiting the device.The result is a multi-layered sonic experience that can be manipulated in real time.
Visual Language
The visual language of BLOOM is inspired by the aesthetics of the game GRIS, where color, space, and movement convey an emotional state.Color Palette. Muted pink, blue, and lavender tones create a feeling of tranquility. The smooth transitions between colors support the atmosphere of gentle, enveloping sound.
Interface
The BLOOM interface is built on the principle of a unified musical space. All five instruments are positioned directly on the stage, and their settings are opened in separate, translucent panels.
Interface Structure
— Instruments. ATMOSPHERE, MELODY, TEXTURE, VOICE, and RHYTHM form five independent control zones. — Settings Panels. These allow users to change the volume, sound parameters, and performance modes for each instrument. — Musical Interaction. On-screen keys and rhythmic pads enable direct playing within the browser. — Global Controls. The bottom panel unifies the start and stop of the composition, tempo adjustment, overall volume, and smooth fading.
Interaction Principle: The user gradually adds musical layers and manages them without leaving the main stage.
The translucent panels and compact controls maintain the visibility of the background space, merging the interface’s functionality with the project’s visual atmosphere.
Prompt Design
The BLOOM Project was developed using generative artificial intelligence. ChatGPT was utilized for concept development and preparing visual prompts and imagery, while Codex handled the interface programming and the musical system.
Since the project was created without using Figma, instead of linking to mockups, we are providing documentation of the development process. This document compiles the main stages of work, examples of AI prompts, visual materials, and the final implementation results.
