“Fanhouse is a social platform that connects content creators with their top fans and allows creators to easily monetize their platform on their own terms. Think of having a private alt account or finsta, but with a subscription! Through a secure paywall, fans get to engage with their favorite creators on a more personal and exclusive level, and creators get to freely be themselves and show more of themselves, their lives, their talents, and their personalities. Whatever it is a creator wants to share, whether it’s comedy skits, singing covers, artworks, or even a funny meme they made, they can feel safe sharing it with followers who support them and are willing to pay to access that content.” - Fanhouse

In 2021, I worked for Fanhouse to overhaul their mobile UX. This was a unique opportunity, in that I was given free rein to make improvements to their app, without any guidelines or constraints.

 

Existing Comment/Tipping UX Flow:

existing design 1.png

Analysis:

  • inconsistent and nonstandard use of modals

  • nonhierarchical button design

  • disproportionate post:comment size

  • repetitive UI elements, provide decreasing value to experienced users

 

Existing brand colors

fanhouse 3.png

New brand colors

Fanhouse Splash.png
 

Updated color palette on white

Color 3.png

Updated color palette on black

Color 2.png

New Color Palette:

The existing Fanhouse colors were desaturated, muddy, “neither here nor there.” In redesigning the Fanhouse color palette, I thought about the core interactions users have with the app. “Liking” posts and tipping their favorite content creators. French Rose represents the love users give to their favorite creators, while Nectarine represents the gold currency fans can gift creators with. Fanhouse is represented by the color that falls between Love and Gold, Coral Reef. I chose a light pastel purple as a secondary color to contrast the primary Fanhouse color palette. This will break up the red-yellow color range and can be used to create visual distinction between buttons.

 

Modals:

Old

old modal home.png

New

new modal home.png
 
old modal interaction.png
new modal interaction.png
 
old modal post.png
new modal post.png
 

New Comment/Tipping UX Flow

 

Proportion Experimentation:

proportion experiment.png