Alternating Feature Rows

The classic zigzag: image left, text right, then flipped, walking the visitor feature by feature.

Copied 0 times.

[shot]
[shot]
[shot]
Members only

Members only

This design needs a membership.
Today's price: $1/month, locked forever once you join.

Members only

What it does

Alternating feature rows are the classic product-page zigzag: picture left with words right, then flipped, walking visitors through what you do one feature at a time. The rhythm keeps people scrolling.

  • Each row pairs a media block with a heading, a couple of sentences, and a small optional link.
  • Real product media only: actual screenshots or your own illustrations, never stock photos pretending to be the product.
  • Stand-in boxes are fine while you build, but they're clearly labeled as stand-ins.
  • Every heading sits on the same size scale, so the section reads as one piece.
  • Text columns keep a comfortable reading width; pictures hold their space while loading.
  • Pictures below the first screen load lazily, keeping the page quick.
  • On phones every row stacks with the picture first.

How it works

  1. 1Slide the row count, 2 to 5 features.
  2. 2Pick which side the first picture sits, left or right; the rest alternate from there.
  3. 3Choose the media style, framed product screenshots or brand-colored illustrations.
  4. 4Copy the prompt, the section's full plan for your AI, into whichever AI you use.
  5. 5Drop in real screenshots or artwork and write each row's heading and two or three sentences, one clear point per row.
  6. 6Scroll the finished section slowly on desktop and phone: each row should make its one point before the next begins.

What you can customize

  • Number of rows: two for a focused pitch; five for a proper product tour with a rhythm to it.
  • First row media side: left or right, purely which way you want the zigzag to snake.
  • Media style: screenshots prove the product is real; illustrations suit ideas that don't screenshot well.
  • Spacing, frames, and type adapt to your site automatically, because your AI builds the rows right inside your own design, row after row.

You'll also like