A modular system for testing landing pages

A second way

A third way

Mapping it all out

  1. Layouts need to be rather simple
    If you are creating a landing page specifically for click testing, fancy looking layouts are actually counter productive. You want to gauge people’s opinion of your offering, and not judge your (incredible) design skills. The message is what counts not the looks.
  2. It needs to be some kind of digital product or service
    Sorry for the bias, I work in digital so there you go. In my experience there are some unspoken rules about designing landing pages for click testing. A clear message at the top, probably some sort of feature list, things it can do, maybe some social proof and definitely a pricing section.

Deconstruct and understand

  • A headline
  • A subhead
  • One or two CTA (no, you can’t have three)
  • An image of some kind
Example of of some INTRO sections
  • Two or more icons/screens/visuals of some type of features or key benefit
  • A short block of text for each icon/screen/visuals
  • A CTA to find out more or a similar action for each
Examples of KEY sections

Building it out

  • a web framework (Zurb Foundation) on top of which I could create my building blocks (Handlebars).
  • a way to fill those blocks with the right content (JSON).
  • a way to assemble automatically the pages and spit out an HTML page (Gulp.js).

The INTRO section

In this example JSON is feeding Foundation classes for grid alignment as well as specific copy for a header to Handlebars

Conclusions

  1. Building more components and testing them with some new landing pages.
  2. Making the Handlebars components even more modular, with more control on classes and so forth. Basically figure out how much flexibility and control can I get just by using JSON with Handlebars.

--

--

--

Interaction designer and maker of things extraordinaire.

Love podcasts or audiobooks? Learn on the go with our new app.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Sandro Macchioli

Sandro Macchioli

Interaction designer and maker of things extraordinaire.

More from Medium

Real estate mobile application

How Does Digital Documentation With Workforce Management Software Increase Profits?

Savr: Cooking App UX/UI Case Study

Case Study : Stocks App Improvement