Marca / Live desk
The match is never just the match.
A deliberately busy sports newsroom for testing journeys, impressions, replay and every tiny interaction in between.
09 / 24 — Madrid
Transfer window, unfiltered.
España en semifinales
Una victoria épica lleva a España a semifinales de la Eurocopa.
Hamilton gana en lluvia
El piloto británico logra una histórica victoria bajo lluvia intensa.
Fichajes NBA en movimiento
Los equipos comienzan a reforzarse con grandes nombres para 2025.
Moving pictures
The story reel
Hover to pause. Follow the loop. Every frame is a testable surface.
Test catalogue
Products
Every product card is fictional and exists only to exercise clicks, cart state and repeated DOM patterns.
Marca Football Annual $29.99
La Liga Special $24.99
F1 Racing Guide $19.99
NBA Collector Edition $34.99
Champions League Poster $14.99
Marca Fan Cap $12.99
Matchday Notebook $9.99
Tactics Field Guide $17.99
Race Weekend Pass $39.99
Courtside Print $21.99
Final Whistle Poster $16.99
Supporters Cap $13.99
Ingestion scenario / 04
Long-form reading room
This panel is intentionally verbose. Scroll through it to test viewport impressions, nested scrolling, content selectors and drag-and-drop state changes. Every attribute is descriptive and fictional: this demo does not represent a real newsroom.
data-impression="lorem-section-intro"data-content-role="test-instructions"data-scroll-signal="long-form"The main column provides long-form copy so you can scroll the page and confirm viewport-based impressions fire only when blocks enter and leave the visible area. Each paragraph is plain English for easier reading during manual QA.
Pair this layout with your experiment rules: target the intro line, individual paragraphs, or the sidebar as separate impression targets. Heatmaps and session replay should show distinct engagement on the two-column grid versus the sticky aside.
After impressions look correct, test drag-and-drop below. Moving a task from the list into the dropzone should emit interaction events with stable element identities. Keyboard users can focus tasks and move them with standard drag semantics where supported.
Interaction scenario / 05
Drag & Drop Tasks
Move cards into the dropzone to generate a visible state change.
Tasks / 06 items
Drag itemsDropzone
→Drop tasks here to create a recorded state change.
Waiting for an interaction
Live DOM lab
Dynamic Element Test
Add fresh nodes after page load and use them to test mutation-aware ingestion and delegated click tracking.
Encapsulated UI
Shadow DOM Host
to change its state
Match center
Pick a side. Test a state.
Keep scrolling
Something rareis waiting.
A viewport-triggered offer appears here exactly once. Perfect for testing scroll depth and modal ingestion.
Ingestion scenario / 06
Attributes with a purpose
Click inside this panel to test impression capture. The labels below document exactly what each data-* attribute represents.
data-impressionNames the viewport impression target.
data-campaignGroups this surface under campaign-1.
data-test-surfaceDescribes the combined interaction scenario.
Selector challenge / 07
Catch the whole sports map
These routes intentionally share a predictable pattern so regex-based targeting can be tested against real links.
data-link-group="sports-routes" · data-route-family="sports" · each link has a unique data-route-key







