From Scratch to SaaS - Building and Launching a SaaS in 10 Days! 🚀

Written by fermomento | Published 2023/06/08
Tech Story Tags: saas-tools | saas | build-in-public | social-media | linkedin | instagram | technology | hackernoon-top-story | hackernoon-es | hackernoon-hi | hackernoon-zh | hackernoon-vi | hackernoon-fr | hackernoon-pt | hackernoon-ja | hackernoon-tr | hackernoon-ko | hackernoon-de | hackernoon-bn

TLDRI recently decided to take on a personal #buildinpublic challenge where I set out to build and launch a SaaS product in just 10 days. I’ve decided to create the easiest-to-use carousel maker for Instagram and LinkedIn. It’s all about making the design process simpler and more accessible for everyone, regardless of their technical abilities.via the TL;DR App


I recently decided to take on a personal #buildinpublic challenge where I set out to build and launch a SaaS product in just 10 days. It had been quite a while since I’d built a product from scratch, and I wanted to push myself to create something new this year.

To begin, let me explain why I am taking on this challenge. My goal is to hold myself accountable. I have a tendency to keep building more features and saying “what if I add this?” or “what if I add that?” But this time around, I want to resist that urge and focus on keeping it simple yet functional by having this time limit.

I’ll be showing you the entire process of building a SaaS product from:

  1. ideation

  2. development, and

  3. launch

But I won’t be giving any advice or pretending to know what I’m doing, since this is my first subscription-based product. Instead, I’ll simply be transparent with the development process and end results so that you can learn from both my successes and failures.

💡IDEATION

So, what’s the new project going to be about? I’ve decided to create the easiest-to-use carousel maker for Instagram and LinkedIn.

I got the idea for this project because I noticed how popular carousel posts were on LinkedIn. I have worked on creating carousels, and trust me, they can be pretty time-consuming to design. So, I thought, why not create something that makes it easier for non-designers to create their own visually engaging carousels?

I don’t want to overwhelm users with too many design options, though. After all, the lifespan of posts on social media is so short, that it’s not always worth spending a lot of time perfecting them. My goal is to provide just enough options for users to create eye-catching designs that reflect their personal or company brand without making things too complicated.

Back when I worked as a designer for startups, I often found myself juggling multiple responsibilities. Not only was I working on marketing design, but I also had to handle product design and other things as well — that is life at a startup! With so much on my plate, it was especially frustrating when I had to spend time making design changes after many copywriting iterations. I often wished that the people in charge of the copy could make those changes themselves without needing to involve me as a designer.

That’s why I think my carousel maker tool might not only be useful for regular folks managing their personal brands, solo founders, and indie hackers, but also for small companies or startups with limited time and resources to dedicate to design. It’s all about making the design process simpler and more accessible for everyone, regardless of their technical abilities.

Although I’m not sure if my approach will appeal to users, the fact is that there are already big players in the design templates market. I need to differentiate myself enough to stand out but not so much that I can’t attract a broad audience.

So, I’m running this 10-day experiment to see if this idea’s got legs. There’ll be some rough edges, but it’s all about testing whether I should keep going. If the product doesn’t generate any revenue within the first month, then I’ll know it’s time to try something else.

🤔 PROBLEM

First off, templates can be tricky. They might look amazing at first, with just the right font sizes, harmonious color palettes, and well-picked images, but users can struggle when it’s time to customize them.

When they add their text, change font sizes, and move things around, the final design might not be what they hoped for. It’s no surprise, really. If you’re not a designer, how would you know which fonts sizes, colors, margins, or paddings to use? Too much freedom can lead to messy results.

Also, many of these templates are unique and flashy, and it can be tough to fit into a specific brand, causing visual inconsistency and a mixed-up brand image. The other issue is that if a super unique, eye-catching template gets too popular and users see it all over the place, it screams “template!” and that doesn’t usually go down well.

🤔 SOLUTION

What I want to do is offer a simple design solution that lets users add their brand fonts, colors, and logos without any extra bells and whistles. A simple design is universal, it’s not owned by anyone, but you can make it your own by adding your brand’s colors and fonts to give it a unique touch — it essentially eliminates the risk of appearing like you’re using the same template as everyone else.

