UNO For iOS, Re-designed

OVERVIEW

In early 2020, much of the world flocked to the internet for work, play, and keeping in touch with friends and family. Undoubtedly, as was the case with social networking and video conferencing, online video gaming spiked. Verizon reported a 75% increase in gaming usage during peak hours in the United States. 50% of gamers increased gaming activities.

Our team researched the large number of tangible (board/table) game players, and the translation of their physical experiences to virtual ones. We take into account the behavioral, social, technological, and financial aspects of this change, while especially examining the differences in user experience between physical and virtual gameplay.

Concept Video

UNO For iOS, Re-designed

ROLE

Lead Product Designer, UX Researcher

User Surveys, Research Analysis, Personas, Visual Design, Interaction Design, iOS Prototyping

Fall 2020

Background

We want to examine how board gamers feel about online board gamers and learn about their behaviors and pain points. We are interested in users’ specific experiences in both tangible and online board and party games to create a better online gaming experience.

Research

OBJECTIVES

SURVEY

We designed an online survey with questions such as:

We then posted the survey in various communities, including the “Board Games” subreddit, various online gaming forums, and team members’ friend groups. We used a mix of multiple-choice, closed-ended questions and checkbox questions to collect valuable gaming habit data, as well as open-ended questions to encourage free thought. We received 28 responses.

80%

of players have played board games online, and tend to spend more time playing online during the pandemic.

65%

of players spend 4+ hours on games in a week

55%

of players communicate with other online players by using third-party platforms such as Discord and Nintendo Switch Online (both in-game chat and voice chat).

70%

of players are not satisfied with current online board games.

Analysis

Through surveys and observational research, we uncovered the following about tangible (non-online) board gaming. A majority of players enjoy playing board games with friends in-person because of:

The tangibility of game objects & ability to view player’s reaction and facial expressions in real-time

Tactility

The dialogue around the table and more potential for comedy

Social Engagement

The ability to change rules offline according to players' preferences

Freedom

Unappealing and confusing UX/UI or technical problems in online games (e.g. Terraforming Mars, Race of the Galaxy)

Easy UX/UI

Based on our research, we also determined the following reasons why people enjoy playing online board games:

Online games can help support game mechanics, eliminating the need to memorize every rule (e.g. Settlers of Catan)

Computer-Aid

The ability to connect with players around the world regardless of geographic locations

Accessibiliity

There's less hassle to organize an online meeting during the pandemic

Social Distancing

Some free-written feedback we received was condensed into the following:


User Personas

We created user personas to reflect our user-base's responses, attitudes, and behavior patterns.

Each of our personas represents a different problem our solution hopes to fix. By incorporating a few of the most prominent user frustrations and behaviors, we can take an empathetic, context-specific approach to our design.

Solution

Social Engagement

Easy UI & Accessibility

Freedom to Customize

Our solutions served to address our users' most prominent pain points of online gaming.

When it comes to social engagement we thought of “What are some ways people engage in real life when playing board games?” And one answer that comes to mind is that you can see your friends. Faces convey a lot of information. There's emotions and visual feedback, which are significant aspects to communication you can't get in most online games. We want to change that. So our design solution includes live video during gameplay, where you’ll see each of your friends in their own side of the virtual table. We also found that people were put off by board games because they were restrained by the rules that online board games have; when you play in-person you have the freedom to change the rules how you please and that’s how lots of people play. Having customizability in online gaming is a big part of our design as well.

"Faces convey a lot of information. There's emotions and visual feedback, which are significant aspects of communication you can't get in most online games. We want to change that."

UNO, Re-Designed!

Here is a condensed version of our problem and solution from start to finish, in video form! Below the video is a walk-through of the solution in detail.

BEFORE | Landing Screen

The first thing was to prioritize the customizable freedom for UNO gameplay. At the moment, the app has a defined set of rules that players must follow that is also different from the tangible card game that most UNO players are used to. Not everyone will enjoy playing by these new rules (there were a few we didn't exactly enjoy or anticipate either), so we've added the option of toggling various rules on and off. Players would only be matched with other players who have toggled the same combination of rules.

We changed the UI so that, up-front, the user is aware of the ability to customize gameplay.

AFTER | Landing Screen

We changed the UI by adding the "CUSTOM PARTY" card so that the user is immediately aware about the ability to customize the game. We also changed "FUN ROOM" to "FREE ROOM" which will be discussed later.

Once tapped on, the user is taken to the screen below we designed, where players can choose between "Hot", "Classic", and "Customizable" modes.

BEFORE | Room Settings

UNO already provides "Hot" and "Classic" modes on a different page, but the only difference between the two modes are added point multipliers and unique cards, not the rules. The user can then add as many different sets of "Customize" cards to save various combinations of rules if they wish to play by different sets of rules in future games.

AFTER | Room Settings

Our design included the new "Customize" card. Once tapped on, the screen below is shown.

ORIGINAL DESIGN | Toggable Rules

The screen below was designed to look like an UNO app screen. Some of the same images and assets were used, while others, such as the font, color scheme, and card designs were reproduced in a similar fashion. Here, the player has the option to toggle "on" or "off" various rules they see fit. After saving, matching will prioritize other players who have enabled the same rules. The "Enter your own rule here" option will allow players to enter specific rules when playing in the "Free Room" mode, where players can create virtual rooms with their friends that simulate a real tabletop game experience - I explain more about this later.

BEFORE | Gameplay

Here is where the social engagement aspect comes in. Before our re-design, a limited set of still avatars were shown on each player's area.

But now, we've incorporated the ability to stream your mobile device's front-facing camera, so you're always in real-time view of your friends.

However, while streaming video is great for increasing social engagement, it is not so revolutionary. So, we made it so that players can choose to include rules that involves the video feature - like making various facial expressions that a potential AI can pick up. In the above screen, the players decided to incorporate an option where the last player who sticks their tongue out when a "6" card is drawn must draw 1 card. Other possible ways players can incorporate more social engagement is through using rules that include voice, such as saying "UNO!" instead of the tapping on the button, because that is one of the most important and fun aspects about UNO, that is lost in this online version!

Free Room

As shown earlier, we sneakily changed "FUN ROOM" to "FREE ROOM". The Fun Room allowed players to make private games with their friends. However, after changing it to FREE ROOM, players can now customize games exactly how they want. Players will set up their own rules how they please, and these rules will be shown to each player in the room. No additional coding is necessary, because the Free Room functions as a tabletop simulator - meaning that it is just a digital version of the real UNO game - no additional limits or rules. Here is a screenshot of an idea of what that screen might look like.

Players just place cards as they normally would during any card game, and can always refresh themselves on their custom rules by clicking on a rule menu (not shown). It is up to them to follow the rules. This way, the app takes a step back from the user control that some gamers don't want, allowing gamers ultimate freedom for their UNO desires. Of course, video chatting can always be included as well!

We received great feedback on our design process and solutions, and our professors agreed that we resolved the major pain points of our users that boosts social engagement, makes the app's UI easier and more accessible, and allows users the freedom to customize their games how they please.