Creating a landing page without coding and a new branding for the project #2

Bernhard Hauser -

In the first article I kicked off the 'Coffee Circle' side project and gave you a bit more context about the idea and what happened so far. The idea for a service that would match like-minded entrepreneurs to form a circle emerged already years ago. A couple of months back I moved to a new city and the idea became relevant again, hence I set out to build it in public to see if I can solve a problem for others, too.

Now let's dive right into it.

This is the first version of 'Coffee Cirlce' that I set live. It quickly generated some interest and people started signing up for it.

To be honest, it doesn't look to fancy, does it?

"If you are not embarrassed by the first version of your product, you’ve launched too late." – Reid Hoffman

The point is not to make it look fancy, but fancy enough to generate results and insights as early as possible. In this case, I was able to get 20+ signups through channels with low but targeted reach.

That doesn't sound too much at this point. However, given the fact that the project was promoted through very target, low volume channels, the interest is at least worth taking a closer look at.

If we already generated some interest with a sh*tty first version, how much more could we get by a more advanced version of the product?

First let's understand how this first version worked and how it was built without a single line of code.

The user story

As a user, you would experience the following journey:

  1. You open www.coffeecirle.co and enter your details in the form on the right hand side
  2. The form includes fields for name, email address, a personal link (optional) three fields of interest and a bio
  3. After you submitted the form, you would have to wait a few days until you get matched with two others with same interests
  4. In the following email conversation, all three find a common time and place to meet ✨

The matching process is done manually by me. Yep, no magic there.

Whenever I would spot a new match, I compose a new email, put everyone in CC and start off by recommending a time to meet.

Since I'm not a coder myself (except for landing pages with some basic HTML and CSS), I relied on using services that would help me automate workflows.

The landing page builder: Carrd

In March I discovered by coincidence on Twitter a landing page builder named Carrd by @ajlkn that offers a simple yet powerful feature set, enough to spin up a new landing page in no time using simple visual editor.

The most convenient part is that it integrates with the popular automation service Zapier. That way I was able to put automation to work and start collecting leads through the sign up form.

The automated workflow: Zapier

I recommend anyone who doesn't know Zapier yet to check it out. It can be described as the most versatile automation service on the web. It connects with pretty much anything out there and makes it kind of smart.

In my case, I used Carrd's Zapier integration that triggers a Google Sheet and populates it with the data collected through the form.

As you can see above the workflow is rather simple and involves only one step to add the form data to the Google Sheet below:

Fixing two problems

Up until this point, two problems occured. The first was around the conversion rate from being matched to actually meet. As to my knowledge, only 2 out of 6 circles ever met.

I found out that sometimes mails would get stuck in spam folders, but also that people didn't really follow up on the conversation. I have an idea how I can at least improve the process.

The second and more important problem is the name 'Coffee Cirle'.

When I registered the domain in 2014, I didn't know the brand 'Coffee Circle' already existed – and to be honest, I didn't google for it. When I launched the prototype I knew that this might become a problem, but at this point I didn't pay much attention to it.

However, as the project gains traction and potentially becomes something that I want to pursue further, it makes sense to rethink the name and buy a new domain (which is obviously the fun part.)

'Coffee Circle' becomes 'Mate Mate Mate'

After some research, brainstorming, ideation and out of sheer desperation I came up with Mate Mate Mate.

Why you ask?

  1. The name is easy to remember
  2. Mate tea is a common drink among startups in Berlin
  3. It resembles quite nicely that circles of three are matched
  4. The domain MateMateMate.com was still available yes, freaking dot com

Since I'm neither a coder nor a designer, I approached my sister Lisa for help. Apart from being a skilled young graphic designer, she is also an awesome person. Be sure to check out her work at LisaHauser.com ✨

My experience is that after all it's friends and family who help you the most to get your project off the ground. In this case I'm lucky to have my sister helping me out with her awesome design skills.

The next step is to rebuild the new landing page using Carrd (for now) with new name and design at MateMateMate.com. Go check it out!

Don't miss out:

Up next:

  • Improving the workflow to raise the conversion from match to meet
  • Finding new ways to attract people to Mate Mate Mate to gather more data