How I Redesigned a Landing Page by Deleting Things

The Superseller landing grew up, mostly by losing stuff.

Landing pages go off faster than milk. In July I designed a page for Superseller that said one thing: it answers your buyers' questions on Allegro. That stayed true for about a month. Then the product kept growing, and by October the page was selling a smaller app than the one people were signing up for, in colors the app had already stopped using.

Superseller takes the repetitive work of running an Allegro store off the seller's hands, from buyer questions to parcel updates, and passes anything that needs a decision back to a person. I design the product on our team, so the landing page landed on my desk too. This post is about the landing page, the app has its own story.

Where it landed. The sea of messages is the only thing that survived every version.

The problem

By October, Superseller Memory read the seller's documents, Superseller Follow-up wrote to buyers after the sale, parcels got tracked, replies came in the buyer's own language and Superseller Scout was in testing. The page, meanwhile, was still introducing the app from July.

So how do you make a page tell the truth about a much bigger product without turning it into a list of everything? It turned out my answer was mostly the delete key.

The rules I set

One thing was untouchable from day one. The sea of messages, faded buyer questions drifting behind the headline, had quietly become the brand, and you don't redesign a brand because you got bored.

Features got proper names too: Superseller Inbox, Memory, Follow-up, Scout and Voice, each shown as the Superseller logo next to the name. Think "Apple iPhone", minus the keynote.

The visual system

The page is almost entirely gray, with one burnt orange doing all the talking. Orange means "this is the product" or "click here", so it doesn't get to moonlight as a background, a section color or a decoration. When something needs a softer orange, it gets a tint so faint you'd only notice it missing, and only small chips are allowed to wear it.

July (left) and October (right). Same layout, minus the beige, the louder orange and two typefaces.

The July page was warm beige with a louder orange and two display typefaces. In mid-July I moved it onto the product's new design system and set everything in Inter. I know, Inter! But despite being overused, it's still a beautiful typeface, and I feel like it's the right one for this job. Now the page looks like the app it's selling.

Every section heading sits the same distance from its description, so the page reads like one document instead of fourteen. Small labels share one chip style in three tones, and nothing else gets to be a pill. Arrows are drawn icons, never typed characters.

What changed

A headline that rotated. For most of the summer the hero read "Hello," followed by a rotating buyer question, each in its own color: orange, blue, green, magenta and teal.

Five colors and a new question every few seconds. Fun while it lasted.

It was lively, and it showed the product's job in one line. But once the product did more than answer questions, a headline made of buyer questions described one feature. The new one stays put: "You grow the store. Superseller handles the rest." The second line is orange, and that's all the excitement it gets.

A decision trace. The old page listed the safeguards next to a screenshot of the app. I wanted people to see them at work, so the list became a decision trace. Pick an example conversation and see what Superseller hid, which sources it used, which of your rules applied, how sure it was, and whether it sent the reply or passed it to you.

A list of safeguards (left) became one example you can explore (right).

Fewer cards. At some point almost every section lived in a frame: pricing, the message list, the mode switcher, the trace. Cards are the bubble wrap of web design. While reviewing one section I wrote "see how pretty it looks without them", and that became the rule for the rest of the page. If content can sit on the page with a thin line between items, it doesn't get a card.

Pricing, minus the cards and the uppercase labels.

A hologram for Voice. Superseller Voice, a phone receptionist that picks up when the seller can't, got its own page in September. It was first planned as a separate product, so it got a look of its own: a hologram card in the hero, a dark tile with a shimmering waveform drawn live by the graphics card. It was the most impressive thing on the site. But does a waveform need its own graphics engine? It does not. Once Voice became part of Superseller, I deleted all 585 lines of it and gave Voice the homepage's idea instead: a field of floating call cards, with incoming calls, bookings and handoffs drifting behind a soft veil.

The hologram (left) and the call cards (right), which are the sea of messages, out loud.

The rest of Voice got the same treatment. A dark section with numbered cards became light tiles with small previews of the real setup.

Numbered cards (left) became tiles that show the actual service (right).

Back on the homepage, the salmon bands around the calls to action went gray and white like everything else. They did their job, but they stood out more than anything they pointed to.

Gray and white, so the buttons are what stands out.

What's left

Features is the section that had to carry the bigger product. Superseller Inbox, Memory and Follow-up each get a tile with a small preview of what they do. The smaller things, parcel tracking, languages, learned rules and alerts, share one open row underneath with a single example each. Not everything deserves a tile, and parcel tracking took the news very well.

Three tiles for the named features, one row for everything else.

The old modes section explained suggestions and automatic replies in words. Now the two mode cards are the switch. Pick one, and seven example messages next to it show which replies Superseller sends on its own and which always come to you.

The cards stopped describing the control and became it.

The roadmap is a timeline. Shipped work is grouped by month, then comes a "Today" marker, then what's coming, grouped as in the works, up next and in the near future.

Everything above Today already works. Everything below is a sneak peek.

On Voice, the missed-call example used to be one fixed sum. Now it's a calculator with three sliders, clearly labeled as an estimate, so nobody mistakes it for a promise either.

Same math, except now you can argue with it.

The small stuff

The price tag. In July the waitlist button had a discount tag hanging off it on a little string. I wanted it to look sewn through the button, and it took nineteen screenshots to get there. The tag is gone now, but the idea survived: the "7 days free" chip hangs over the pricing button at an angle.

The July tag (left) and its calmer grandchild (right).

Motion that stops. In July every section faded and slid in as you scrolled to it. Two days later I took that out. A reveal is nice the first time, but by the fifth section you're waiting for the page instead of reading it. The motion that stayed is small, and each piece explains something. Two arrows light up in turn between "Shipped", "In transit" and "Delivered". The waveforms on the Voice call cards pulse. Roadmap items fade in as you scroll to them, unless your device asked for less motion, in which case they just sit there politely.

The parcel arrows disappeared in one round of changes and came back in the next, because I missed them.
A waveform small enough to read as texture.

Phones get their own rules. On a phone, headings with a description stay left-aligned, while rows of single items center once they stack. The decision trace tabs scroll sideways and fade at the edge, so you can tell there's more. The Voice rollout steps keep their connecting line instead of falling apart into four loose paragraphs.

Centered rows, a fade that says 'swipe', and steps that stay together.

How it's built

The page is Next.js, built from the same component library as the Superseller app, so a button on the landing is the app's button and not a lookalike. My favorite fix is one nobody will ever see. Links to sections scroll to the right place without putting a # in the address bar. I am the #1 hater of IDs in URLs.

Finishing notes

Almost every turning point in this project was taking something out: the rotating headline, the hologram, the cards and the salmon. Adding things was easy. The work was noticing what I'd added out of habit.

Naming did as much for the layout as color did. Once the features were called Superseller Inbox and Superseller Memory, the logo-and-name mark had to exist, and now it shows up everywhere a feature does.

Next up, sellers will be able to set Superseller up by just talking to it for a few minutes, and the roadmap gets to move another row above "Today". Check back in January to see how well this page kept.