Chaos Hoops

• 

  Splash Screen

• 

  Game play showcasing live action shots of shooting baskets while using a power up!

• 

  Real time visual display of friends (in avatar form) and their live score during a game.

• 

  High scores displayed at the end of each game to determine who gets bragging rights.

About the Project

• Description: We're a team of 3 that turned a traditional arcade basketball game into a connected lens AR experience allowing friends to compete in real time to get high score bragging rights!
• Team: Naomi, Wayne, Evan
• Mission: Use AR to bring friends together while they're apart!

Inspiration:

When inevitable distances affect friendships, families, relationships or co-working spirit, amidst all our chaos - staying connected remains to be a difficult, yet important task. With this in mind, our inspiration was drawn from one specific environment that proves to bring people together, the arcade! Chaos Hoops was our solution and way of building connections even in long-distance-ships. We believe creating a Connected Lens pushes for a more wholesome, real-time AR interaction that people can experience. Being present in your home environment and keeping in sync with the game’s spirit; playing this AR experience is competing not just to win, but to build on relationships. Having these qualities are what’s necessary to draw people back to the lens to keep the conversation going!

This was a deep dive into Connected Lenses and multiplayer AR gaming. We started out with a simple tap to shoot, score or don’t score mechanic. In fact, we dusted off a classic!

• https://www.youtube.com/watch?v=F_Y7Eflnzfg
• https://www.youtube.com/watch?v=0oM0k7Ux32Q

We thought, shooting virtual hoops is fun, but wouldn’t it be great if we could all shoot hoops in a circle, from around the world, at the same time, WITH FIRE?! We had our work cut out for us. Our focus was to build a connected lens game to explore the intricacies of augmented reality experiences that take place across long distances.

Lens Functionality:

The game experience allows users to join, complete and play together in real time with anyone, anywhere! The basic game functionality is modeled after a traditional arcade basketball game, throwing balls to shoot and score, with a lot of added twist and fun. We felt this would be a good mechanic that is well centered in a familiar game - so players’ learning energy could be more focused on getting used to a (less familiar) connected AR gaming space.

The lens starts by setting the game’s hype as the user onboards; never a dull moment this point forward. The users enter a timed session to score as many points as possible, with power ups and exciting variations to level up competitiveness in AR. We incorporated various custom elements of functionality to provide the user with a seamless and engaging gaming experience. This includes:

• Start: A thematic onboarding to launch users into a journey to the game experience.
• Reset Positioning: To assure the user has clear visibility, regardless of orientation and origin movement, and to help alleviate positioning glitches while co-gaming.
• Power Ups: Dynamic elements that the user can activate, providing scoring advantages, game/visual excitement and presenting another level of competition.
• Sounds Effects: Audio cues that are associated with each power up design.
• Dynamic Backboard: The backboard includes looped directional movement to mimic the arcade game and increase the challenge.
• Scoring: Track all user’s live score above their avatar during each session, along with displaying comparison of your own score and high score on the backboard.
• Avatars: Visual display of friends added in real time to elevate the feeling of being together or playing an actual game in-person.

How We Built Our Lens:

Starting a connected lens is a new experience, for us, and players alike. We have taken care to craft each part of the experience so that the next steps are clear and players can easily get hooked up to the session to start playing. The lens flow includes visuals designed to guide users to important CTAs such as the Start button (to launch a session) and the flip camera button to help them get to the world portion of the lens. This context assistance for switching from front to back camera and connecting with the session, allows users to navigate their camera as well as the new and potentially unfamiliar UX flow of connecting to a session. The goal is to help the user feel oriented at any point in the lens experience, and help them get to the actual gaming with little resistance.

We worked backwards from a fully colocated lens and transitioned into a connected lens with the idea of co-location. The critical aspect of the colocated experience that was most important to the lens design is a sense of gathered seating around a circle. Players are procedurally positioned along the edge of a ring, that may or may not correspond to real-life positioning. The game field itself exists locally for each user, and each person’s field sits on the center of the player circle, as though everyone was looking directly inward toward the same goal. We designed the hoop and its animations to be rotationally agnostic, making heavy use of LookAt components to ensure that the game field faces each user, no matter where they are on the circle. At any point, a player may reorient themself to a different position on the circle using the Reset Positions button on the bottom left of their world camera screen. Pressing this button chooses a fresh point on the circle, smoothly leaps the player to the new point, and importantly, realigns their view of the gameplay circle so that they are facing toward the center. This reorientation serves a dual purpose of allowing players to center the game experience based on their current world-tracking situation, and easily move to a new spot on the circle if they enter the lens bunched up on other players. (For other players, a reorienting player’s avatar would appear to jump smoothly to a new position, with no other effect on their personal game.)

Integrated scoring calculates and displays each player’s real-time high score on their avatar heads, and keeps a displayed track record of your personal best high score built into the dynamic backboard. This scoring system is built from interconnected template components such as the SharedScoreboard, modified and linked to communicate with each other and display accurately synced scores. Scores are synced within the context of each session, Game-by-game synced scores are maintained within the context of a session. This allows a user to drop from the session and rejoin mid-game with their score intact. However, high score tracking is not synced at all and uses classic persistence - so it serves as a personal best whenever a user reactivates the lens.