⚠️ POTENTIAL PITFALLS

But there’s a catch: non-designers might feel unsure about their image and see simple designs as not good enough.

They could end up dismissing the tool as too basic and choose something else, attempting to compensate for their lack of design skills by adding flashy graphics and effects, believing that more is more. You know, the classic “make the logo bigger” situation — if you’ve ever worked with clients at a design agency, you’ll totally get what I’m saying!

Now that I’ve discussed these problems, solutions, and potential pitfalls, it is time to dive into the development process and see how I tackle these challenges head-on.

📅 DAY #01

https://www.youtube.com/watch?v=I0vS9Yq2f58&embedable=true

On the first day, I got the basic structure up and running. The carousel is functional, and I’ve intentionally placed the settings under each slide, so users don’t have to interact directly with the design elements. They can’t move or select anything, which is quite different from other design tools out there.

I’m not entirely sure how this approach will pan out, it’s a bit of a gamble. This is particularly aimed for users who might not be used to interact with a design canvas. Instead, the settings are presented as a form that is easy to fill out and adjust.

In the “Intro” slide, I’ve included a subtitle, title, description, a swipe right icon , and an emoji. Here’s another thing I’m taking a chance on… Adding an emoji could be a excellent way for users to convey the theme of the carousel without struggling to find an image that complements the design.

But what’s really exciting is that the font size adjusts automatically when you change the text. You can add as much text as you want, and it always adapts to fit.

Imagine how much time and effort this could save! No more manually adjusting the font size or repositioning elements every time you edit the text. This could be a real game-changer, allowing users to focus on creating engaging content instead of getting bogged down in design details.

I’ve also included set of text editing options that allow you to add color or italicize the title. It’s very basic, but it should do the job for now.

As for the regular slides, I’m making sure to keep the font size consistent throughout the carousel because constantly changing it can really mess up the design and make it look unprofessional. In the future, I want to give users a bit more control and flexibility by adding a general size selector.

Finally, to wrap up day 1, I’ve added a download button that generates a PDF file containing each carousel slide on a separate page, which is currently the required format for LinkedIn to create a carousel post when uploaded as a document.

It may not be the prettiest thing in the world, but I can officially say the carousel maker works!

For Instagram, I will need to export a series of images instead, that will have to wait for now.

📅 DAY #02

https://www.youtube.com/watch?v=xDMPYtBbH7E&embedable=true

It’s only day two and I’ve already couldn’t resist enhancing the UI to make it more visually appealing. Usually, I don’t prioritize the look of an MVP, but since this is a design tool, I figured it should at least look somewhat decent.

What else is new? After spending an obscene amount of 🕒, the emoji selector is now with the full list to select from, and I added a social media badge to the slides that users are going to be able to customize later on as part of the personal branding.

Plus, I implemented the buttons that allow users to remove, reorder, or add new slides as needed. And here’s a little bonus: the slides counter counts itself automatically, so users don’t have to worry about keeping track of it.

I also added the ability to toggle elements on and off for each slide, giving more control over the carousel content. And when I thought I was done for the day, I had to go back to modify the auto-resize script for the intro and outro slides. Now, it takes into account which elements are visible or hidden and adjusts the font size accordingly to fit the text (almost) perfectly.

And with that, day two of my 10-day #buildinpublic challenge comes to a close. I’m feeling pretty good about the progress I’ve made so far!

📅 DAY #03

https://www.youtube.com/watch?v=gvhaIhu9nrg&embedable=true

On Day 3 I focused on implementing a side bar that allows users to manage the overall settings of the carousel. This is the main design I’m going for — a left side bar for general settings, while still enabling users to customize each slide within the carousel.

The first option option in the side menu is the carousel type. If you choose LinkedIn, you’ll download a PDF, which is the format required to create a carousel on the platform. If you select Instagram, you’ll download a series of JPGs instead.

Another handy feature is the ability to decide whether users want an intro and/or outro slide. Sometimes, they might just want to get straight to the action without any introduction.

