La Jugada Tricolor

La Jugada Tricolor was an interactive gamification platform created for a large-scale retail loyalty campaign centered around a major international football event.

The platform combined QR validation, browser-based gameplay, participant registration, prize management, and campaign analytics into a unified mobile-first experience capable of supporting thousands of participants throughout the promotion.

The objective was to transform traditional purchase-based promotions into a digital experience that encouraged engagement, repeat participation, and measurable interaction.

Note: The screenshots shown below have been anonymized for portfolio purposes. User information, campaign metrics, and operational data have been modified or removed.

The Challenge

The platform needed to support a complete promotional lifecycle while remaining simple enough for participants of all ages and technical backgrounds.

Participants needed to:

• Register and validate their identity
• Scan purchase QR codes
• Unlock game opportunities
• Participate directly from their mobile browser
• Receive rewards through an automated workflow

At the same time, the system needed to prevent abuse, duplicate participation attempts, and invalid submissions.

Mobile-First Experience

The entire platform was designed around mobile devices.

Participants could access the experience without installing an application, allowing campaigns to reach a broader audience while reducing friction during onboarding.

The registration flow was intentionally simplified to maximize completion rates while maintaining the information required for campaign operations.

Unified Campaign Navigation

The platform centralized all campaign interactions into a single interface.

Participants could access gameplay, QR validation, campaign instructions, and rewards without leaving the application.

The goal was to create a simple and intuitive experience that could accommodate large volumes of users during promotional periods.

QR Validation Engine

One of the core components of the platform was the QR validation workflow.

Participants could scan eligible purchase receipts directly from their device camera, allowing the system to validate participation eligibility and unlock gameplay opportunities in real time.

The entire process operated directly within the browser, eliminating the need for third-party applications.

Key capabilities included:

• Browser-based QR scanning
• Receipt validation workflows
• Duplicate participation prevention
• Eligibility verification
• Real-time campaign processing

Interactive Gameplay

The campaign included a football-themed browser game developed to increase engagement and participation.

Built using Phaser and integrated into the Nuxt ecosystem, the game delivered a responsive experience optimized for mobile devices while remaining lightweight enough to load quickly across a variety of network conditions.

The gameplay engine was connected to the campaign backend, allowing scores, attempts, rewards, and participation rules to be managed dynamically.

Reward & Participation Management

Behind the scenes, the platform managed the complete lifecycle of participation events.

Features included:

• Participant registration
• QR validation
• Gameplay eligibility
• Attempt tracking
• Reward assignment
• Prize qualification
• Participation auditing

This allowed campaign administrators to maintain operational control while keeping the participant experience simple.

Operational Dashboard

A dedicated administrative platform provided visibility into campaign activity and system performance.

The dashboard exposed key operational metrics while supporting day-to-day campaign management activities.

Administrative capabilities included:

• Participant monitoring
• Campaign analytics
• API consumption tracking
• Validation statistics
• Error monitoring
• Operational reporting

The administrative experience was designed to support campaign teams without exposing sensitive participant information.

Technical Architecture

The platform was built using a modern web architecture designed for scalability and operational flexibility.

Core technologies included:

• Nuxt 4
• Vue 3
• TypeScript
• Laravel
• Redis
• Laravel Horizon
• Phaser
• PostgreSQL
• Tailwind CSS

The backend leveraged asynchronous processing and queue-based workflows to handle validation tasks, reward assignment processes, and campaign operations without affecting participant response times.

Redis and Horizon were used to monitor and process background jobs while maintaining system responsiveness during peak campaign periods.

My Role

As Web Engineering Consultant and Full Stack Developer, I participated in both the technical design and implementation of the platform.

My responsibilities included:

• Frontend architecture
• Backend development
• Campaign workflow design
• QR validation implementation
• Gameplay integration
• API development
• Queue processing architecture
• Administrative dashboard development
• Performance optimization
• Production deployment support

I also contributed to technical decision-making, helping define scalable approaches for participant management, validation workflows, and campaign operations.

Outcome

La Jugada Tricolor successfully transformed a traditional promotional campaign into a digital gamification experience capable of handling participant registration, QR validation, interactive gameplay, reward distribution, and operational monitoring within a single platform.

The project combined real-time user interaction, browser-based gaming, campaign automation, and scalable backend architecture into a unified solution designed to support high participation volumes while maintaining a seamless user experience.

It remains one of the most technically diverse projects I have worked on, bringing together modern frontend development, game integration, asynchronous processing, campaign operations, and large-scale user engagement strategies.