How might we build on the idea of traditional arcade basketball to challenge the status-quo of experiential gaming and inspire more excitement to users miles apart? Perhaps we simply pour in more chaos: set some of the balls on fire, turn some into planets, bend the rules a little. We set this up as a series of Power Ups that can be collected throughout the game to boost your scores. The balls have unique abilities: Moon Ball gravitates towards the hoop with a slight magnetic pull, Bubble Ball is smaller, lighter and throws easily, and Gold Ball increases each basket from 1 point to 3 points. These power-ups have a time limit, evident by a visual time-runner aid that disappears with the power-up after it ends, until another is collected.

Challenges We Faced:

Going from concept to a technical context for a Multiplayer AR space, raised us more questions than answers. In a non-colocated experience, how might we represent the positions of other players? Leveling up on how collaboration exists in AR games was definitely a goal, but more than making the connected lens feel engaging, we wanted to make the user’s distance, location and time far from their friends/family/co-players feel less obvious. To make Chaos Hoops feel like one of those games you’re playing with your friends in the same room, we added repositioning to give you the “next to” feeling when avatars surround you in a circle group.

One of the greatest challenges was finding out exactly what components of the lens needed to be synced in real-time, and in real space. In order to build a competitive spirit, while keeping the lens experience clear and intuitive, we had to strike a balance between co-location and personal gaming. One of our major developments was the switch from “everyone playing with the same basket” to “co-existing in a circle, each person playing with their own personalized, implied basket.” In a fixed-basket design, everyone needs to see the same goal. As we quickly learned, the backboard is a critical component in getting the ball in the hoop. This would mean that for a colocated game with synchronized physics, everyone would need to see the same backboard, or risk dissonance from watching other players’ balls bounce off an invisible board. We experimented with rotationally symmetrical goal designs, but felt that they lifted the game too far away from the reference material. We wanted the game to be grounded in real experience, and the augmented space to be an intuitive addition.

We initially expected to take the burden of repositioning out of the player’s hands, with a script that would automatically reposition players, evenly spaced around the circle, between games. As it turned out, not only was this automatic repositioning not entirely helpful, but evenly positioning everyone around the circle was not necessarily even a desirable outcome. (With an even number of players, you’d always end up in a situation where another player’s avatar was directly behind your view of the basket, cluttering the visual experience.) We decided to rethink notions of “properly positioned” space, and focus instead on a remote-first, and gameplay-first design. As a result, the circle of players is mostly abstract, and the game features a fully-manual repositioning. Players can press a button to (a) shuffle their own position around the circle of players, and (b) re-orient their own game field and representations of other players in front of their own device. The re-orienting player will experience a brief field shift, and end up with the game re-anchored to their own reality and surroundings. Other players will see the reorienting player’s synced avatar jump smoothly to another spot, enhancing the chaotic atmosphere . The key is, it allows the player to keep playing, and maintain a feeling of immersion, with the option to recenter the game for themselves as needed.

Accomplishments That We're Proud Of:

Each time we tested, we ended up competing, tapping on the ball to the best of our abilities, and trying to catch the powerup. Getting caught up with our own development tasks over the days, soon those improvement sessions started to increase the feeling of togetherness between us, just by hanging out on the lens. We respectfully challenge you to beat our personal high score: 225.

Furthermore, we are thrilled that we tackled the beast of synced multiplayer lenses! It took a while to wrap our heads around exactly what is going on when multiple lenses are communicating with each other within a session. Each user’s device has to be very specific with how and when it sends information, and how it uses information gathered from other devices to represent synced factors.

What We Learned:

Building to increase human connection with technology requires a lot of thoughtful creativity and problem-solving. A well-thought-out plan set in the beginning and iterated throughout can help make the user's idea of feeling engaged intuitive and unforced. User testing, especially in a Connected Lens, is necessary as it helps in exposing a lot of perks and flaws otherwise difficult to determine.

Speaking of exposing flaws, we have learned the true dangers of last-minute feature updates. We tried to include a crown that the winner of each game could wear on their avatar until a new winner was crowned. The crown feature didn’t pan out, and unfortunately, including it in our submission caused other components that had been working to disappear as well. Flew too close to the sun. We look forward to getting the crown working in a future update.

What's Next for Chaos Hoops:

Moving forward, our team is aiming to expand our thinking and re-range our features to make Chaos Hoops provide users a more in-depth gaming experience.This includes components to modify difficulty level, ability to add personal Bitmojis as avatars, alternate environments to modify engagement levels, and better visual aid to guide users easily over the limited space. The future of Chaos Hoops will include In-Lens purchases which will be geared toward user personalization like unique avatars, basketball skins and backboard designs that can be used for monetization and expansion.

Built With

• adobe-after-effects
• adobe-illustrator
• blender
• javascript
• lens-studio
• snapchat