For the color palette, I wanted to make it super easy for users to select from a refined collection of preselected colors. Right now, there are only four, but I plan to add more and, of course, allow users to create custom palettes in the future.

The auto-resize feature for text on intro and outro slides is pretty cool, but like I said before, regular slides look better and are easier to read with consistent font sizes. So, I’ve introduced small, medium, and large options for text size just to make sure there is still some control over their overall size, as well as alignment choices.

When it comes to fonts, I’m applying the same principle as with colors — I’m providing handpicked font pairings that eliminate any guesswork regarding what looks good together.

I’m planning on adding more font options in future updates. However, I know this approach might not work for everyone, especially for brands that utilize fonts outside of the Google Fonts library.

I’ve also made it possible to disable the slide counter if you prefer a cleaner look.

For branding, the “personal” mode has options for headshot, name, or social media handle, and website, aimed at content creators, thought leaders, or regular LinkedIn and Instagram users. For companies, there’s a “company mode” that shows your logo and website.

I’m really happy the progress made so far, it finally starts to look like a real product, but there’s still some polishing and bug fixing to do for today.

📅 DAY #04

https://www.youtube.com/watch?v=i-mrUh2rB0Y&embedable=true

I spent most of Day 4 working on the save/load feature. Basically, users are going to be able design the carousel once, save all the general settings as a template, and load it in the future to save valuable time.

Right now, the implementation is very simple — it just saves a JSON file locally. But like most of the features at this MVP stage, it gets the job done!

I’ve also added a new carousel type option specifically for Instagram stories. I’m not entirely sure if it’ll be a popular choice, but now users can select Instagram Stories and download a series images with the right size to upload directly as stories. The branding is hidden on this option because Instagram already shows an overlay with the profile picture and name while viewing the stories.

The most significant update of the day is the “Background Design Options” feature.The goal of this feature is to add a subtle background design element that makes the carousel appear seamless even when you’re scrolling through it.

I think the seamless effect is what makes these carousels really cool, the carousel becomes like one full image that scrolls smoothly without any visual breaks.

But it’s a bit of a balancing act because I want to provide good-looking design options that at the same time complement any brand style without looking out of place.

Today I had time only to work on four options. It’s not an easy task because I’m limited to using HTML elements that I can manipulate to change their colors with CSS. But I’m confident that I can come up with a couple more design options.

That is all for day #4 of the challenge, only 6 days left to go!

📅 DAY #05

https://www.youtube.com/watch?v=YZLIZqwRSlg&embedable=true

On Day 5, things were a bit less exciting than usual. I spent most of my time polishing up existing features.

First, I added more color palettes, including the option to create your own custom color palette. And, similar to the color feature, I made it easier for users to customize their font pairings. They can select the checkbox for a custom font pairing, or choose to use only one font if that’s what they prefer.

I also added more subtle design background effects to complement any brand style, without looking disjointed or out of place.

Another update is the “randomize” button. The carousel already starts with random options each time the page loads, but the “randomize” button can help users pick random options until they find a combination that they like. It’s a small addition, but it can be a really handy!

Finally, I added “Slide Type” options: text, text + image, or only image. It’s possible that my target audience (non-designers) might prefer to keep everything as text, but I still wanted to provide the option for those who want to add images to their carousels.

That’s pretty much it for day 5 and, at this point, the tool is functional and I could launch almost it as is. However, there’s something really exciting that I actually started working on today, but I want to kind of finish it up before unveil it.

📅 DAY #06

https://www.youtube.com/watch?v=yNUu9Ffauwg&embedable=true

Day 6 of this #buildinpublic personal challenge and the carousel maker is almost done! I’m feeling pretty proud, but what comes next is the real cherry on top.

I’ve learned a lot from my experience building my other product, resumemaker.online. It’s a tool for designing resumes, and it took me a while to realize that offering help with the content was just as important, if not more important, than help with the design.

So, I want to see if this applies here too by adding an AI content generator to the carousel maker. Yes, I’m jumping on the AI hype train!

Here’s how it works: you set the number of slides, choose your topic, and let AI write captivating content for your carousel. Users can then edit and personalize it as needed, and it even selects the right emojis!

I think this feature could set the product apart from other carousel makers out there. It will not only help with the design but with the content creation as well. I’m excited to see how it turns out and how users will react to it.

📅 DAY #07

Day 7 is here and there is still one important aspect that’s missing — how to monetize it. This is my first subscription-based product and I’m a bit clueless on how I should do it, but here’s what I’m thinking about.

Most of the features will remain free, but as you may have noticed, I’ve included a watermark on the slides. Users can download carousels without the watermark, for free, but they’ll need to share a link on social media to do so. I’ve also added a message that encourages users to support solo founders like myself and spread the word on social media. Hopefully, it’ll help get more people using the tool!

But there are still some features that will be behind a paywall that I plan to sell under the “Time Saver Pro Plan.” I’m not really selling design; I’m selling convenience, a way to do something faster. I am selling TIME. For the price, I’m starting at $9.95 /m and will see how it goes.

The plan includes:

  • No watermark
  • Unlimited downloads
  • Carousels with up to 10 slides
  • The ability to load your own custom presets
  • AI capabilities for content generation

So there you have it — users will still be able to use the carousel maker for free without the watermark if they share it, but they won’t have access to the AI content generator or the ability to load custom presets. After they reach a certain limit of free downloads, they’ll need to start from scratch, and they can only create carousels with a maximum of six slides.

Overall, I think the free options that are really generous. And to showcase the value of the AI content generator, users can test out the AI capabilities with the some pre-generated results available across various topics such as entrepreneurship, yoga, and UX design.

Finally, I want to give a shoutout to Outseta for making the payment process a breeze to set up.

📅 DAY #08

https://www.youtube.com/watch?v=WdByyMlNpxc&embedable=true

Day 8 is going smoothly, and there’s not much left to do besides creating a simple logo and landing page.

For the logo, I didn’t want to spend too much time on it, so I started with a couple of options that ended up looking too similar to the carousel icon on Instagram. It could have worked, but my designer pride just couldn’t let that slide, so I had to discard them.

Then, I played around with different ways to distill the carousel shape to its simplest form. I tried adding the “A.I.” initials and also an icon that is commonly associated with magic or artificial intelligence.

I liked these versions a lot more, and started to feel I was wasting so much time on them. Just when I was about to settle on a design, I exported it the wrong way, and it turned out that the logo looked so much better without borders. It looked classier, and it still conveyed the same meaning.

So, I ended up being extremely happy with how it turned out — mostly by accident, not by skill. It still counts, right?

And as for the name reveal, I kept it under wraps because I didn’t want to spoil the surprise of the AI features… but now, without further ado, the name of the product is aiCarousels!

The landing page is also completed.

Keeping it simple was my goal, but to make it visually interesting I added a tiny javascript script that moves the carousel samples from left to right as the user scrolls. And I even used emojis instead of designing icons in the features section, staying true to the philosophy of simplicity behind the carousel maker.

Now that everything is set up, it’s time to get ready for the launch. There are still some things to try out before the gates are open for the public, but I’m can’t wait share the carousel maker with everyone.

If you want to check out the landing page for yourself, head over to www.aicarousels.com

📅 DAY #09

https://www.youtube.com/watch?v=Z-rYRdRytiA&embedable=true

We’re on day 9, and it’s finally time to launch! I’ve mentioned before that I wanted to cover from the ideation phase, to the development process, and now we’re getting into the launch phase.

In this post, I’ll share what I have prepared, and in the next one, I plan to share the launch results and see if people actually liked the product or not!

Honestly, it is most likely going to be a flop! The competition in the template market is insane, but that that’s the beauty of not investing too much time in a single project…

Imagine working on something for six month or even a full year, only to have people tell you, “Hey, your product is trash.” That’s going to hurt a bit, and it’s hard not to take it personally when you’ve devoted so much time and effort — it starts to feel like part of who you are.

But if you work on a project for just a few weeks (10 days might be a bit short), you can test the waters to see if it’s worth putting more time into it. Even if it doesn’t succeed, you can still feel good knowing you’ve gained some valuable lessons to apply to your next project.

