An Interactive Art Installation

Flux is an interactive installation that connects with players through their mobile devices. These devices become controllers that bend and warp a grid to move objects around four sides of a cube. Simple, geometric graphics and an original soundtrack welcome players into a rich and engaging world of collaborative and spontaneous gameplay.

Backstory

Your home planet has been stripped of all natural resources and contaminated through centuries of overpopulation and pollution. In desperation, your species sends drones into space in search of uninhabited and resource-rich planets.

Drones, or “Collectors”, are sent down to the surface of the planet to harvest its resources. A force-field that you can manipulate is established on the alien planet in order to help guide the drones. Be careful though, the force-field is unstable and can collapse to create wormholes if stretched too much!

Credits

Special Thanks

Alan Dower, Dr. Audrey Girouard, Chris Clarke, Dr. Lennart E. Nacke,
Artengine, Eric Foot and the Baylis family

Audio Engine

FMOD Sound System by Firelight Technologies

Sound Effects

Copyright © 2013 · Projector Face
Core Game
The visual components of the project were written using the XNA game framework for C#. Independent managers run separate components of the game including users, wormholes, resources, among many others. XNA maintains a TCP connection to the server in order to send or receive any new information, and is able to hook into the game using a custom event manager. The game keeps track of the coordinates and behaviour of all objects.
Server
In order to send messages between mobile phones and the XNA game, a middleman server is used to translate events between the two systems. The server itself is written in Go, and is able to handle thousands of simultaneous connections. Mobile phones connect to the server via WebSockets, allowing for real-time communication. In order to communicate with XNA, a raw TCP socket is used with an arbitrary format to keep parsing as fast as possible. To keep track of teams, badges and stats, Redis is used as a database.
App
The controller for Flux was written entirely in JavaScript using Sencha as the base framework. Sencha is able to generate reusable components, such as navigation bars and buttons, to make developing pages as easy as assembling blocks. The server will send events to controllers when points are earned, which will automatically trigger the UI to update with the new data. In order to load the information for the user's collector or the badges they've earned, a standard AJAX request is sent over HTTP to fetch data from the server.
Graphics
The concepts for Flux were sketched by hand and designed in Adobe Illustrator. The 3D environmental assets for Flux were designed in Autodesk Maya and imported into XNA, which allows for flexible animations and lighting. The enemy characters were also designed in Maya and rendered as 2D animations. Marketing materials were designed in Adobe Photoshop.
Audio
Flux handles and triggers 4.1 multi-channel audio using the Fmod library for C#. The ambient music for Flux was recorded and produced using Ableton Live which allowed for complex layering, automation and mixing. The sound FX were based off of sounds found on freesound.org, then edited and mixed in Audacity. For a full list of credits, please see the section under the Game tab.

PROJECTION
The visuals are projected by four ViewSonic short throw projectors, which allow for a large projection, and a small distance between the screen and the projectors.
SCREENS
The four sided cube, with a screen on each four feet wide allows for a truly immersive experience.
MAGIC BOX
Although simple on the outside, there's a lot going on inside the cube. The computer powering Flux is located inside, as well as a TripleHead2Go which splits the video signal from one computer to four screens. This allows us to have interaction between sides of the cube.
NETWORKING
Inside the box the networking is handled, which takes care of sending information from the phones to the game and vice versa. Some say that the networking of this project can handle millions of multiple connections at once, some others say that the number is closer to 50, and those people would be correct.
MULIT-CHANNEL BLISS
Each projector stand houses a Tannoy speaker which allows for each side of the cube to have their own independant sound effects. This allows for a different acoustical experience on each side. In addition the soundtrack is played on all speakers, which allows for ambient experience which is shared by all players.
SUBWOOFER
Inside the cube, we house a Tannoy subwoofer that packs a punch. This gets triggered when a teams collector gets destroyed.
Jahfer Husain
team lead, lead networking development, back end programming
Flux was a great opportunity for me to learn about a lot of topics I had cursory knowledge of, but little experience in application. I got to experience project management first-hand, alongside server and mobile-application development. I'm happy I got to work on such a unique project with so many talented people.
Russell Baylis
lead physical setup design, audio design, web design
I truly enjoyed working on this project because of the great concept and amazing team. One of my favourite things about Flux is that doesn't take place on a computer screen, and offers a unique interaction that anyone with a smartphone can enjoy.
Stacie Ha
lead app design, environment design, marketing
Flux was an amazing collaborative effort and I'm very thankful for the fun, hardworking team I got to work with. This project was a fantastic learning experience, where I not only furthered my skillset in JavaScript and web app design, but I also learned that Sencha is not your friend.
Matt Scriven
lead back end programming, front end programming
Flux gave me the opportunity to explore object oriented design beyond what I had done before. It was really rewarding to refactor the code to make it more reusable and efficient. I learned that I prefer to make web apps, and XNA should not be used to make things...
Kyle Thompson
lead environment design, animation, user interface design
Flux has been a tremendous opportunity to work through the entire creative process. I've enjoyed watching flux evolve from our original idea into our final project. Modifying and improving the game throughout the year has been an exhausting and educational experience. I have loved crafting Flux into the unique and engaging experience we set out to create a year ago. Our team comes up with some amazing ideas when we smash our brains together and I've loved working with them.
Paul Young
lead set design, physical setup, research and development
I am interested in how people interact with technology, especially when it come to physical interfaces for digital systems. Flux allowed me to experiment with ways of engaging people in an interactive system. Creating a conducive environment for interaction has been a joy to work on.