← Back to review dashboard

Aesop — QA Report

# Aesop Recreation QA Report

**Captured:** 2026-10-24 20:51 EDT reference research; public QA evidence reviewed 2026-10-24 21:00 EDT  
**Reference homepage:** https://www.aesop.ca/  
**Reference secondary page:** https://www.aesop.ca/en/shop-all/  
**Scope:** Public, unaffiliated noindex recreation for visual/technical study and client review.

## Completion status

- **Research and page selection:** complete. The Canadian homepage and Shop All / All Formulations catalogue were selected from official public references.
- **Reference screenshots:** complete at 1440×900 and 390×844 for both selected pages.
- **Independent implementation:** complete under `aesop/`, with locally authored HTML/CSS/JS and CSS-only substitute artwork.
- **Local fixed and full-page screenshots:** complete for homepage and secondary page at both requested comparison viewports.
- **Responsive layout checks:** complete at 390, 768, 1024 and 1440 widths for both pages.
- **Interaction checks:** complete for local navigation, mobile menu, search drawer, hero slide controls, category filtering, filter panel, sort panel and cabinet/demo notices.
- **External side effects:** none. No account, authentication, email submission, checkout, payment or external runtime request is wired.
- **Visual sign-off:** technical evidence is complete; visual approval remains a human review decision.

## Reference evidence

- `reference-screenshots/homepage-desktop-1440x900.png`
- `reference-screenshots/homepage-mobile-390x844.png`
- `reference-screenshots/shop-all-desktop-1440x900.png`
- `reference-screenshots/shop-all-mobile-390x844.png`

The live cookie dialog was dismissed using the non-essential-cookie rejection action before capture. The saved images are the time-bound reference for this run.

## Local screenshot evidence

### Fixed comparison captures

- `local-screenshots/home-desktop-1440x900.png`
- `local-screenshots/home-mobile-390x844.png`
- `local-screenshots/secondary-desktop-1440x900.png`
- `local-screenshots/secondary-mobile-390x844.png`

### Full-page captures

- `local-screenshots/home-full-desktop.png` — 1440×3886
- `local-screenshots/home-full-mobile.png` — 390×5319
- `local-screenshots/secondary-full-desktop.png` — 1440×1897
- `local-screenshots/secondary-full-mobile.png` — 390×2259

### Comparison evidence

- `qa/comparison-overview.png`
- `qa/homepage-desktop-side-by-side.png`
- `qa/homepage-mobile-side-by-side.png`
- `qa/secondary-desktop-side-by-side.png`
- `qa/secondary-mobile-side-by-side.png`
- `qa/homepage-desktop-difference.png`
- `qa/homepage-mobile-difference.png`
- `qa/secondary-desktop-difference.png`
- `qa/secondary-mobile-difference.png`

The difference images are diagnostic only: the recreation intentionally uses independent CSS artwork instead of the reference's raster/video imagery.

## CDP layout results

Measured with `tools_cdp_capture.py` using headless Chrome CDP device metrics (`deviceScaleFactor: 1`). `local-layout-qa.json` is the machine-readable record.

| Page | Width | `scrollWidth` | `innerWidth` | Overflow | Key geometry |
|---|---:|---:|---:|---:|---|
| Homepage | 390 | 390 | 390 | 0 px | Header 51 px; hero 643 px |
| Shop All | 390 | 390 | 390 | 0 px | Header 52 px; toolbar 52 px |
| Homepage | 768 | 768 | 768 | 0 px | Desktop header 137 px; hero 550 px |
| Shop All | 768 | 768 | 768 | 0 px | Toolbar 720 px wide; grid 720 px wide |
| Homepage | 1024 | 1024 | 1024 | 0 px | Desktop header 137 px; hero 550 px |
| Shop All | 1024 | 1024 | 1024 | 0 px | Toolbar 976 px wide; grid 976 px wide |
| Homepage | 1440 | 1440 | 1440 | 0 px | Header 137 px; hero 584 px |
| Shop All | 1440 | 1440 | 1440 | 0 px | Toolbar/grid 1170 px wide |

All requested widths reported zero document overflow and no overflowing elements in the final CDP run. Both pages reported `noindex,nofollow,noarchive`, and `externalResources: []`.

## Interaction results

Verified by the CDP runner:

- Homepage and Shop All local links resolve to the local pages/anchors.
- Mobile menu opens and closes at 390 px without overflow.
- Hero next/previous controls swap the local feature copy and indicator state.
- Hero play/mute controls remain local and show a demo notice.
- Search drawer opens, focuses a local-only input and states that no query is submitted.
- Shop category chip filtering selects `Fragrance` and leaves one matching local formulation visible.
- Filter panel opens and applies the `New` status view locally.
- Sort panel applies `Price` locally.
- Product cabinet buttons show a notice that no cart or checkout is connected.
- Account, contact, currency, store, bookmark and email-sign-up affordances stop at the local demo notice.
- No live checkout, payment, auth, account, email or analytics flow is present.

The runner recorded **38/38 automated assertions passing**.

## Visual and technical findings

- The recreation preserves the reference's primary rhythm: dark notice strip, pale shell, centered serif wordmark, editorial navigation, botanical hero, outlined action, category chips, catalogue toolbar and restrained multi-column product grid.
- The homepage hero and editorial sections are independent CSS compositions. They do not reproduce proprietary reference video or imagery.
- The Shop All page uses CSS-authored amber bottles, paper box, candle, abstract category swatches and local icons instead of product packshots or copied assets.
- The study disclaimer is visible in the rendered top ribbon, and the wordmark is ordinary text rather than a logo file.
- The system font stack is intentionally public/system-only, so exact proprietary font metrics will differ from the reference.
- The mobile category rail intentionally scrolls horizontally inside its own clipped control; the document itself remains at viewport width.

### Quantitative comparison diagnostics

| Capture | Mean absolute RGB delta | Pixels with max-channel delta > 10 |
|---|---:|---:|
| Homepage desktop | 63.09 | 77.24% |
| Homepage mobile | 58.73 | 80.92% |
| Shop All desktop | 24.27 | 18.04% |
| Shop All mobile | 38.58 | 28.71% |

These values reflect deliberate asset substitution and live-page variation; they are not a claim of pixel identity.

## Files created or modified

- `index.html`
- `shop-all.html`
- `styles.css`
- `app.js`
- `README.md`
- `REFERENCE.md`
- `ASSET_PROVENANCE.md`
- `QA_REPORT.md`
- `tools_cdp_capture.py`
- `cdp-run-output.json`
- `reference-screenshots/*.png`
- `local-screenshots/*.png`
- `qa/*.png`
- `local-layout-qa.json`

`PROGRESS.md` and review gateway files were not modified.