The Emotional Journey of Creating a Successful Product Hunt Project

My name is Tekeste and I am originally from Ethiopia. I moved to the U.S. around two years ago to pursue my Master’s degree.

I created Type Hero as a personal project and launched it on Product Hunt without any expectations. I was quickly overwhelmed with the positive response — Type Hero event became one of the Products of the Day.

I’ve experienced how rewarding it can be to release a personal project, but as we all know, the road is tough. The inevitable emotional journey of creating anything often makes it difficult to reach the finish line. This is why many of us have a ton of half-finished projects cluttering up our hard drive.

I’d like to share some of the things that I learned when making (and finishing!) Type Hero that helped me overcome the challenges and complete my goals. Hopefully, this will help you in your next personal project!

What is Type Hero?

The idea behind Type Hero is simple: finding the perfect font doesn’t have to be difficult.

Google Fonts is a fantastic source of free fonts, but when I was searching for a font to use in one of my projects, I noticed that Google Fonts only has basic preview functionality. This was frustrating because I didn’t particularly want to have to load up Sketch or Photoshop every time I needed to preview a font.

What I needed was a tool that I could use to quickly preview various fonts, and since I couldn’t find one, I decided to create my own! That’s what led to me creating Type Hero. It’s a tool that you can use to preview the entire Google Fonts library and experiment with different text colours and backgrounds — simply by navigating a few different menus.

Why I spend time on personal projects like Type Hero

Type Hero wasn’t the first project I’d worked on in my spare time. I can say from first-hand experience that if you have an idea for a project, then you should just go for it — the benefits of completing a personal project can be huge.

Beef up my portfolio and show my drive

When a potential employer is reviewing your CV and sees that you’ve built and launched a project in your spare time, they’ll know that you have the drive, determination, and enthusiasm required to take a project from A-Z. This is one of the best ways to stand out from the competition. In fact, this is exactly how I got my first job as a front-end web developer! In my spare time, I’d created a website to help connect filmmakers and advertising agencies with freelance models, actresses, and actors. While this website didn’t exactly take off, it helped me land my first job in the industry, not at all a bad substitute!

Learn new technologies

The world of software development is in constant motion. Whether it’s new tools, development environments, frameworks, programming languages, or even updates to software you’ve been using for years, there’s always something new to learn, and you don’t need to wait for someone else to teach you! Just watch some videos, read a few blogs and tutorials, and you’re ready to start experimenting with these new technologies. Personal project is the perfect place for this!

I came to grips with both JS and Electron JS by developing Note Me, a clone of the MacOS Notes application that runs on both Ubuntu and Windows.

I also used Game of Thrones to help me learn Next.js! Like many people, I’m loving this season of Game of Thrones. If you’re a fan of the show, then you’ll know that no one is safe. I got some hands-on experience with Next.js by creating a website called Game of Dying, where people can vote on which GOT character is going to meet a grisly fate next. Don’t worry if you’re not caught up — it’s spoiler-free! 😄

Releasing Type Hero on Product Hunt

I joined Product Hunt after being inspired by seeing people creating and sharing their products with the world. I’m studying in a pretty small town where there isn’t too much going on, so I was really excited to find a place where people just like me were sharing their projects with a vibrant, engaged community. I saw that Product Hunt gives small projects created by individuals, the opportunity to connect with a worldwide audience who is actively looking to try new projects — I wanted in on the action!

Before releasing Type Hero, I spent some time getting more involved in the community. I spent time looking for new products, upvoting and commenting on the ones I liked, and following lots of other creators.

After launching Type Hero on Product Hunt, I shared it on the /r/reactjs and /r/web_dev subreddits, which netted me some traffic, but I also got traffic from places I hadn’t been expecting, such as <webdesignerdepot.com>, who shared my project with their followers. 🙌

In addition, I got some traffic from Zeit, the hosting company I use for Type Hero. Initially, I just wanted to thank the people who’d made it possible for me to get my project out in such a short amount of time. In the open source community, it’s sometimes easy to forget all the hard work that goes into creating a project and how lucky we are to have all this great software, freely available for us to download! I tweeted @zeithq, thanking them for the free version of their website because it made a huge difference to my project. Zeit retweeted me, which sent an influx of traffic to my Product Hunt page.

When I launched Type Hero, my original goal was to get 20 upvotes and maybe 5 new followers on Twitter. I woke up the next day to over 100 upvotes! Since then, my project has been Product of the Day and currently has over 600 upvotes on Product Hunt. I’ve been blown away by the response — when you launch a project on Product Hunt, you really don’t have any idea where it might lead!

