> From building to selling - EP.09

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

Life update, no more regular streaming schedule… 😭

You might have noticed that I haven't posted in two weeks. I am slowly but surely looking at the end of my sabbatical, which means I have to start making an income again.

Last week, after a week of national holidays, I planned to get back to streaming. However, I was busy applying for interviews for a freelance role. After one speedy interview and doing one technical assignment, I didn't hear anything back…

I know this is part of the game, but I was gutted. I got overwhelmed with stress and a horrible case of imposter syndrome. I need a freelance job to pay the bills, but most jobs require TypeScript and front-end testing. I never had to use two things before professionally, thus the imposter syndrome.

To catch up on those two things, I will allocate more time to learn both things over the coming weeks. I want to make sure that I can land myself a freelance job (or job if I have to) before money becomes a real issue.

I will still be streaming, but not on a regular schedule. I am (incredibly) sad about this, but I will return once I have my cash flow under control!

Design overhauled. 🏗

This week I tweeted, “How it started vs. how it’s going. Taking a week off the project helped me let go of some design decisions.”

See the tweet with the images here.

When I opened Figma after a week, I didn’t feel the landing page design I had made. I didn’t match the product, and it wasn’t clear enough (without reading the copy) what the landing page was about.

While I liked the flow of the content and even parts of the layout, I decided to go for a different color pallet, give the page a more distinctive header, and focus on the details like the button sizes and whitespaces.

After a morning of tweaking the landing page, I couldn’t be happier with the result. The landing page provides a clear value proposition from the get-go, shows you how easy it is to use, and then walks you through the benefits until it ultimately leads you to the buy section.

With the design done, it’s time to start building it.

Back to good old HTML & CSS. 💕

In my last update, I shared my plans to use NextJS for the landing page. After thinking about it, it doesn’t make much sense to introduce that much complexity for a simple page with some text, images, and a link.

I mean, there is no API I need to consume and the layout also isn’t complex enough that I need something like Tailwind to style the page.

So, after creating an index.html and a style.css, I got to work! One thing I love about good old CSS is how far it’s come after I started working in front-end development. With the broad support for CSS variables and CSS grid, you can achieve (almost) anything without pulling in additional libraries.

Especially the last couple of weeks, I have been working on stepping up my CSS game by using CSS variables as design tokens. After setting up the design tokens yesterday, I noticed some inconsistencies, or better lack of consistency, in my Figma design, to many different font sizes, white spaces, button sizes, etc.

After fixing these inconsistencies, the landing page looks more professional and is super duper easy to make changes now. If I want to change any color, size, or background, 99% of the time, I now only have to update a single CSS variable (design token).

Awesome, isn’t it!?

Let’s continue working on the landing page! 🔨

Tomorrow I will continue coding the landing page. Hopefully, I’ll get close to 100% finishing it. However, we (me and Twitch chat) are still coming up with new ideas and questions, which means that I am tweaking the design here and there.

For example, while writing this blog post, I am thinking about changing the heading font to a different font. I think that will add the final piece of character to the landing page.

We can launch Crossroad next week if we get close to 100%! 🚀 (but before that, let’s talk about marketing for a bit…).

Thanks again for reading this build log. Have a great day, and I’ll see you tomorrow (or in my stream today)!

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

With love,

Twankrui