Filter FaceOff

The OUTCOME

Filter FaceOff: An Instagram game to experiment with your online self-expression

Filter FaceOff was designed to reduce the negative feelings of anxiety and cognitive dissonance that result from the disparity between one's authentic self and one's public presentation. The game achieves this by challenging users to be make the funniest selfie they can in response to outrageous prompts. The game also provides unique, wacky filters so players can design their selfies to reflect their own ~artistic sensibilities~

KEY FEATURES

1. Playing with (and against) your best friends

Summary: This game can be played alone, but its the most fun and effective with friends. Users submit their funniest selfies to the group, which then votes to decide on the winner, leveraging social proof!

‍Rationale: Our testing showed that friends can embolden each other to be more free-thinking and brave with their selfies by encouraging each other and upping the ante with their own funny selfies.

2. Funny prompts to respond to — fast!

Summary: Constraints are our friend in design. Challenging players to respond to humorous prompts within the safe space of play gives them permission to explore non-traditional and non-conformist selfies.

‍Rationale: We used the persuasive design concepts of distancing and distraction with gameplay to take the pressure off of the idea of deviating from normative beauty standards. The timer pushes users to think fast, giving little time to over-think or over-edit the selfie.

3. A range of unique filters at your fingertips

Summary: With only 30 seconds to respond, players can quickly swipe through the new filters in order to enhance their selfies.
‍
Rationale: Our user interviews indicated that a key barrier to self-expression was the lack of quality filters that matched users' personalities. Therefore, we custom-designed quirky, silly filters to encourage participants to try out new digital 'costumes' that match their mood. Usability testing also showed that our players wanted these filters to be quickly accessible - so we embedded them directly into the game.

1. generative reserach

NAVIGATING a broad problem space

Key research questions

With such a broad problem space as "how to improve self-esteem within Instagram users" we needed to clearly define our research goals and leading questions. From the onset, we were looking to understand:

What is the relationship between self-esteem and online self-presentation?
What anxieties and pain points do Instagram users face regarding self-presentation?
How does self-esteem relate to filter use on social media?

To tackle these questions, we used the following research methods to reveal patterns, pain points, and design opportunities:

1 Focus Group

using the New Metaphors framework to understanding feelings around Instagram

7 User Interviews

with females aged 18-24, asking about their Instagram and filter use

10 Academic Papers

on online self-presentation provided the theoretical framework for our design

3 Expert Consults

with a focus on HCI in social media to understand the potentials of filter use

Synthesizing research data with affinity mapping

💡key takeaway 1💡

Normative expectations limit self-expression

Many users feel unable to fully express themselves online due to 1) conformist expectations of various audiences and and 2) normative beauty filters

During the focus group, participants to choose metaphors such as "A Temporary Cover" and “Things Attaching Themselves” to describe how filters change the shape of the face or the texture of the skin to fit a norm.

Our expert consult Tate Ryan-Mosley noted that the danger with filters comes from a narrowing of the “standard“.

Metaphor an interviewee chose to describe filters

"Cancel culture is real and makes it quite hard to fully express yourself; especially if you have a bigger following"

💡key takeaway 2💡

Self-discrepancy causes feelings of inadequacy

Instagram can amplify perceived discrepancies between the actual self and the ideal/ought self, causing feelings of anxiety and discontent

This finding from our review of literature and user reports showed that users feel uneasy and anxious when they feel there is a difference between who they are and who they should be. Users noted feeling disappointment and self-dislike in response to normative beauty standards on Instagram.

Self-Discrepancy Theory Diagram

"But Insta gives the connotation of 'you need to be perfect.' You need to be your best self even if you’re not in your real life.”

💡key takeaway 3💡

The intent with filter use differs with high or low self-esteem.

Users approach filters differently according to their self-confidence - from covering up perceived flaws to expressing their personality.

Initially we hypothesized that filters were simply used to cover up perceived flaws. We chatted with 3 experts in online behaviors and found that filters are not inherently problematic; It is normal to want to present one's best self to the world.

Our user interviews confirmed that there were two attitudes surrounding filters: one to hide and one to enhance.

