Building a Sound Design Website with AI: My Experience Using ChatGPT and Perplexity

Throughout this blog series, I’ve mentioned the interactive sound design website I started to develop during the semester. What I haven’t talked about yet is how I actually built it.And I did that with the help of AI. While large language models made the development process much more accessible, I quickly realized that they are far away from a “one-click solution.” They are more like collaborative tools which require the constant feedback, experimentation with prompts, and refinement by a human.

Choosing the Right Technology

Before I started coding, I researched different technologies for implementing interactive audio on the web. One option I considered was WebPd, which allows Pure Data patches to run in the browser. However, I found that WebPd currently supports only a limited number of Pure Data objects, making it unsuitable for the complexity of my project. Additionally, AI models generally struggled to generate reliable Pure Data code, and learning enough WebPd from scratch within a single semester would not have been realistic.

Because of these limitations, I decided to build the project using Tone.js, a JavaScript library specifically designed for creating interactive audio applications in the browser.

Why I Switched from ChatGPT to Perplexity

At the beginning of the project, I experimented with both ChatGPT and Perplexity for coding assistance. After trying different prompts, I noticed that Perplexity consistently generated more useful code for my project. It also asked more relevant follow-up questions whenever my requests were ambiguous, which often resulted in solutions that matched my intentions more closely.

For this reason, I primarily used Perplexity as my coding assistant throughout the project.

AI Does Not Eliminate the Work

Although AI significantly lowered the barrier to building the website, the overall development process remained very time-consuming.

One of the biggest challenges was debugging. Since I do not have extensive web development experience, I often could not identify the source of an error myself. Instead, I had to carefully describe the problem to the AI, explain the expected behavior in detail, and repeatedly refine my prompts until the generated solution actually worked. In many cases, fixing one issue introduced new bugs somewhere else, leading to an iterative cycle of testing, explaining, and regenerating code.

There are probably AI models that would have performed better for this specific task, but I still consider the experience a valuable learning opportunity. Throughout the semester, I became much better at writing precise prompts and understanding how to communicate technical problems effectively.

Example Prompts

Some of the prompts I used during development are:

  • “I want to build a reverb with Tone.js that reacts to audio input and can be controlled with two sliders. The first slider should control the reverb tail length, and the second should function as a dry/wet control. Please generate a complete HTML page.”
  • “The reverb tail is not behaving correctly. What do I need to change? The displayed tail length does not match the actual reverb tail.” (followed by the relevant code)
  • “Please add an information option to all effect settings. I would like a small ‘?’ icon that users can hover over to display information about the respective effect.”
  • “The code does not work. The sound does not change regardless of how the sliders are adjusted.”

Often, the AI only generated the specific code sections that needed to be modified. When the required changes became too extensive, I simply asked it to regenerate the entire updated code block instead, which made it much easier to replace large sections without introducing additional errors.

Conclusion

Using AI did not replace the programming process—it changed it. Rather than writing every line of code myself, I spent much of my time describing problems, evaluating generated solutions, testing them, and iterating until the desired functionality was achieved. The project showed me that AI is a powerful development assistant, especially for someone without extensive programming experience. At the same time, it also highlighted the importance of clear communication, critical evaluation of generated code, and patience during debugging. Working with AI allowed me to make an amount of progress on a project that would have been difficult to do within one semester on my own, while also teaching me valuable skills in prompting and problem-solving.

Leave a Reply

Your email address will not be published. Required fields are marked *