Interactive Media and Pervasive Computing: Building an app

Andreas Hammer Video Leave a Comment

This project is a combination of the two seperate courses: Interactive Media and Pervasive Computing. We had to include aspects from both courses in designing an app for a smartphone.

For a prototype demonstration, see the video above. The voiceover is in Danish, but it should still be able to communicate the basic functionality of the app.

The object was to program a Mobile Urban Drama, which is a location aware application that lets the user explore a narrative where the real world sets the stage, and actual locations trigger the events. When examining the technologies used for building an app, we found the Ionic framework for Phonegap. This lets us use webtechnologies for programming our app, and make it a hybrid that compiles to Android, iPhone and Windows Phone. This saved us a lot of time, because, even though we all have experience in Java, none of us have any experience in putting it to use for programming an Android phone. And we all have experience using webtechnologies.

Our narrative is called Open Protocol, and it takes place in Denmark in the year 2048.

itim game-icon

The Open Protocol app logo

The danish state is surveying the population and violating their privacy, and a small rebel hacker group (the players) take action against it. It’s a cooperative game for 2-4 players. The game takes place in Aarhus, Denmark, and the players can choose their missions by walking to specific locations while playing the game. Upon reaching these locations, events are triggere, such as having to hack an email account to publish the danish politicians conversations about surveillance.

We’ve illustrated the different paths the players can take through the game, by utilizing Marie Laure-Ryan’s plotgraphs and Hansen, Kortbek and Grønbæk’s MUD Framework.

itim plotdiagram

I won’t go into detail describing every node’s course of action here.

Using balsamiq mockups, we sketched up how we wanted the screens on the smartphones in the particular nodes to look like.

itim-mockups mindre

Sketching out the app

After trying it out the path in balsamic mockups, we started building our application. After finishing the build, we tested it in the city by playing the game. Here’s a couple of screenshots from the app.

itim ss

Note: The obvious ugly design with green on black was a conscious choice to add to the immediacy of our application, to allow the player to feel more “inside” the hacking game, as it if was for real.

Our project was well-received by the professor, so all in all we were happy with how it ended up.

These courses taught us a lot about pervasive computing and medias in general. I would say, however, that the key aspects of pervasive computing aren’t really reflected in the project that we had to develop. Nevertheless, it was fun to develop an app for the first time.