Designing the campaign system for Hot Sale 2026
Eight landing pages published at 1,728 px, four pet segments by two offer periods, and the outcome: Petco Mexico's highest-converting landing page of 2026.
- Role
- UX/UI design · end to end
- Period
- May 2026 · published and closed
- Volume
- 8 landing pages at 1,728 px
- Tool
- Figma
published landing pages
pet segments
independent offer periods
times the rhythm repeats per page
Empathize
Shoppers don't learn: they locate
Petco Mexico's highest-converting landing page of 2026
Hot Sale is not a regular purchase with a discount, but a different way of shopping. Shoppers arrive:
Short on time, so they don't browse: they act.
Comparing against other stores in open tabs.
Afraid of missing the deal.
“In a limited-time campaign, shoppers don't learn, they locate. They want to confirm in under 3 seconds that the offer applies to their pet and find the shortest path to the product.”
That's why this piece doesn't argue, it signposts. It is the opposite of an editorial landing page.
Define
Confirming right away that the offer is for their pet
A pet parent who arrives at Hot Sale with their purchase intent already formed needs to confirm right away that the promotion applies to their pet, because they are comparing against other retailers and will leave if they have to search.
How might we help every pet parent recognize their offer on the first screen?
How might we cut the path from landing page to cart to the minimum?
How might we give unconventional pets their own entry point without running a separate campaign?
Ideate
Four landing pages instead of one
| Direction | Decision |
|---|---|
| Single landing page with filters | Dropped: it forces users to filter before seeing the offer. |
| Single landing page with anchors | Dropped: a giant page and a diluted differentiator. |
| 4 landing pages + persistent switcher | Chosen: users arrive already filtered from the media channel. |
The chosen option meant four times the production work. It was solved with:
A single banner template, with an image slot and a bar for title, legal copy and CTA, in 2 themes and 2 heights.
A dedicated component library.
Two independent offer-period blocks, instead of editing the campaign live.
The system
A three-beat rhythm, repeated three times
The whole page is a three-beat rhythm that repeats three times, with no argument between blocks:
Differentiator
Banner with the %
Path to product
Brands or carousel
Objection remover
Interest-free installments, payment methods, 24 h support, returns
It repeats three times per page, with no argument between blocks.
The key pieces are:
A hero with “up to 40% + 5% extra for every $1,000”.
A persistent pet switcher (Food, Dog, Cat and Small pets).
Featured brands.
An interest-free installments band.
A returns guarantee.
A Petco Zoo landing page with sub-navigation for 4 species.
An SEO block at the bottom.
Accessibility
Post-campaign WCAG 2.2 AA review
This is a post-campaign review against WCAG 2.2 level AA. The campaign has closed, so it serves as input for the next one.
What the system already did well:
| Criterion | How |
|---|---|
| 1.4.5 Images of text | The banner separates the image from the title, legal and CTA bar, so the offer and conditions can be live text. |
| 3.2.3 / 3.2.4 Consistent navigation and identification | The switcher sits in the same place on all 4 landing pages and the CTA always reads “See promotion”. That helps users with cognitive disabilities and screen reader users. |
| 1.3.1 Info and relationships | The repeated rhythm gives a predictable structure that can be navigated by headings. |
| 1.4.3 Contrast over images | The background saturation tests (Saturated, Light and Ultralight) aimed for the product to read clearly without losing the red. It's the same criterion WCAG asks of text over images. |
Adjustments for Buen Fin and Hot Sale 2027:
| Criterion | Finding | Fix |
|---|---|---|
| 1.4.3 Contrast | White text on the campaign red tends to land near or below 4.5:1. For example, #ED1C24 gives ≈ 4.4:1. | Validate the exact red. Use it behind large headlines and put legal copy and small text on navy or white. |
| 2.4.4 Link purpose | A single CTA, “See promotion”, repeated on every banner. | Keep the visible text and add an aria-label with context, for example “See 25% off cat beds”. |
| 4.1.2 / 1.3.1 Switcher | It is the navigation between the 4 landing pages. | Mark it up as a nav with aria-current="page" on the active landing page, without relying on color alone. |
| 1.1.1 Non-text content | There are featured brand logos, the Hot Sale seal and payment method logos. | Alt text with the brand or payment method name. |
| 2.5.7 / 2.1.1 Carousels | The featured product bands are swipe-based. | Add arrows or allow focus per card. |
| 1.4.4 Resize text | Banner legal copy tends to be very small. | A 12 px minimum, tested at 200%. |
| 2.4.1 Bypass blocks | These are long pages (Cat is 11,340 px) with an SEO block at the end. | Add a “Skip to content” link and per-block headings for quick navigation. |
| 24 h support | The phone number is an objection remover. | Make it a tappable tel: link on mobile, with a touch area of at least 24 px. |
Results
The highest-converting landing page of the year
It was the highest-converting landing page of the year. The challenge now is knowing which decision produced it.
The 4 simultaneous landing pages form a quasi-experiment: the same traffic and the same period, with different structures.
| Analysis | What it answers |
|---|---|
| Length vs. conversion (Cat, 11,340 px, against Petco Zoo, 7,122 px) | Is there a cutoff point for length? |
| Switcher usage | If usage is low, the media segmentation was right. If it's high, users are manually correcting where they landed. |
| CTR by banner position | If the third banner performs close to the first, the repetition is justified. If it drops, about 3,000 px can be recovered. |
| Petco Zoo | Does the entry point for unconventional pets come back? |
Condition for measuring: the landing page identifier must be on every event from day one.
Playbook
Playbook for 2027
What gets systematized for 2027:
Pet segmentation from the moment of landing, with a persistent switcher.
A repeated three-beat rhythm: differentiator, path to product and objection remover.
A single CTA, “See promotion”, with a contextual aria-label.
Objection removers in this order: interest-free installments, payment methods, 24 h support.
A returns guarantee before the close.
An SEO block at the bottom.
A dedicated entry point for unconventional pets.
Independent blocks per offer period.
A single banner template with live-text legal copy and contrast validated against the campaign red.
Thanks for watching!
See another project?