Scratch Card

The Scratch Card mode hides each ticket’s instant-win result behind a silver-foil scratch overlay. Customers drag their finger (or mouse) over the panel to reveal a prize tier or “No Win”. Native to the platform — no third-party iframe.

How it’s wired

• Canvas-rendered, ~60fps on a mid-range mobile.
• Reveal threshold: ~50% of the foil scratched before the underlying prize text becomes legible. Faster auto-reveal once they cross 70%.
• Result is server-determined — the canvas only displays what the backend already decided. Impossible to cheat by inspecting JS.

When to use it

• Competitions where the prize spread is granular (£1, £5, £25 tiers) — the reveal feels like a real scratch card.
• Customers who already opted into one bulk ticket purchase — showing 10 cards in sequence creates a real session.
• NOT for headline prize draws — the headline (BMW, holiday) is drawn at end_date not at purchase. Use this for the instant-win layer only.

Enabling it

Two places:

1. Set the competition type to scratch_revealwhen creating it. This makes the scratch overlay the customer’s reveal mechanic.
2. In Settings → Game modes available, ensure Scratch Card reveal is on (tenant-wide toggle).

UX notes

• On mobile, scratching is single-finger drag. Two-finger or pinch gestures pass through to the native scroll — no fights with the browser’s scroll behaviour.
• Skip button (top-right X) reveals all remaining cards instantly. Important for customers with a lot of tickets — never force the full scratch sequence on a 50-ticket buy.

Branded card customisation

Three things you can override per-site in Admin → Brand → Game assets → Scratch Card:

• Foil colour — default is metallic silver. Override with any hex code; the renderer applies a subtle gradient to keep the foil feel. Brand-matched gold or holographic gradients work well.
• Underlying card image— what’s revealed under the foil before the prize text appears. Default is a plain branded card. Override with a 1080×720 PNG (3:2 aspect ratio). Used for premium-competition presentation.
• Reveal threshold — by default we auto-reveal at 70% scratched. Some operators prefer to require ~85% (more tactile, slower). Adjustable per-competition under Page layout → Scratch reveal threshold. Stay between 50% and 90% — outside that range the UX breaks.