"My favorite filter is the one that pulls top of your head into horns — its just fun, like a Halloween costume”

"When I was very insecure and hated my body, I used filters to change the way I looked, but I grew out of it"

"When I’m applying filters on my facial features I am uncomfortable.. it reminds me that I am not happy about myself”

Persona

persuasive goal

How might we nudge users' filter use to transition self-presentation towards authentic expression?

By understanding the relationship between filter use and self-esteem, we saw a design opportunity in using filters to change users' approach to self-presentation and thus reduce the anxieties of trying to fulfill an inauthentic beauty standard.

II. Evaluative reserach

Ideation and validation

Rapid ideation with persuasive design methods

Each of the five team members ideated 10-15 initial ideas based on concepts from class, such as self-affirmation, cognitive dissonance, and counter-stereotypic exemplars.

We then voted and discussed to highlight the 3 best ideas to pitch to a class of HCI students and professionals. After the pitch we received feedback and synthesized pros/cons to converge on the 'bad selfie game' direction.

Ideation FigJam

Low fidelity Wireframe

Our lofi prototype tested the game's attractiveness and effectiveness (and failed).

A friend group of 5 Instagram users aged 18-24 were shown prompts on a google slides, then responded by taking photos with filters on Instagram and voting in a group chat. We then conducted a post-activity interview.

Our participants were candid about their lack of interest in the game; they rated the game's fun factor a 3.5/10, but noted that they were likely to share a funny selfie with their friends. We were in fact glad to fail so quickly, as we gained valuable insight into how to improve the game:

The game felt repetitive and the prompts were not exciting enough
Users need more filters readily accessible

“Process was too complex”

“UX was difficult because we couldn’t find filters”

Testing modalities

We ran two parallel prototypes to test game modalities and pursuasive elements

The group split into two and developed 2 prototypes separately: one in person using physical cards, and one using a mid-fi Figma prototype simulating an in-app game. This was done to evaluate certain aspects of the game including:

Effectiveness of digital vs physical game versions
Usability of a new filter interface
Effectiveness of the rewritten prompts

Gameplay prompts for in-person test

Stills from the Figma prototype I designed to test a digital game flow

Findings:

The new prompts generated much laughter and excitement; the game was rated 7.2/10 for fun (up 3.5 points).
Users actually posted on their stories as a result of the gameplay, validating our design direction.
Participants were challenged by the friendly competition.
Finally, though the in-person game was fun, the digital version was more streamlined and usable.

“If it was an actual app, I wouldn’t use it. But if it was integrated into IG or an iMessage game I would consider it.”

HIGH-FIDelity

I surveyed the competitive landscape to determine which of the various game platforms would have the highest likelihood of adoption

After the medium fidelity prototyping round, we needed to determine the best hosting platform. Our second round of testing affirmed that the game would work best in a digital format to mechanize the timing, voting system, randomized prompts, and filters. Therefore, I ideated on hosting the game on the following platforms:

Jackbox TV

Pros: in-person game, easy to synchronize prompts and keep track of points
Cons: less popular of a platform, would require switching back and forth between Instagram and Jackbox TV

GamePigeon

Pros: more popular gaming platform due to its ease and integration in iMessage, and its ability to be played asynchronously
Cons: would require switching back and forth between Instagram and iMessage

Instagram / Messenger

Pro: All functions could be contained in-app. Extremely popular platforms, relate directly to the domain-space of our persuasive goal
Con: Voting functionality within filters is tricky

After digging deeper into the technical capabilities of each platform, I discovered that Instagram and Messenger are coming out with the capability to build effects for group play with lightweight AR games on Spark AR, article linked here.

Given the technical advances of Instagram’s AR filters and the usability of the filter building platform Spark AR, Mia and I decided to build out the filter on Spark AR and test natively on Instagram for the high-fidelity prototype.

Screenshot from development in Spark AR!

USER REsEARCH - AUGMENTEd REALITY

✨Filter FaceOff✨

A new Instagram filter game that challenges you and your friends to be more experimental and creative with your online self-presentation

The IMPETUS

How might we design an prosocial intervention that promotes self-esteem within Instagram users?