At the annual Quack Hack, the Lucky Ducks team developed a games portal that was connected to a physical installation. The portal allows all staff members, including remote teams, to compete against each other. On top of the online aspect, the game includes physical components and makes use of connected devices and video. The idea behind the project was to build a prototype that merged gamification and Internet of Things (IoT) to help team building with remote workers.
Cyber-Duck is a champion of innovation, and R&D is at the core of what we do. Each year, the team gathers in Elstree headquarters for the Quack Hack, our internal hackathon. This is a great opportunity for the team to explore new trends, techniques and technologies, during a 26h creative marathon full tense moments and full of fun!
My Lucky Ducks team was a diverse group that brought together knowledge from different fields: from QA to development, design, project management and HR. Together we aimed to create a tool that allows companies to shorten the distance between teams and offices. Our mission for this non-stop Quack Hack? To create a game portal for all Cyber-Duck employees, including our very dedicated remote team.
The challenge: remote working
According to the data provided by the UK Office of National Statistics, the number of workers who work at least one day a week from their home location has been steadily increasing. Over a decade it has incremented by nearly a quarter of a million and it is expected to continue its upward trajectory over the next years.
A few years ago, Cyber-Duck operated in just one location: Elstree, Hertfordshire. Remote working wasn't very common and just a few of our ducks used to work from home from time to time. Then we opened a new office located in Farringdon, London. Then one of our esteemed employees moved to the other side of the ocean. Then it was Leeds. And then more... and more! Suddenly, in less than a couple of years, there were ducks scattered through all kinds of ponds and time zones.
With new locations, new challenges emerged. Remote working became part of our daily lives and every day we need to find innovative solutions to keep all employees engaged and connected.
In UK, between 2012 and 2016, flexi-time has risen by 12.35%. UK workers who have moved into remote-working has increased by nearly a quarter of a million over a decade.
Office of National Statistics (ONS)
Advantages and Disadvantages
It’s easy to understand why working remotely might seem interesting and appealing. The opportunity to work from home in our cosy and safe environment with a flexible schedule? Being owners of our time and rhythm? No traffic, no crowds and no queues? Zero expenses? It seems like the perfect scenario!
However, remote working isn’t always as easy or as nice as we might think. Everyday remote workers fight against boredom, isolation, lack of human interaction and hard-to-maintain relationships with co-workers. In addition to insufficient and/or inadequate tools and resources, the different time zones and a feeling of invisibility it’s the perfect recipe for an unhappy and disengaged employee.
This is where we want to act. The Lucky Ducks project is all about building the bridge between the “us” and “them”, the “near” and the “far”. Using technology, we want to go a step ahead and find a fun and easy way to reach remote workers and welcome them as part of the team, regardless of their location.
The word 'remote' staff was once referred to colleagues who worked in distant locations and had little or no connection to their physical offices. But thanks to modern technology and various exciting collaborating tools, 'remote' working has been reborn – there's now no reason why remote staff can't be a central part of any team.
The IoT and Gamification trend
Everywhere you look, the Internet of Things (IoT) is taking over. IoT is not a brand-new concept; it’s now in a mature phase. Currently, we can see a trend of IoT being used for games and entertainment: from Sifteo cubes a few years ago, the Zombies, Run! App, up to Edwin the Duck from Pi Lab.
Here's an example from Zombies, Run!
Cyber-Duck has a solid experience with IoT. We have developed multiple connected objects in the past, such as our connected cuckoo clock or our interactive logo installation in Farringdon. With that experience, we realised merging gamification and IoT would be a fantastic opportunity to address some of the problems identified previously with remote working.
From there came our idea of building a platform that staff members – including remote workers – could compete against each other, and also interact with a physical installation in our headquarters.
User-Centred Design
We apply user-centred design to all of our projects. As usual, we wanted to get a better understanding of the challenges and issues faced by remote workers. After searching online for reliable data, we felt we needed to talk to the users directly. We designed an online survey and started to share it to all our colleagues working remotely, as well as remote workers from our network.
We received form submissions during the whole weekend and gained more knowledge from potential future users. We used this data and took the feedback onboard to justify or change our design decisions. As an example, we initially thought remote workers, when competing against their colleagues, would like to represent their countries, in a friendly Olympics style competition. The survey revealed country was the least preferred choice, and user would prefer fighting for their team/department.
After this initial research phase, we began to map different concepts on our whiteboard and agreed on the following principles:
- We're creating a games portal for staff members to play. Players are rewarded with points.
- After playing games, they can redeem their points in a physical/connected game. Playing the physical game gives you a score.
- A leaderboard shows the score of players, teams and offices, making the whole experience fun and competitive.
Next, we needed to define the technology stack and the overall solution architecture.
The games portal
The Laravel framework has a robust and scalable architecture that makes it great for rapidly building any digital web portal, it came as a natural choice for our game portal. We used Node.js for our API, to allow handling of real-time events. All data will be stored and retrieved by the API using MariaDB.
To validate our concept, we needed at least one playable game. While looking into simple html5 games, we discovered MelonJS. MelonJS is a Node.js based framework which provides a collection of composable entities, allowing developers to focus on the content of the games. We found an open source version of FlappyBird, and decised to use it as a base for our first game. We created custom assets with our brand colours, our logo as the “bird”, Elstree hill and our headquarter office in the background. Meet FlappyDuck:
One of the challenges faced by the team was to get the score from the Node.js game into the portal. We managed to use hooks so that your score in the game would push credits into the portal via the API. Later on, more games could be added using the same principle, we only needed one to validate our proof of concept.
The physical installation
For the physical game, we were looking at a duck-based boardgame with electronic components that we could hack and connect.
The original game is a memory game for kids, and we wanted to adapt the logic for an IoT proof of concept. By activating the game from the portal, we could make it run for a specific amount of time. During this time and with the help of a sensor, we could count the number of randomly placed ducks passing by and generating a score, sent back to the portal.
Microcontrollers and IoT cloud solution
For the hack, we wanted to review and test one of the new Arduino microcontrollers: the Arduino MKR WIFI 1010. This is the newest version of the MKR 1000 WIFI, but with a low power consumption ESP32 module on board. Arduino is a very easy platform for controlling electronics and reading sensor, but the web connectivity is more difficult to handle. Because of this, we very excited to try the brand new Arduino IoT Cloud platform. The platform provides an online development environment, access to the device from the platform and the concept of “Things”: visual interfaces to your sensors, so you can interact with them from the platform.
To control the physical part from our portal, our goal was to build a REST API: a cloud function that we could call to trigger Lucky Ducks, the physical game, and that function would return the number of ducks. Unfortunately, the Arduino IoT Cloud is still in Beta version. At this stage doesn’t provide a REST interface yet but web hooks only. This would have required us to use services such as IFTTT or Zapier, and was not suitable for fast real time bi-directional communication.
Because of this we decided to use a Particle Photon micro-controller and the associated Particle Device Cloud platform.
The first thing we wanted to do with our microcontroller was to be able to trigger the game. We started by removing all screws and opening the game, looking for a switch we could control from the microcontroller. As the switch was hidden under the plastic structure, we finally decided to bypass the battery and power the game directly from the microcontroller.
This worked fine when initially connecting the wires. However, we realised later after adding other components and once wires were soldered, we couldn’t supply the game with enough power. We decided to use an external source of power (our Arduino, available for the hack) and introduced a relay in the circuit to be used as a switch.
Infrared sensor
For our “duck counting” feature, we used an infrared sensor. Technically, this is based on two simple components: an transmitter LED and a receiver LED. The transmitter sends the signal. If an object blocks the signal, the receiver activates the module.
In our case, things got a bit more complicated. It wasn’t the case of a simple On/Off detection: how often to trigger the emitter? How do we get one count only for each duck? What if a duck is already in front of the sensor when we activate the game? Finally, we also had to calibrate the emitter for the distance, aiming at approximately 5cm range to avoid detecting ducks on the opposite side of the game!
Raspberry Pi & Video
Once the physical part was operational, we still needed to provide users of the portal with visual feedback of what is happening in the real world. To keep the fun and quirky side of the game, we wanted to integrate video in the portal when the physical game is activated, We used a Raspberry Pi 3 and the Pi Cam Webcam.
Once the default OS install and the webcam activated, we used the open source video solution Ffmpeg: our Raspberry Pi was now streaming in real time on YouTube in an unlisted channel. We could then show and hide the embedded YouTube video in the portal when the physical installation is triggered remotely.
Final architecture and tech stack
The diagram below sums up the overall architecture and the tech stack:
The future
What about gamification? Gamification is the process of using game mechanics and game thinking in non-gaming contexts to engage users and to solve problems. Game mechanisms such as awards, levels and missions have a powerful effect on people. Along with technology, it can be a propeller to overcome obstacles and transform boring day-to-day tasks.
“Gamification is the process of using game mechanics and game thinking in non-gaming contexts to engage users and to solve problems.”
There are multiple game mechanics that we can explore in a workplace environment: points/credits, games activation and a leaderboard. Now that our proof of concept is working, we are planning to integrate it with other internal systems and tools we are using in the company. Submitting a timesheet on time could, for example, unlock a new game. Any other operational task could give you credits on the platform. Team members won't just have fun and compete against each other – including remote teams – but the company will also benefit from the gamification of simple operational tasks.
More than just a proof of concept, this project is a framework for the future. We can add more games and apply gamification: connecting to other systems in the company to reward staff members with credits and access to games, and helping remote workers feel more part of the team despite the distance.
Overall, we had a fantastic time at the hackathon – stretching our technical capabilities to build an engaging project that used Internet of Things and gamification concepts. This is not only an internal tool. With a few changes, we can white label the product and adapt it to any existing branding. Do you have remote teams as part of your work force? Are you interested in complex IoT projects and connected products? Please get in touch if you’re facing similar technical or engagement issues!
Check out the other projects from this year’s Quack Hack: