The brief was very clear: we had 2 weeks to implement a gaming platform in 4 languages and design a lightweight access control solution aimed at hotel clients.

Requirements

The goal of the application was to provide a gaming and entertainment platform to hotel guests through their mobile devices that integrated access control with minimal friction and therefore avoiding user ID and password usage.

The platform was required to have the following features:

  • Responsive design, mobile-first approach.
  • Controlled access to content restricted to hotel guests.
  • Multi-language support: Spanish, English, French, and German.
  • Backend administration that allows for service registration and access management.
  • Integration into the platform of a set of interactive games and videos licensed for the client with a volume of more than 3 GB of information.

The main challenge we faced was the limited time to implement the solution: two (hectic) weeks.

Architecture

The solution we designed and ultimately executed within the agreed timeline consists of four modules:

  • Multidevice web application: this is the main component of the platform and is accessible to users through their mobile or laptop devices. We implemented a simple-designed PWA, installable on the desktop and developed in Angular.
  • Games catalog: these games will be integrated into the mobile application and will be provided by an external provider. In addition, there is the possibility of incorporating new games from other providers or even the client's own content.
  • CDN (Content Delivery Network): this component serves the optimized games through distributed servers.
  • WordPress administration backend: allows for user management and hotel registration for those who have contracted the service.

The solution

The first challenge has been to manage the volume of data from the interactive games. To offer them in a fast and efficient way, we selected a CDN that maintained redundancy in Europe to ensure that there were no bottleneck problems with downloads.

In the case of videos, we did something similar, transcoding the originals so that they could be served using DASH (Dynamic Adaptive Streaming over HTTP). With this technique, platform users will receive videos, depending on their device and internet connection, in the optimal format and resolution.

The most complex part was designing the access control system. As access to games was not overly critical, we opted to implement a geofencing system so that we could allow direct access through location to guests within a certain radius of the hotel (configurable from the backend). To make the system more robust, we established a redundant access method through a temporary password so that if a user, for example, did not have location enabled, they would have an alternative access method.

Additionally, and to facilitate access to the platform, we dynamically generated a unique QR code for each participating hotel, which is automatically sent along with the temporary password. We also integrated a QR code reader into the user application to facilitate this task.

Screenshots of Acttiv Games application
PWA ready in 2 weeks!

During the presentation demo, we created cards with integrated NFC tags as an additional example of accessing the service and to facilitate its use by simply bringing the device close to the card. This would allow hotels to integrate the service into kiosks, reception desks, or other strategic locations within the hotel.

Regarding the backend, the hotel registration process was simplified so that only the hotel name and email were required. Through the hotel name, we transparently positioned the hotel on Google Maps, with the possibility for the administrator to relocate it on the map. Configurable parameters include the validity period of temporary passwords and the range of the geofencing feature.

The backend takes care of sending access credentials, QR codes, and temporary passwords by email, and automatically regenerating them periodically, minimizing administrative tasks for the client.

Finally, so that the client could validate the platform in 4 languages, we leveraged ChatGPT and delegated to AI to translate all text strings almost instantly. Another advantage of modern life 😉