Side project progress: landing page done

Hi again!

Here’s another update on my journey of building a new product called Markfolder, a tool for bookmarking tweets. I’ll start with what I learned, and then details after.

Learnings

  1. Create a landing page BEFORE building your product, because…

  2. It really helps you refine many aspects of your idea.

  3. Creating a landing page can take a long time. It took me about 5 days in total.

  4. Skills required: copywriting, UX, design. You can learn these “on the job”.

  5. Use a tried and tested template and don’t reinvent the wheel.

  6. Use no-code tools to build it quickly, e.g. Webflow.

  7. Ask for feedback. Lots of people want to help you. Make use also of maker-focused forums like IndieHackers.

How I did it

As recommended in the book Traction by Weinberg and Mares, I’m dedicating half of my time to building the product and half to getting people to sign up (i.e. traction). So far this has been a great exercise because working on traction early also means early validation of my customer segment and the problem I’m trying to solve.

In order to start acquiring traffic, I first needed a website for traffic to land on. So the primary task here was to create a landing page. This is a project in itself.

Template

I used a guide by Julian Shapiro for creating landing pages. This saved me a lot of research because he outlined the template, thought process and feedback questions all in one post.

Building it

For the actual code, I had a HTML template I had bought a while back, so I just repurposed that for the landing page. I hosted it on my existing hosting service provider, which I’m using for other websites. Another option would have been to use a hosted solution like Webflow.com. I did start of looking into Carrd.co but found it too limiting for my needs.

The main images were created from screen grabs of Twitter, and then modified in Photoshop to make it look like Markfolder’s UI. Additional imagery were created using icons from Flaticon.com and put together in Figma.com.

For the signup form, I just used a free version of Airtable.com. With Airtable I was able to create a database for signups and embed a form for that database into my website. No backend coding required.

Feedback

Once I had all the elements in place, I published the landing page and sought feedback from people I know as well as from some of the forums I’m a member of.

The question I asked them were taken from Julian Shapiro’s guide. They are well thought out questions and the answers were really useful. The questions are:

1. Are you willing to sign up right now? If not, what would you need to see to get to that point?
2. How well the page sustained your interest on a scale of 1-10. What do you suggest be rewritten or redesigned to help it better sustain your interest?
3. What’s unclear? What unanswered questions are you left with?
4. Did you find something really interesting you wanted even more details on?
5. If you had to delete half the page’s imagery and copy, which would it be?
6. What triggered your “Untrue! That’s scammy sales speak!” reflex?

In total I received 6 detailed feedback. The most common feedback was that it wasn’t clear what benefit Markfolder provided the user. I didn’t realise it but in the landing page I wrote about features and not the pain or benefit. The landing page also had imagery that didn’t make sense - it was trying to be “clever” and created some conceptual images to explain the features, which obviously backfired!

Signups!

As a side effect, I also received 2 signups from posting the landing page asking for feedback. This really help boost my confidence that I’m on to something.

The landing page

Here’s what the live landing page, https://markfolder.com, looks like…

Next steps

Now that the landing page is ready, the next step is to get some traffic to it! I will detail my approaches to this in the next post.

———

I you think this post is useful, please do share by forwarding this email to your friends. Or just point them to https://farez.substack.com.

You can also follow me on Twitter @farez.

Thank you!