They say any sequel to a successful story is the toughest act to follow, so stay tuned for how PopCorn66 re-ran with retro TV to land repeat glory online
Popcorn 66 reveal how they followed their original retro TV project with a successful sequel
Make no bones about it, this age of the on-demand boxset has marked an incredible resurgence for television online. The hunger for high production, episodic and yes, blockbusting shows rivals the cinema box-office given the flexibility of consumption for viewers. Of course the beauty of this is the catchup element too, where a growing archive of old TV classics can be found and enjoyed in entirety by those who missed them first time around. To appreciate best our featured web masterpiece this month, this kind of ‘homework’ would indeed be recommended. This is because Popcorn TV, an in-house project for digital studio Popcorn 66, is a veritable dream for telly addicts. Based in Paris, France the agency specialises in creating rich digital experiences routed in pop culture references with Popcorn TV building on a previous outing to pack your browser full of them – literally. With nods to the ‘hidden object’ games popular on mobile devices, the website follows on from the moviethemed Popcorn Garage from 2015 to deliver an engaging digital quiz bursting with clues to iconic small-screen smashes. “Popcorn TV is the result of another project that we created two years ago, named Popcorn Garage (www. popcorngarage.com),” begins Romain Zitouni, Partner and Art Director at Popcorn 66. “This project was already challenging the internet on cinema culture with 66 hidden references in a garage. Since its release, it has been a huge success with more than 1.4 million players worldwide. Without the success of Popcorn Garage, Popcorn TV would not exist.” A scary thought indeed, so after spotting this impressive follow-up for ourselves in issue 273’s Lightbox we leapt from our sofas to hear from its makers on how the production came to light.
“After Popcorn Garage, we received a lot of messages from players around the world asking us to do a sequel,” reveals Popcorn 66 partner and Creative Developer Priska, when asked how the story started. “So we took the time to think carefully before embarking on a second version.” Clearly aware of doing justice to the impact Popcorn Garage had made on web audiences, makers Popcorn 66 didn’t want to simply rush any follow-up. The new project would of course also be an in-house promotional effort, not commanding any kind of direct commercial incentive or support so scheduling was an issue too. “Popcorn Garage and TV are proactive projects without any funding so it was therefore necessary to get organised enough to unlock the time to work on it.” But the passion certainly remained, with Priska confirming the studio’s constant fascination and inspiration around pop culture. But this time would be a chance to “explore another universe” within this, demanding a new theme, new décor and therefore a brand-new name too. “We also wanted to surprise and challenge each other too,” agrees Romain. “The word that characterizes us is ‘Popcorn’ and not Garage. So for this second version, we didn’t want to remake a new Garage and lock ourselves into the cinema theme.” Plus the guys would have complete free reign to make those judgement calls. Apart from their own creative pressure and pride, there would be no customer or client to impress. Once a suitably fresh theme was settled on, the stage would be set and green-lit to go.
“For the original idea, we must go back to the birth of Popcorn Garage,” Romain concedes when recalling how the new idea came about. “That project started from a very simple principle – the summarising of a cult film in one object. From there, we formulated a set with several references to films that had left their mark on us. The idea of turning these into an interactive game that defies all film fans then seemed a pretty natural extension. It was then necessary to find effective game mechanics for making the experience simple and addictive.” This was where the team pointed towards those hidden object discovery games, a kind of Where’s
Wally for spotting the visual hints and metaphors relating to each film. So if the mechanic was already in place and proven to be popular, it would now be about arriving at a pop culture theme not a million miles away. “Our first goal was to find the right theme,” Priska confirms. “So we asked our close friends and some players, about 5,000 people in total, through a small survey to acknowledge their desires. The majority answered in favour of the TV series,” something Popcorn 66 themselves approved of too. “Yeah the TV series was a perfect transition from the cinema theme,” adds Romain. “The universe of the TV series is extremely rich, from the 50s to nowadays. Now the TV series has become more and more creative, to the point of rivalling the cinema. Some even create a real addiction to the point of commanding their own social networks, such as Game of Thrones or The
Walking Dead etc. For us, it was an incredible playground to explore.” With theme choice made, the focus shifted to devising a more sophisticated gaming experience while retaining Popcorn garage’s simplicity. Here the guys took advice from friends Mickael Dauphinot and Alban De Fortaleza, founders of the agency Le Singe and specialists in Agile methodology – helping to organise ideas and define priorities. “Here we thought about several improvements to satisfy all players,” explains Romain. “Creating a new 4K visual that could integrate a zoom function, an increase in playing
time by offering mini-quizzes, a more immersive approach to sound design and the proposition of a world ranking to challenge friends with.”
A UNITED Front
The visual design work would of course centre on the creation of a playing field that contained 66 TV show references. Popcorn Garage quite simply was styled as a lockup garage/auto shop, providing a sense of place that matched the theme. Romain reveals, “Popcorn TV had to have its own place that corresponds to the universe it inhabits so naturally we thought of the television metaphor. Where before the gaming experience led us to open up a Garage, for version two we turn on and off a TV.” This concept would throw up front-end challenges such as recreating analog TV effects, a hurdle that would dictate technological choices as Priska confirms: “The only technology that can achieve this kind of effect is the WEBGL; I opted for the very famous library Three.js.” “Then the biggest creative challenge was to create the game scenery in 4K to integrate a zoom function,” Romain interjects. “The idea was to pace the hallmarks of classic sitcom décor, chiefly living room, sofa and fridge etc, into a dirty atmosphere that remains our graphic signature. Once the mood was established, it was necessary to choose 66 TV series references both recognisable and relevant to the location. The gaming experience is based on how all the references are arranged in the image, requiring a balance between the immediately identifiable objects and those more complicated to find – all while keeping a visual coherence that maintains overall elegance.” Similarly, although 3D technology is used within the display Popcorn TV’S front-end
visuals (the game world) is of course 2D. What this meant was that any actions from the player on the visuals such as instigating the zoom or pan effects also proved to be puzzling in terms of development. “I had to review my trigonometry course to accomplish this task,” laughs Priska.
All in all, the project would end up commanding a lot of assets that would also complicate the back-end side of development. The game ended up including 99 TV references to find, 114 with bonuses, and involving over 700 quiz questions with 300 or so Blind Test sounds. This is where friend Vivien Ripoche stepped in to offer some developer expertise, assisting in the build of a PHP and MYSQL backend capable of managing the game data and services being served to the front-end. Within this, Priska recalls that a particular headache was caused by the method used by players to submit their guesses. “One of the biggest coding challenges was creating an input text recognition algorithm. The gaming experience is based on typing in the correct series title, so it was therefore necessary to create an intelligent algorithm that does not penalise players for typos or spelling errors. It would also need to be smart enough not to consider an answer as valid if its spelling was similar to a correct answer within the visual, but still not technically right.” This tricky balance to strike was echoed in the conundrum faced by so many these days for creating ambitious digital experiences suitable for multiple platforms. “We also wanted a site accessible on all devices including mobile,” stresses Romain. “Another big challenge was to create a game available on the maximum number of platforms.” “Since WEBGL is not compatible everywhere, we had to create two games in one,” Priska adds. “A ‘full’ version in WEBGL with full-screen video and a version without WEBGL used especially for tablets and phones, so it’s a lot of work.”
At the launch of Popcorn Garage, the site very quickly ran into a server problem due to the massive, largely unexpected, traffic. Fast-forward 18 months and Popcorn 66 were determined not to make the same mistakes. “The release of a project like Popcorn TV presents several problems,” concedes Priska. “On launch day the site must actually be able to handle the load, but there are also all the unexpected bugs to manage. So to mitigate this, we created a group on our Facebook page where players could explain any problems encountered. We spent hours after the launch to settle everything once it went live.” Beyond such a thoughtful commitment to addressing such inevitable launch niggles, you really get sense talking to the pair that they cared and continue to care immensely for what they do. After the undeniable successes of Popcorn Garage, both really felt the pressure when it came to unleashing a follow-up because of the natural keenness not to disappoint expectant players. “Four months after going online, the results are super positive,” Romain concludes. “And we’ve had a lot of media relays around the world while picking up Website of the Day on FWA, Awwwards and CSS Design Awards. After appealing to cinema lovers, we’ve managed to drive all TV series lovers around the world similarly crazy, creating a real community through both Popcorn projects. This is what we are most proud of.”
below Popcorn TV can be enjoyed across all screens