As for the launch on Product Hunt (for those who don’t know, it’s the top site for discovering new tech products), I’ve set up a “coming soon” page. It currently has 23 sign-ups who’ll be notified when we go live so they can vote.

I’ve also put time into set up the product page, which goes live at 12 am, Pacific time. I’ve written a detailed description, prepared the first comment, which is very important to spark the discussion, and even added a 50% discount for Product Hunt users.

When it was time to make images, I felt a bit dumb. I was having a tough time trying to design fancy images for the page. Then, it hit on me — I could use the product itself to make them! After all, what better way to show off the product? So, I ended up making 9 images in 3 different styles, each providing a glimpse into the product’s capabilities.

Now, it’s just a matter of waiting for the page to go live. You can show your support when it does by visiting this link: https://www.producthunt.com/posts/aicarousels-com. Your support would mean a lot to me!

Regardless of how things turn out, it’s been a blast building something from scratch after a while. It’s also been a great distraction from some less-than-pleasant stuff going on in my personal life. So, let’s see how the launch goes, and I’ll catch up with you tomorrow with the results!

📅 DAY #10 — Mission accomplished!

https://www.youtube.com/watch?v=_Z40R-vFscY&embedable=true

Last day of this fast and furious challenge to build and launch a SaaS in 10 days. aiCarousels.com is now out there in the wild and I want to share the results of the Product Hunt launch and some closing thoughts.

To be honest, launching the product without testing it properly was a bit like a leap in the dark. I showed it to some friends, but you know how friends can be — they always want to make you feel good. So, even though they said they liked it, I took their feedback with a grain of salt. I really wasn’t sure if people would like it. Despite my concerns, the launch went surprisingly well!

aiCarousels secured the 9th spot, earning 154 upvotes, 64 comments, and 7 stellar 5/5 reviews.

It’s not really about the upvotes for me. Product Hunt has turned kind of into this popularity contest. So if you’re a founder with a big following, your chances of making it to the top are much higher.

I am more focused on the comments, because the positive feedback was overwhelming, and I’d like to share a few of my favorite comments that, in my mind at that moment, began to validate the product:

“Nice! I’m going to have my content creators try this and see if we can move away from Canva and save some time and $! It looks slick but it seems like the creation process too is super straightforward and simple!”

“I just paid a content creator on Fiverr to make me a load of carousels and ngl the stuff that your product has made for me is much better. Oh I wish I found this a couple weeks ago”

“As a social media manager for some Instagram accounts this tool is pure gold for me, I love it! Congrats on the launch! ❤”

“Beautiful! I was looking for a tool like that, even though I can use Figma for it. Your tool helps to make it quick, which is super beneficial.”

The overall impression I got from the comments is that they all they seem to know there’s a point where putting in more effort to create visually stunning carousels doesn’t provide much additional value. They see the value of getting something that is good enough, and getting it quickly.

But the icing on the cake was that 5 paid users signed up! That’s the ultimate proof right there. People can say they like your stuff, but when they actually pay for it, that’s when you know they mean it!

I’m extremely happy with the results and want to say a big thanks to everyone who supported the launch!

So now, what’s next? Good question…I didn’t want to get ahead of myself, so I haven’t really thought that far. There are A LOT of things I need to polish that I put off for the MVP, but as for the big picture, I’m not really sure yet. Maybe I can simply grow it to a decent MRR, list it, and try to sell it!

For now, I think I’ll chill a bit. This 10-day challenge was a really fun but it was also kind of intense!

I just hope you liked getting a look at the design process behind building a SaaS as much as I liked making it, despite knowing that some of you were hoping for more discussions about coding. Maybe next time, I’ll make sure to include more of that.


With that being said, this series ends here! However, I will continue to provide regular updates on Twitter 🐦

Once again, thank you for your support, and I’ll see you over there!

Also published here.


Written by fermomento | I #buildinpublic 🚀 Currently working on: 📝 ResumeMaker.Online 🤖 aiCarousels.com
Published by HackerNoon on 2023/06/08