I woke up on Monday with a strange idea. After working on micro-products (I built two chrome extensions in less than an hour each) and small products (products whose development lasted less than a day), I wanted to build and release something new. But I didn't want it to take me a year, as the last time. That's when I decided I wanted to build something, in a week. The only thing I needed was an idea.
I started thinking about the maker community, and how people say the maker's market (makers building for other makers) is crowded. I was browsing the Makers Kitchen community when someone posted an article they'd just wrote.
I spent five minutes reading it. It was a good article. But then, someone posted another one. And I'm sure it was also a good article, but I didn't have the time to read it.
And I realized something. There's new awesome content out every day, but we can't multitask reading something. But there's another content consumption method: audio. And we can do other things while listening to audio.
This is one of the factors that has lead to the increasing popularity of podcasts. You don't need to stare at your screen to consume content. Instead, you can walk your dog or do the dishes, or any other activity that doesn't require listening to something.
And I asked myself, wouldn't it be awesome to have a podcast feed for every article out there? Or better, wouldn't it be awesome if there was a tool that automatically generated audio versions of articles? And that's where Blogcast was born. I bought the domain blogcast.host and went to bed.
I started by getting a feel on transcribing articles manually, to figure out how many hurdles was my product removing. I had to first get the text from the article, then call a text-to-speech API (that billed per-character), retry the call a few times to check progress and then download the audio and upload it to a publicly-accessible server. There was definitely room for improvement.
I also looked if someone else had already solved the problem. There are already a few apps that provide the same functionality, but all of them were focused on the readers, so I decided to take a different stand: I would focus on the authors and publishers , helping them increase readership (or listenership) by allowing them to provide audio versions of their articles next to the words.
It was finally time to code. I created a new Laravel app and started typing in my editor. A few hours later, I had managed to make an artisan command that generated audio versions or articles.
I used my command to transcribe articles from some friends and asked them for feedback, and they loved it.
But in order for others to use it, I needed more than a command. I needed a platform.
This was probably my most productive day, and it focused entirely on coding. I started by abstracting the command functionality to a class I could use through the application. Then, I did some database work to persist transcribed articles to the database and made the process async (in the PHP world, this can be achieved by using queue workers to perform operations outside the request-response lifecycle).
It was time to focus on the user-facing part of the application. I designed the authentication views and a very simple dashboard using Tailwind CSS. I also customized a template I found for the landing (I'd normally design the landing from scratch, but my time constraints didn't allow it this time) and wrote some copy for it.
Finally, I worked on billing. I wanted to have two plans: a periodic subscription and a pay-as-you-go subscription but wanted the user to register with its credit card. This turned out to be a little more difficult than expected, but after an hour of fiddling, I managed to get it right.
I don't think I touched the backend except to set up some routes for the dashboard. This day was dedicated exclusively to making the dashboard work and look good on all screens. I designed a nice table with options to download or embed the audio, and also added an option to gift the audio to another person (I'll talk more about this feature in a moment). Making all of these UI elements took more work than you'd think of, so I ran out of time just after finishing.
While building a product, you have to build interest and get people excited about it. This is already difficult when building a full-fledged product, but the short timeframe I had made it even more difficult.
Remember the gift feature? It allows you to share a modified version of the landing with an embed of an article. I used it to let others know about Blogcast by gifting audio versions of their articles.
This got a great reaction, got people interested in Blogcast and, most importantly, made people happy 😁
I also spent some time making a settings page, allowing users to change credentials, update credit card details, change plan and view invoices. Here's a walkthrough of the complete UI:
Miguel Piedrafita🐘@m1guelpfFinally finished working on the UI for my new product! Still thinks to tweak, but here’s an early preview:
blogcast.host17:55 PM - 18 Jan 2019
There was only one feature left: voice selection. Up to that moment, the voice selected was hardcoded in the backend, but I wanted to make it customizable. This'd also allow transcribing articles in different languages and accents.
Implemented this in the backend didn't take much time. I just had to make the hardcoded voice dynamic and make a list of all available voices. But, as you may have guessed, frontend was a different story.
A voice selection option didn't fit the current UI, so I made it a modal and made the create article button open that modal. This way, I wasn't setting any default for the voice, leaving the decision completely to the user. Making all of this responsive was also an awful lot of work, but I wanted the dashboard to be equally usable both on mobile and desktop, which is something a lot of business don't even consider.
After all that I was super tired, but Blogcast was feature complete!
Miguel Piedrafita🐘@m1guelpf🎉Blogcast ia feature complete!!!!!!!
Next item in my list is "First paid render", someone wants to help?😁
blogcast.host21:44 PM - 19 Jan 2019
By the seventh day God had finished the work he had been doing; so on the seventh day, he rested from all his work.
I'll be honest with you, I didn't get much done on the seventh day. My objective for the day was to prepare the Product Hunt launch, but I was tired and had yet to do my homework. So I rested.
I'm also writing this, in hopes that, even without a logo or animated thumbnail I wanted to make, I'll be able to launch on PH tomorrow.
Building Blogcast has been super fun. I've learned a lot of new things and managed to build a product I'm proud of in a very short period of time.
I'm thankful of everyone who has made it possible for a 16-year-old to build awesome things, from the authors of the tutorials I used to learn to code to the maker community that inspires me and keeps me going. Let's make the world a better place, together!
And, if you have a blog, how about giving Blogcast a try? It may help you connect with your audience or get more traction. Almost no one is doing this yet, it's your chance to shine!
(open source and trusted by devs everywhere ❤️)