IRIS IRI YON
5 min readAug 11, 2017

LEVERAGE — Augmented Game Board Experience

Leverage, the interactive augmented-reality game, helps working adults that enjoy playing board games get to know new things about their friends! By incorporating cool media aspects, this game enhances social interaction, insights into each player, and a sense of community more than any regular board game could do. It is a mixture of two popular games, Secret Hitler and Catan. Using medieval times style text and kingdoms and Adventure Time-style characters, Leverage provides a sense of adventure and friendliness. Its gameplay and design promote collaboration and increase bonds.

In order to create a unique user experience, we included different technical features: A color recognition tool, an emotion recognition tool, a websocket connection and panorama views. This contributes to the goal of a cool media interaction and provides a unique user experience.

Observations

To get a basic understanding of user tasks and needs of playing board games, we started with a human-centered observation. This process included observations, a task analysis and according interviews. We conducted interviews at Games of Berkeley and Victory Point Cafe. We interviewed a variety of people from families, working professionals, people on dates, and students to gauge what our target audience might want in a game oriented application.

Ideation and Prototyping

During the design process we attempted to identify various ways an augmented reality board game could be created and integrated with cool media. As our iterations progressed, we developed new ways to incorporate it.

Our wireframes attempt to show the augmented reality features on the camera viewing from above the game board.

In later iterations we began to reevaluate the primary focus on the game; ultimately it should be about the interaction with the other users. From this we were encouraged to add things like Risk UI into the game.

Characters:

Characters are non specific so that the game encourages a diverse audience to relate with their character. The simple design contrasts from the detailed

Kingdoms:

Detailed renderings representing different kingdoms characterize the types of environments players can enter. An important part of our game play involves graphics and an engaging interface, helping users experience a physical and virtual interaction.

Resources:

These are the resources allotted to each player, a tangible piece and a virtual representation of resources for players to keep track of.

Game Board:

Part of the tangible UI, the 3D printed model of our original prototype helps players interact virtually and in the real world because users must take a picture of the game board to scan its colors and enter the desired kingdom.

Views

To augment tangible UI through an interactive, virtual interface, a 360 degree view of the kingdoms can be accessed by players physically moving around. By using sensors and device orientation, players must physically engage in a virtual world, allowing them to experience a unique gaming environment that help enhance social interaction and engagement.

Features such as draggable icons, variety of touch movements, and 3D buttons aim to mimic game consoles and take advantage of affordances. Detailed graphics and animation keeps players engaged and creates an immersive experience.

Websockets

The server view stores all player IDs that are assigned as soon as they connected to the websocket. As soon as one player changes the view (e.g. when entering a kingdom), he is assigned a new connection ID (due to the properties of the websocket). Therefore, the server sends an ID-Check request to all clients. All clients, that have their ID locally stored, send their IDs to the server. The server then checks, which client has a different ID from what the server has safed. When this is found out, the ID of the according client is updated.

Color Recognition

The color recognition algorithm recognizes the main colors of the game board piece, allowing users to enter the kingdom through their mobile device according to the recognized colors. For example, if the main colors recognized include green, the user will enter the leaf kingdom through their device after the application scans the colors of the image through the phone camera.

Our app utilizes a k-means algorithm to identify most prominent color for identifying the kingdom. Utilizing Chang et al.’s paper “Palette-Based Photo Recoloring”, we found the five most prominent colors in the image color space and converted the RGB results to HSL. Using HSL, we were able to extract the hue by the degree thresholds and the extraneous background colors were delineated by the saturation levels. This worked even when multiple kingdoms were next to one another as the hue of the more prominent kingdom 3D print would occur the must.

Concept Video

This is an over-arching concept video, showing off the many features and interactive aspects of our augmented reality game board.

Our Team

Hana Hyder |Andreas Billert | Iris Yon | Pranav Ragupathy | Miguel Ugalde