# I launched on Product Hunt! 🎉

> What I learnt from this small launch
- **Published**: 2024-03-30
- **URL**: https://rikiphukon.com/blog/launched-on-ph

---

<Alert>
  Analytics data for Clack ⤴ 

  What's Clack you say? Check it out <u><a target="_blank" href="https://clack.rkph.me">here</a></u> or read
  <u><a target="_blank" href="/projects/clack">this</a></u> writeup.

</Alert>

I launched Clack on Product Hunt last week. It was scary tbh because although
I got everything straightened, it felt like a freaking big leap of faith to me.

There's always a feature you want to improve on, a design you wanna implement, this
kept me from launching for some time. Also I didn't know what a Product Hunt <i>hunter</i> was until after
the launch!

I've spent a lot of time on this one. The design went through multiple iterations. Countless hours were spent reading documentation to integrate Google and Notion with Clack.

<video
  width="100%"
  id="video1"
  style={{ borderRadius: "6px" }}
  aria-hidden="true"
  playsInline
  autoPlay
  muted
  loop
>
  <source
    src="https://d1g2o751bxy91o.cloudfront.net/personal-blog-producthunt.mp4"
    type="video/mp4"
  />
</video>

<Alert>I used Framer motion to animate the cards on the landing page.</Alert>

I created product shots and shared them on Reddit and Discord communities.
Following that, I commenced writing my initial comment. This was my
opportunity to connect with potential users. All going well, it would
be read by several hundred people so I wrote a long one.

In hindsight, it was a failed launch. I should have produced teasers and
collaborated with a hunter, as I lacked an audience on the platform.

## The Design

My aim was to omit everything superfluous and show only the essential to the best possible advantage.
I wanted this to be clean, minimal. Heavily inspired by Notion.

<div className="grid grid-cols-2 grid-rows-2 gap-1 overflow-clip rounded-lg">
  <img
    width={600}
    height={400}
    src="https://d1g2o751bxy91o.cloudfront.net/personal-blog-gp.png"
  />
  <img
    width={600}
    height={400}
    src="https://d1g2o751bxy91o.cloudfront.net/personal-blog-np.png"
  />
</div>

The gradient that I used to fill the background was made by absolutely positioning a rough polygon
and overlaying a translucent div node over it.

<Image
  width={600}
  height={400}
  src="https://d1g2o751bxy91o.cloudfront.net/personal-blog-rg.png"
  caption="Onboarding"
/>

<Image
  width={600}
  height={400}
  src="https://d1g2o751bxy91o.cloudfront.net/personal-blog-cf.png"
  caption="A minimal illustration to fill the empty spaces"
/>

<Image
  width={600}
  height={400}
  src="https://d1g2o751bxy91o.cloudfront.net/personal-blog-desktop-dash.png"
  caption="The dash with linked Notion & Google documents"
/>

I went through a lot of session replays and after crunching the numbers,
conclude that Clack lacked the audience. It could have made use of a better
launch. Users were curious as isevident by the 39 seconds
of average visit time on the landing page.

Anyways, time for the next one and a new and better product, and a fabulous launch!

**Keep building, keep learning. After all, there's nothing that teaches like a project!**

> A launch is a in important milestone for YOU! It's the first step to start something great. 
If the launch didn't go well, no worries. At least you launched. Most people don't take action;
they merely consume. So give yourself a pat on the back.

~ Riki

<LinkPreview
  imageUrl="https://upload.wikimedia.org/wikipedia/commons/8/89/Product_Hunt_Logo.svg"
  title="Clack on Product Hunt"
  description="Track your writing progress from Notion & Google Docs, effortlessly."
  link="https://www.producthunt.com/posts/clack"
/>

<LinkPreview
  imageUrl="https://github.githubassets.com/assets/mona-loading-dark-7701a7b97370.gif"
  title="phukon/clack"
  description="Clack syncs your writing ✍🏽 activity from Notion and Google Docs, and comes with an AI assistant and a Notion-style WYSIWYG editor"
  link="https://github.com/phukon/clack"
/>
---
- [All articles](https://rikiphukon.com/blog)