How I Dealt with the Emotional Journey

Personal projects are great, but the journey is tough. I think this diagram perfectly illustrates the highs and lows that every single person who’s ever completed any kind of long-running project will inevitably go through.

The first problem is that starting a new project is exciting, but once that initial rush has worn off, it’s easy to find yourself struggling to moving forward with it. And then, if you do manage to get over the initial loss of motivation, you’ll inevitably have to go through the dark swamp of despair (see above).

Thankfully, there are a few things that help along the way (besides belief, persistence, family/friends, and humor). Here are a few things that my experience starting and completing Type Hero has taught me:

Focus

While it can be tempting to keep cramming features into your project, version one should only include essential features. As soon as you’ve implemented these features, it’s ready to go. If you keep adding items to your ‘To Do’ list, then your project is never going to see the light of day!

It is normal to doubt

Know what you’re getting yourself into. At the start of a project you may be convinced that this is the best idea ever, but as time goes on, it’s perfectly normal to have periods of self-doubt and low motivation. You may even have moments when you wonder what possessed you to think that this was a good idea in the first place! Remember, this is normal.

During the low moments of making Type Hero, I’d look at the infographic above. This reminded me that what I was experiencing wasn’t unique to me. Everyone feels this way. I just needed to keep at it. Also, sharing my project with friends helped a lot. They gave me positive feedback and encouraged me to keep working on it. 💪

Keep your eye on the prize

While I was working on Type Hero, there were days when, after coding 9-5 at work, I just wanted to come home and spend the evening in the front of the TV, and moments where I was convinced that no one would want to use my project, even if I did manage to finish it.

But I just kept reminding myself that I wasn’t creating Type Hero solely for other people. I started this project because I needed a tool that would make it easier for me to choose fonts and because I wanted to experience launching a project on Product Hunt. As long as I completed Type Hero, I’d achieve these two goals, regardless of how many people actually used the finished product.

One small win at a time

A technique that I found really helps me complete my projects is to break the work into manageable chunks. This is really crucial to avoid feeling overwhelmed, and each small task is a small win along the way.

I used Atom tasks to break Type Hero into lots of smaller tasks that I could complete in around 30 minutes. I also found React really helpful for making sure I didn’t feel overwhelmed. I’m not much of a designer, so when I was planning Type Hero, I just opened Figma (a new kid on the block that’s web-based that I really love) and did a rough layout. The React components immediately started to jump out at me. I could then focus on one React component at a time.

I only spent one or two hours a night working on my project, but I always came away thinking, “Hey, I got X, Y, and Z accomplished.” By setting a steady, manageable pace, I avoided getting burned out. Three weeks later, I was ready to launch Type Hero.

Stop planning, start working

Make sure you don’t fall into the trap of spending so much time planning your project that you never actually get around to starting your project. In particular, when you’re creating software, it’s easy to get hung up on technical details, such as debating which framework to use, but ultimately your users don’t care about how your project works behind the scenes. They just care about whether it works for them!

Don’t reinvent the wheel

You also shouldn’t waste your time recreating components that already exist. While it can be tempting to try and create every part of your project from scratch, the truth is that time spent reinventing the wheel is time that you should have invested in the features that make your project unique. For example, when I needed to include a colour picker React component in Type Hero, I found one on GitHub and incorporated it into my project, rather than unnecessarily creating my own.

What’s next for Type Hero?

I’ve been lucky enough to find an audience who is actively interested in Type Hero’s development. They’ve provided me with some really great ideas about features I could include in future releases. For example, someone pointed out that the actual Google Fonts website lets you link to your chosen font by copying the CSS. Including similar functionality in Type Hero would make it so much easier for users to add the selected font to their own website. This is exactly the kind of feedback I need in order to continue improving Type Hero.

In the future, I’d like to add support for:

• Gradient backgrounds
• Multiple text blocks
• Icons from the Noun Project
• Unsplash images (they have a huge collection of high quality images!)

It would also be great if the user could download the finished product as an image and mark certain fonts as their “favorite” fonts.

At the moment, I’m focusing on completing my Master’s degree (exams are coming up! 🤓). After receiving so much positive feedback, I’m committed to making Type Hero the best it can possibly be, so I will get around to adding these features — I promise!

In the meantime, you can check out Type Hero on GitHub or Product Hunt. If you do try the project, I’d love to hear what you think in the comments section or on Twitter!