Last month I was starting a new project and needed to build a quick product landing page. I recalled productpages.xyz being #1 on Product Hunt a couple weeks prior, so I started exploring it and handful of other inspiration sites.

After browsing a few hundred sites, it struck me how homogenous they all were. Apparently, I’m not only one thinking about it either:

5k+ ❤️’s ?! Clearly this struck a nerve.

There are a few ways to walk away from this realization:

  • 💪 Motivated to differentiate your next product site
  • 🤔 Inspired by what’s in vogue and excited to integrate it into a future product site
  • 💥 Struck that so much time is being invested in designing and building the same thing over and over

That last one was what stuck with me. I decided to investigate a bit further and go through ~50 semi-random product pages and turn them into loose wireframes. I ended up with a Sketch document with lots and lots of this:


Looking across the wireframed sites, I realized ~80% of all the sites were just a handful of basic building blocks.

This led me to wonder how hard would it be to abstract those blocks into simple design patterns and generic HTML/CSS components? I designed a quick and dirty landing page, using some of the basic blocks and random assets from other sites:

From here I designed a few more block variations and threw together a super, super simple drag and drop editor using just images:

This seemed promising enough and I’ve always been interested in learning how to build a real app, so I just got started. After a couple weeks of toying with Node, Express, React, Angular, Browserify, Vue, ES6, and probably a dozen templating languages, I managed to build a basic API and a pseudo-real editor. I spent another week building a basic front-end framework for the actual product page code (think very light lightweight Bootstrap specifically for product pages). Lastly, I threw together a few actual blocks with the framework to drag around and customize:

Forgive the video, I jump around way too fast (was originally just to send to a friend)

As of a couple weeks ago, Launchday was coming together nicely:

https://vimeo.com/189053773

Fast forward to a couple days ago…I realized I’m building a full-fledged product and it’s outgrown its humble “proof of concept” origin. I hadn’t planned on building a fully-fledged product, but I’m pretty into the idea now.

If you’re interested, sign up for the beta!

One clap, two clap, three clap, forty?

By clapping more or less, you can signal to us which stories really stand out.