Source: https://octet-prow.app/examples/portable-blender-product-page

Product page example · Kitchen

# Single-product landing page example: a portable blender for social ad traffic

A one-product store page for Whirlby, a fictional portable blender, made on the phone canvas for visitors arriving from a social ad. The price and Add to cart are in the first screen and in a bar that stays at the bottom; then come recipes, cleaning, the four colours, what is in the box, a two-for-$69 bundle and short answers.
Page type
Product page
Canvas
Phone · 390 px
Sections
7
Brand
Whirlby (demo brand)
THE PAGE
Download as a free template.zip · 2.1 MB Open the live page ↗

## Download and usage details

Files
HTML + CSS · images included
Usage
Free to edit and use in personal and commercial projects. Attribution is optional. Do not resell or redistribute the templates themselves as templates.
Forms, if included
They look complete but do not send anything. Point the form at your own form service or email tool before you publish.
Fonts
Fonts load from Google Fonts
Demo content
Every brand is a fictional demo brand, and the copy was written for that demo. Replace product facts, offers and any testimonials with your own, and check every claim before you publish.
All templates →
01 / THE BRIEF

## What we typed

A product landing page for the Whirlby Go portable blender, made for people arriving from a social media ad on their phone. It holds 450 ml, charges by USB-C, has a six-blade stainless steel base, and the cup doubles as a travel bottle with a sealed lid. It comes in four colours: sand, sage, coral and charcoal. Price: $39, or $69 for two. Ships in 2 business days within the US, free returns within 30 days, 1-year warranty. Show what you can make with it, how to clean it in one step, and what is in the box. Answer a few short questions about charging, what it can blend (not hot liquids or ice cubes) and returns. Main action: Add to cart, linking to the store's checkout. Do not invent reviews, ratings, sales numbers, battery-life claims or customer photos. In the footer, add one line: Whirlby is a demo brand created to show what Octet Prow can build. It is not a real company and nothing here is for sale.
02 / DESIGN SYSTEM

## Whirlby Blend Bright

- primary · #FF6B1A
- secondary · #12A150
- surface · #FFFBF7
- outline · #C9B4A7
- inverse · #1C1310
- Serif · Fraunces
- Sans · Nunito Sans
Generated once for the project from its brief. Every page in the project follows it.
03 / STRUCTURE

## How the page is put together

- Opening Smoothies, made in your hand Capacity and charging in one line, a photo, the price and Add to cart.
- 01 Fruit in, smoothie out What you can make, as cards you swipe, and the two things it does not blend.
- 02 One step, no scrubbing Cleaning in three icons.
- 03 Pick your Go The four colours, as cards you swipe.
- 04 Everything you need to start What is in the box, with a spec list.
- 05 Two for $69 The two-for-$69 bundle on its own card.
- 06 Short answers Charging, what it blends, carrying, shipping and returns.
04 / REVIEW

## What we checked and changed

Our brief asked the page to show cleaning and what is in the box without saying what they were, so the model filled both in. We kept its generic cleaning steps (water, blend, rinse) but removed a detachable blade base. In the box we kept only the blender and the cup with its sealed lid, and removed a USB-C cable and a quick-start card. We also removed “blends fruit in about a minute”, frozen fruit in the recipes, a tip to cool drinks to room temperature first, and a charging answer saying any cable and plug would do. A second round put back an “and” the first edit had dropped from the opening line. The nine photos were generated in the editor. The one beside the box contents first showed a charging cable, so after the first publish we asked the editor to describe that photo as only the base and the cup, and redrew it. We linked the wordmark to the top of the page; the Add to cart buttons have no link, because there is no store behind a demo brand.
MORE EXAMPLES
Product page · Skincare A cream that helps dry, easily irritated skin hold on to moisture. → Product page · Home & garden Plants die because you forget to water them. →
MAKE ONE LIKE THIS

## Start from your own product and the question your readers ask.

Start creating