For the December 2016 issue of sports and lifestyle editorial 110% Magazin, the team at publishing company Die Presse wanted to create an immersive platform that grabbed readers and encouraged them to deeply explore its content. Teaming up with Vienna, Austria–based digital firm Wild, a film crew and a mountain tour guide, “Eskapismus” presents an interactive look at 110% Magazin’s article on skiing and tourism in Schladming, Austria. The article introduces each of its five chapters with a full-screen video, taking visitors on a journey from Vienna to the top of a mountain near Schladming to a meal served at Hotel Pichlmayrgut. As visitors scroll down the slaloming layout of each chapter, different elements—audio clips, images, panoramic photos, quotes and videos—all work together to provide an immersive, interactive experience. An easy-to-use, circular navigation menu can be activated in the floating center bar.
React.js brought the interactivity of the site to life. “One of the most important goals for this project was to plan the architecture properly,” says Melissa Graf, project manager at Wild. “We knew we were going to use React and that we want to build a maintainable and reusable framework with it. Even though this approach allowed us to complete development in just a little under four weeks, we had to do some refactoring of the code along the way.” The site was built in a manually-edited data structure in JSON with five basic modules—one for each of the five different elements available—that could be used as desired for each page and combined to create new ones; for future issues of 110% Magazin, Wild plans on using a simple CMS.
“Eskapismus” received more than 40,000 visitors in the first two weeks after its launch, and has received accolades from Awwwards and the FWA. “The client was also happy with our speed and execution and looks forward to future magazine editions,” Graf adds. “Prospective clients like the idea of creating a reusable module system. This microsite is not just a one-off showcase, but can be continuously extended with new modules and content.”