Event scanner app: ticket control made easy
In an increasingly digitalized world, event organizers are constantly looking for ways to increase the efficiency of event processing. Our task was to develop an extension for Kaufleuten’s already integrated payment solution. The result? An innovative web app that allows tickets to be scanned directly at the box office and is seamlessly connected to the client’s in-house event management tool.
Initial situation
Covid and the requirements for event organizers in Switzerland
After successfully developing the payment integration for the client’s website, we had the opportunity to expand this solution further. Our goal was to optimize admission management and make the ticketing process as smooth as possible.
In times of Covid-19, the demands on event organizers in Switzerland increased enormously. It was not only important to offer guests a safe environment, but also to meet the constantly changing regulations and requirements of the authorities. A key aspect of this was the precise control of visitor numbers. Event organizers had to know exactly how many guests were in the club hall at any given time in order to be able to provide information immediately in the event of a police investigation.
We have addressed this need directly in our scanner app. Each time a ticket is scanned, the app automatically updates the number of guests present. This not only provides merchants with the security of complying with official requirements, but also the confidence of having a real-time overview of the number of guests and thus being able to react immediately if necessary. This was a crucial feature that underlined the importance of our bespoke solution in these challenging times.
The Kaufleuten Zürich
For over 100 years, the Kaufleuten in the heart of Zurich’s city center has enriched nightlife and cultural life. As a renowned club, it is known for its varied program with national and international DJs and as a venue for concerts, readings and cultural events.
The Kaufleuten’s stylish restaurant offers European dishes made from organic ingredients and creates a cozy atmosphere – perfect for romantic evenings or business lunches.
As a popular location for events and banquets, the Kaufleuten offers various rooms for different occasions. It acts as a meeting place for people from all walks of life, where relaxation, entertainment and inspiration come together.
The Scanner-Web-App
By combining various front-end libraries, we developed a web app that is able to scan tickets in real time and compare the data directly with the organizer’s event management tool. This enables guests to enter the venue quickly and smoothly and significantly reduces waiting times at the box office.
Practical test in the club
The importance of observation
To ensure the effectiveness and practicality of our web app, we carried out an on-site test at Kaufleuten. We observed under which circumstances, be it the lighting conditions or the speed of the staff at the checkout, the scanner could potentially have problems. This direct observation enabled us to obtain user feedback in real time and identify weak points immediately.
Technical optimization with Sentry
While the hands-on observation provided valuable insights into the user context, we used Sentry for technical testing. This tool helped us to identify potential errors during scanning. Thanks to this error logging, we were able to quickly identify and fix technical issues, which led to a higher reliability of our application.
Efficient event management
Our developed scanner app enables smooth scanning on mobile devices and tablets. After each scan, relevant information is immediately displayed, including the surname, first name and address of the ticket buyer. The app always keeps track of attendees and displays room capacity in real time.
Universal accessibility
Our web app is easy to use for anyone with a modern device or browser, allowing flexibility for staff changes without the need for specialized hardware training.
Fast updates
Thanks to the web app structure, we can carry out updates quickly without having to rely on app store restrictions. This allows us to react flexibly to new requirements and constantly improve our service.
Statistics
The comprehensive statistics function of our scanner app allows one to access the recorded data at any time. These statistics can be easily exported to save them for later use or for further analysis. Our app makes contact tracing more efficient and user-friendly.
Challenges and solutions
We faced up to the technical challenges. On iOS devices, it was not technically possible to use the device light and the camera at the same time. However, by installing additional lighting at the box office, we were able to successfully overcome this hurdle.
Barcodes are considered to be more error-prone compared to QR codes, but with our implemented STRICH library we have made significant progress. Our web app recognizes barcodes quickly and reliably, even remotely.
Continuous use of the camera can drain the battery, so we always recommend a charging cable provided at the box office to ensure smooth operation.
With these technical solutions, we offer event management a reliable and flexible solution. Our scanner app not only enables efficient ticket scanning, but also effective contact tracing in a user-friendly way.
Web app development
Our implementation of the scanner system is based on a web app that uses the React Framework NextJS. The styling and components are provided by Chakra UI and we use the NextAuth login template for authentication.
We initially relied on the ZXING-Library, to scan the barcodes, but later switched to STRICH. Sentry also takes care of monitoring and error reporting.
Project team
Projects are always teamwork and often all of us are involved in some way. The following people in particular were involved here.
Karin
Christen
Project management
Dominik
Schilling
Development
Simon
Halimonov
Development
React.js Development
React.js offers fast rendering, modular code, reusability of components, efficient performance, easy scalability and great community support.
Single-Page-Applications
Single page applications are fast, user-friendly and interactive. They enable a seamless user experience with optimized loading times and an appealing design.
Progressive-Web-Apps
Progressive web apps offer cross-platform compatibility, fast loading times, offline functionality, low memory requirements, automatic updates and convenient installation.
Next.js
Next.js enables the creation of full-stack web applications by extending the latest React features and integrating powerful JavaScript tools based on Rust for the fastest builds.
Chakra UI
Chakra UI is a React library for the rapid design of user interfaces. With ready-made UI components, it enables the efficient development of aesthetic and responsive web applications.
NextAuth
NextAuth is an authentication framework for Next.js applications. It simplifies OAuth, JWT and other authentication methods, provides user-friendly APIs and facilitates the implementation of secure authentication.
ZXing
ZXing is an open source library for reading barcodes in Java, C++, Python and other languages. It offers functions for barcode recognition in various formats.
STRICH
STRICH is an intuitive barcode scanner app designed for precise and fast scanning. Perfect for retail applications, it offers efficiency and accuracy.
Sentry
Sentry is a platform for monitoring and fixing software errors in real time. With detailed error reports, it enables developers to quickly identify problems and improve code quality.
Conclusion
The development of the scanner web app was a challenging but rewarding project. By working closely with the client and combining hands-on on-site observation with technical monitoring tools, we were able to create a customized solution that met the event organizer’s requirements while improving the customer experience.
Other projects we have implemented for Kaufleuten
Sale of event tickets directly via the website
Kaufleuten commissioned us to redesign their website and integrate an online payment system as part of their “mobile-first” approach. This enables their customers to purchase tickets for the club, concert and cultural events from anywhere and at any time.
Next case study
Zürich Mobil
Every year, many people move to or within the city of Zurich. For this reason, we have created the welcome website zhmobil.ch in collaboration with VBZ, which helps all new arrivals to familiarize themselves quickly and easily with their new residential area.
Other Projects
A couple more of our client projects.
-
Orientation for new residents of the city of Zurich
Together with Zürcher Verkehrsbetriebe, we designed and implemented a website for new residents. The homepage contains a user-friendly tool to quickly and easily find the…
