UX Markup
ExtendedScreen
Pong Clone

swip

Pong & Photoshare Demo

Inspiration

The idea behind this tool was to use 2 or more different devices (e. g. Smartphones) to create a bigger screen, quickly exchange Data and create new game pattern mechanics (like pong with shifted screens). So we decided to try it out in the 24 hours Inno-{Hacks} hackathon at the DHBW Karlsruhe.

What we build

We created 2 example applications to show the capabilities of such a system. The first is a pong clone which let's you play with 2 different devices. Yes, even with different sizes! You just hold the devices next to each other an *swip* over both, pinching the thumb and indexfinger to the edge. That's it, you're now ready to play.
The second example is

How we built it

To provide a wide coverage of all the different devices out there, our choice was javascript. For the connection websockets were the best choice, so we used Socket.io. For the pong game, the canvas Element was the perfect choice.

Challenges we ran into

The Time synchronization between the devices was a real big problem, because we wanted a smooth transition from one screen to the next. The different pixel-density was another quite big problem, since the different manufacturers (Apple, Samsung, HTC) have different resolutions and density, we had to find a way to scale the content according to the devices density.