This project focused on building a social feed and profile system to a SaaS application. I was tasked with designing a brand new social feed, a live event feature that incorporated the entire userbase, as well as a profile page where users could purchase and customize their profile. All these improvements were pitched to improve 30 day retention
PROBLEM SPACE
The client required that I designed a social system which tied the rest of their application together. Users were leaving their application too early and by designing a social system - users would have more reasons to stick around.
I developed a consolidated social feedback loop of all the major components for this client: Play, Earn, Leagues and Shop. All tightly packed into a modern take on the scrollable social media feed. The difference here was I got totally rid of the fat which plagued social media feeds; certain usefulness of classic social media features (such as being able to post, or comment) simply weren't suitable for our application. I took the essence of what made social feeds valuable in terms of excitement, user retention and revenue generation and focused on the easy to comprehend social elements.
Scrollable Feed
I developed an automated social update system that tracked users' recent activity, milestones and achievements within a shell of a scrollable social feed
Connection
The connection was with seeing other users (and yourself) have their updates shown on a fun and engaging scrollable feed. By immediately seeing players in a non-competitive way, it encouraged more of a positive feeling which would contrast participating in Leagues. This connection complemented our Live Drops feature which I talked about soon after.
Identity
Players' identities were shown and embraced. Things like seeing their current rating for Leagues were shown beside their username but not in an aggressively competitive way. Their profile picture, and the type of games they enjoyed painted a picture to encourage further interaction. If they chose to spend units on Themes, the player card would show this.
Interaction
Tapping on a user's name (and your own profile) led to personalized and non-intrusive information about said player. Something I didn't include in my flows: a notification mentioning that you could stay anonymous, or limit shared information in the player's settings. I also added the ability to "Like" posts which could develop into a social notification system of some kind ultimately. It also just felt good to "Like" things.
LIVE DROPS/ EVENTS
Live Drops (also known as "Rain") is the glue that ties the social systems together and the main reason users would never get enough of the user ecosystem
Every day for a period of 3 hours users would have a window of time to complete objectives as a community. By completing objectives, a progress bar filled which was shown to all users. Once the goal had been met by filling up the Live Drops Pool to 100%, every participating member would receive X amount of units for their efforts.
Variable Reward Schedules
A proven psychological concept is. variable reward schedules. I designed this feature to take place within specific windows of time. The difference here is that the windows of time would change day to day which would force users to check in with the application. This would happen every 24h. For example, on Fridays if there was a period of time where a ton of users played for whatever reason, we could have curated for that. The window of time to participate in Live Drops would change day to day.
All these concepts were pitched during my design assessment.
INTERACTIVE PROTOTYPE
All the nodes as well as scrollable and interactive elements were set up within Figma. Claude as well as Figma Make were used as tools within this process. All concepts were precisely designed by my self. Each component was deliberately designed to fulfil a purpose and ultimately lead to an increase in user retention.
FIGMA DEMO:
https://www.figma.com/proto/0djHmjSXdKaZba8KCsuypA/Mistplay-Social-Layer?node-id=1-2&t=GE5e2CWdVMw7hxUC-1&scaling=scale-down&content-scaling=fixed&page-id=0%3A1&starting-point-node-id=51%3A6238