From building to selling - EP 02

Welcome to day two of the Crossroad build log! This series follows my journey of indie hacking a product from building to selling. If you missed day one, you could check it out here. I also uploaded today's Twitch stream to YouTube if you want to watch the replay.

New milestone 100 followers on Twitch! 👾

Two months ago, I started to stream more regularly, three afternoons a week. So far, it has been a blast. I’ve met incredible people while getting better at creating (live) content. Today, I hit 100 followers, something I didn’t expect to hit so quickly.

I am so thankful for every one of you. You are the real MVPs of the stream!

How did I do it? Just keep swimming! 🐟

You have to keep showing up, keep improving when things don’t quite work, and enjoy the small victories you achieve along the way.

Blocks, blocks everywhere. 😲

Yesterday I ended the build log by telling you that I was planning on making a list of all the blocks that I have to design. My goal is to have at least 3 to 5 blocks per category so that the users can mix and match the blocks to create their unique pages.

If you want to check out and follow the progress, here is the complete list of blocks;

Click me to see a list of blocks.

As you can see via the link, I have also marked certain blocks to be only available for the “PRO” version. However, I ensured that the lite version has plenty of blocks to play around with. The last thing I want is the lite version to feel like some sort of decoy. Whatever I sell, it does need to provide value to the person who buys it.

I am also thinking about adding an upgrade path for the people who have bought the lite version. If the user likes the template, they can unlock more blocks. I don’t know if this is possible with Gumroad, but I am sure I’ll figure it out.

Designed the different headers. ✏

After creating the list for all the blocks, I opened Figma, and started working on the components for the different headers.

It was fun using Figma in a way I haven’t really used it for before. Normally I would put shapes, images, and text on the screen. Now I am creating components and mix and match them on artboards to get a feeling for how composing a page will work.

Designing in this way also inspired me to think of a couple of new blocks that I could add to the packages. Now I just have to make sure that I don’t get lost in a “just one more block” mindset, I have to ship it eventually.

Managing weights inside of the design. 🎨

While working with the components, I struggled with applying weight, especially the designs' copy. When the weight inside your design isn't right, the whole design tends to feel crowded, oversized, and even unprofessional.

After tweaking the designs a bit, I realized that my problem was that I didn't use a good color pallet. The blacks were too harsh, while the contrasting colors caused more of a disconnect from the rest of the text than it did applying any form of weight.

So, I needed a way to manage the balance between different headers, sub-headers, and body text. I ended up trying out the gray theme color scale of Tailwind, giving the important titles the darkest colors while giving the sub-headers and the body text a lighter shade of gray.

After applying this throughout all the components, the whole design started "breathing." The weights felt right, and even by changing a few colors, the design looked more professional.

On to next week! 📅

Next week I’ll continue working on the design of the blocks. After I have created all the blocks, I want to iterate on the design one or two more times to bring the designs to at least a level that wow me.

It’s already getting somewhere, but it needs to be better and more professional to sell it.

Thanks again for reading this build log. Have a great weekend, and I hope to see you next Tuesday!

If you want to stay updated in the meantime, give me a follow on Twitter.

With love,