Design Draft

Inspiration

As music lovers, we could not imagine one day without music. The question of how we could bring the same music experience to the disabled population is always in our hearts. Being users ourselves of many music tools, we soon realized that most of them communicate important information visually. That can make it difficult for blind and low-vision musicians to understand where they are, what is available, and what will happen when they edit their tracks. We started Cstar to explore a different approach. No cold, mechanical voice to read the page. Instead, users can hear guidance in a more natural voice powered by ElevenLabs. But our hope reaches beyond the sound of that voice, making music without sight should not feel like facing a screen alone. It should feel like a late-night talk with someone who understands your love of music. Warm, patient, and ready to help you turn an idea into a song. The name, Cstar, comes from Seastar, an ocean animal that use their hands more than its eyes to explore the world. We want to provide our human Seastar musicians with the ability to create music freely with all other senses.

What it does

Cstar Music is an accessible music-making workspace designed for blind and low-vision musicians. It brings voice guidance, recording, and track playback into one browser-based experience.

The current prototype includes:

A music-project workspace with track creation and playback.
A drum sequencer with keyboard-accessible pads, layered recording, count-in, and looping playback.
Audio recording and audio-file import for project tracks.
Keyboard shortcuts for common actions, including adding tracks, controlling playback, and saving audio.
A read-aloud feature that uses ElevenLabs when available and falls back to the device's speech voice.

This is an evolving prototype. Some features and behaviors may change as we continue testing and refining the experience.

How we built it

We used Figma in order to do the front-end section of our website, while coding on GitHub. We used languages such as Python and TypeScript to code the back-end. In addition, ElevenLabs was used to create the audio for both text-to-speech and the musical instruments.

Challenges we ran into

Building an accessible music workspace meant thinking about more than whether a control can be focused. We also had to consider how a user can understand the page layout, identify the current control, learn keyboard actions, and tell whether recording or playback is active.

We also worked through browser and platform differences in audio playback and text-to-speech. External speech services can be unavailable or behave differently across preview and deployed environments, so the prototype includes a device-voice fallback to keep page guidance available.

Accomplishments that we're proud of

We are proud of linking keystrokes with audio outputs to help users create beats. In addition, we are also proud of being able to take in audio input from users and link it to ElevenLabs in order to output the described music.

What we learned

We learned a lot about building both front-end and back-end aspects of a website, such as linking front-end features to back-end code and incorporating our API into our code. Working with AI coding tools effectively is also what is important we learned throughout the hackathon.

What's next for CStar

We want to keep improving the clarity and reliability of spoken navigation, refine the experience of recording and arranging multiple tracks, and test the workflow with blind and low-vision musicians. Their feedback should guide our next improvements.

We are also considering turning Cstar into a plugin for the most-used music tools. The users could access to popular existing music tools and collaborate with other musicians with the help of Cstar.