astonfred

Yesterday morning, I was preparing a landing page for a special price offer on my SaaS, the AI Jingle Maker. I thought it would be nice to add a short video greeting in the top right corner of the page, to bring a bit more human touch and explain the details of the offer.

At first, the plan was simple: grab my phone, record a quick video, add it to the app with a circle mask. It would not have taken too long.

But I had a bit of time, so I decided to turn that very specific need into a full SaaS.

It was 12:00, and I had planned to send the newsletter before 16:00. So I had 4 hours to build the product and insert the JS snippet into the head of my promo page to greet visitors.

I finished in time.

Then I spent 2 extra hours making the app multi-tenant, creating the landing page, buying a domain, submitting it to Paddle for approval, fine-tuning a few features, and sharing the product with a couple of friends. Paddle approval was fast, so I did not even have to keep the billing placeholder I had prepared.

6 hours after the initial idea, the product was live and the first users started signing up!

Then I closed my laptop and headed to Soho for a cabaret show.

Just another day in my AI-assisted development journey.

What a time to be alive!

Down again in London

We are all impacted...

One of the best titles ever.

I started my coding journey aged 48 in September 2022, learning Python via a few Youtube tutorials (I've documented the journey in this video: https://youtu.be/nvGzCSor8Is).

Then came the release of the Open AI API (Nov 2022) and I dived into AI-assisted coding, first using ChatGPT and GitHub Copilot (in PyCharm and VS Code) and most recently Mistral Codestral and Cody by Sourcegraph (which is offering Claude 3.5 Sonnet as their default LLM). I run a newsletter dedicated to AI-assisted coding: https://aicodingclub.com

Interestingly, when I started exploring frontend development, using Flask as my framework of choice to manage both my backend and my frontend, my LLM assistants offered Vanilla JS by default for all client/server interactions (not React, Nextjs or Vue), so that's how I shipped my first web apps.

I released the AI Jingle Maker in September 2023. The app will be one year old in a few weeks. It has attracted 25,000+ people and has become a decent side hustle. So I've decided to invest more time into shipping new features on a regular basis. I created an audiogram maker (HTML/CSS/JS), a promo maker, added a voice recorder and a file uploader. I also launched a radio stations directory.

Last week, I started experimenting with a new approach of audio editing, different from the usual "channel-based" DAW UI, inspired by the infinite canvas logic popularized by Figma, Lucid, Miro and others.

Even if I recently "graduated" from vanilla JS to Nextjs, I preferred to use pure (old school) Vanilla JS for this new feature. It was super fun to code. It took me 4 days and 2 nights.

There are still tons of things to improve (I'd love to have some help to optimize the play/pause logic for instance) but it's a pretty decent MVP. Earlier today the first mixes were created and saved by the community. If you'd like to have a quick look at the app in action, I recorded a quick demo: https://youtu.be/MSvUjJ09Mp8 You can also check out Audio Canvas on https://aijinglemaker.com/audiocanvas (it requires a free signup, there are 250+ sound effects available to test the tool, as well as a few shared templates).

Disclaimer: because of its form factor, the web app is only available on screens wider than 1250 pixels. It would not make much sense on mobile, even if made 100% responsive.

I'll keep on working on the product over the next few weeks.

The main challenges so far have been:

Managing the playback / export-bounce logic based on the x position of the first file on the canvas, taking into account trimmed sections, trailing silence, etc.

Tweaking the trimming bars UX (put them outside the waveform).

Managing unique file instances across edits

Developing some workarounds to mitigate the delay between "stop" and "full stop" (I haven't found so far a way to fully kill all processes to allow for a risk-free blazing fast pause/resume action. I read it's a common issue with JS-based audio players).

Still work in progress.

I've been a radio enthusiast for as long as I can remember (one of my favourite movies is "Pump Up The Volume"). Since late 2022, I've developed a knack for programming. I started coding at the age of 48, just before the AI tidal wave.

Out of these twin passions, I've built a small project which is already being used by DJs, radio presenters and a few podcasters: the AI JINGLEMAKER.

The AI JINGLEMAKER enables you to create DJ drops, Station IDs, podcast intros and other jingles in a few seconds.

You can pick an intro FX, a background sound, an outro FX, create your voiceover with the power of AI and let the JINGLEMAKER magically generate your jingle in the blink of an eye! You can download both the final jingles and the raw voiceovers.

Demo: https://www.youtube.com/watch?v=7QOs2MEsL5o