UX Case Study Social Media Mobile App

Anime Social
Platform

A social app built for anime fans. Content discovery, community groups, live streaming and AR sticker interactions. Designed entirely in Figma.

View Screens ↓ Back to Portfolio
60+
Screens Shipped
4 Months
Duration
Design Process

How I approached this.

01
Discovery
Brief, audience personas, platform goals and content moderation constraints.
02
Research
Teardowns of Twitter, TikTok, Discord and niche anime platforms (MAL, AniList).
03
Lo-fi Wireframes
User flows and skeleton layouts in FigJam before any visual layer was applied.
04
Design System
Dark-mode tokens, component library, icon set and typography scale.
05
High-fidelity UI
60+ screens covering onboarding, feed, explore, create, live, and community.
06
Handoff
Figma Dev Mode specs, spacing redlines, and interactive prototype for QA.
01

Splash & Onboarding

First contact. Cinematic brand moment, zero-friction sign-in and immediate value communication.

Splash & Onboarding
My Approach
01
Brand tone before anything elseDark cinematic splash with anime character sets the emotional register. Users know exactly what this app is in under a second.
02
Reduce sign-up frictionSocial login (Google, Apple) surfaced above the fold. One tap to enter, no form to fill before the user sees value.
03
Three-word niche promiseShort tagline communicates the platform's specific audience before any account commitment is asked.
Cinematic First Frame Social Login Niche Positioning Zero-friction Entry
02

Home Feed

Core content surface. Personalised anime feed with creator discovery and engagement actions.

Home Feed
My Approach
01
Visual rhythm to prevent fatigueAlternating full-bleed and compact cards break the scroll monotony. Users stay engaged longer without realising why.
02
Creator identity at a glanceAvatar, handle and follow CTA visible on every card. Frictionless discovery of new creators without leaving the feed.
03
Engagement above the foldLike, comment and share actions visible without expanding posts. Reduces the cost of interaction.
Alternating Card Rhythm Inline Follow CTA Low-friction Engagement Personalised Feed
03

Explore & Discovery

Discovery engine. Trending content, genre filtering and a high-density grid to maximise exposure.

Explore & Discovery
My Approach
01
Trending-first for new usersMost-engaged content loads before personalised results. New users get immediate value even before the algorithm learns their taste.
02
Genre-based filteringCategory pills (Shonen, Mecha, Isekai, Slice of Life) let users drill into interest areas without typing a search query.
03
2-column grid densityMore content visible per scroll matches Instagram and TikTok explore patterns. Users spend more time browsing.
Trending-first Load Genre Category Pills 2-col Grid Density Search Bar Always Visible
04

Create & Post

Creation flow. Media first upload, genre tagging and spoiler safe posting controls.

Create & Post
My Approach
01
FAB visible on every screenPersistent "+" button ensures the create action is always one tap away. No hunting through menus.
02
Media before metadataImage and video picker opens first. Captions and tags come after, matching how creators actually think about posting.
03
Spoiler toggle for fandom safetyOne-tap spoiler blur protects community trust. Anime fans are especially sensitive to unwarned spoilers.
Media-first Workflow Persistent FAB Spoiler Toggle Genre Tagging
05

Live Stream

Live video feature. Real-time viewer engagement, virtual gifting and chat without obscuring content.

Live Stream
My Approach
01
Viewer count as social proofLive audience number shown prominently. Drives FOMO for users who see the notification and haven't joined yet.
02
Gifting front and centreVirtual gift bar visible during stream. Primary creator monetisation surface positioned where engagement is highest.
03
Chat without blocking contentLive chat overlaid at 60% opacity on the right edge. Users can follow both stream and conversation simultaneously.
Live Viewer Count Virtual Gifting Overlay Chat Reaction Animations
06

AR Sticker Preview

AR interaction layer. Character stickers anchored to face tracking, with contextual pack discovery.

AR Sticker Preview
My Approach
01
Character anchored to faceAR sticker tracks facial features using device camera. Makes the interaction feel alive, not like a flat overlay.
02
Pack discovery in contextRelated sticker packs shown below the active sticker. Cross-sell opportunity without pulling the user out of the creative moment.
03
Tap-to-collect mechanicAnimated preview and one-tap save to library. The reward loop is visible before any purchase decision is required.
Face-tracked AR In-context Pack Discovery Tap-to-Collect Reward Loop Visibility
07

Community Group

Social infrastructure. Group identity, pinned moderation, member activity and frictionless joining.

Community Group
My Approach
01
Group identity at a glanceHero banner, member count and activity status above the fold. Community tone is set before a user scrolls a single post.
02
Pinned announcements firstMod posts pinned permanently above the timeline — rules and events are always seen, not buried by activity.
03
Join friction eliminatedSingle "Join Community" CTA with no prerequisites visible on the landing state — maximum conversion from visitor to member.
Community Hero Banner Pinned Mod Posts Single Join CTA Activity Status
Design Tools

Designed entirely in Figma.

Figma
Full design lifecycle. Research, wireframes, high-fidelity UI, design system and developer handoff.
Primary Tool
Core
Auto Layout Component Variants Figma Prototyping Dev Mode Smart Animate
Research
FigJam User Flow Mapping Affinity Mapping Wireframe Kits
Design System
Component Library Design Tokens Colour & Text Styles Grid Systems
Plugins
Stark (Accessibility) Iconify Figma Mirror Content Reel
Limited Availability

Want results like this?

Book a free 30-min discovery call — no obligation.

Start a Project View Portfolio

Typically respond within 24 hours.

Ashish Raj
Ashish Raj  ·  Aceframe Studio
Project Scope Call
Schedule a free 30-min discovery call. We'll discuss your project goals, UX challenges, and whether we're the right fit. No obligation.
30
30 minutes
GM
Google Meet
$0
Free — no obligation
Your Timezone
Detecting…
SUN
MON
TUE
WED
THU
FRI
SAT
—
Enter your details
Fill in your info to confirm the slot.
  • +93 Afghanistan
  • +355 Albania
  • +213 Algeria
  • +376 Andorra
  • +244 Angola
  • +1 Antigua & Barbuda
  • +54 Argentina
  • +374 Armenia
  • +61 Australia
  • +43 Austria
  • +994 Azerbaijan
  • +1 Bahamas
  • +973 Bahrain
  • +880 Bangladesh
  • +1 Barbados
  • +375 Belarus
  • +32 Belgium
  • +501 Belize
  • +229 Benin
  • +975 Bhutan
  • +591 Bolivia
  • +387 Bosnia & Herz.
  • +267 Botswana
  • +55 Brazil
  • +673 Brunei
  • +359 Bulgaria
  • +226 Burkina Faso
  • +257 Burundi
  • +855 Cambodia
  • +237 Cameroon
  • +1 Canada
  • +238 Cape Verde
  • +236 Central African Rep.
  • +235 Chad
  • +56 Chile
  • +86 China
  • +57 Colombia
  • +269 Comoros
  • +242 Congo (Rep.)
  • +243 Congo (DRC)
  • +506 Costa Rica
  • +385 Croatia
  • +53 Cuba
  • +357 Cyprus
  • +420 Czech Republic
  • +45 Denmark
  • +253 Djibouti
  • +1 Dominica
  • +1 Dominican Republic
  • +593 Ecuador
  • +20 Egypt
  • +503 El Salvador
  • +240 Equatorial Guinea
  • +291 Eritrea
  • +372 Estonia
  • +268 Eswatini
  • +251 Ethiopia
  • +679 Fiji
  • +358 Finland
  • +33 France
  • +241 Gabon
  • +220 Gambia
  • +995 Georgia
  • +49 Germany
  • +233 Ghana
  • +30 Greece
  • +1 Grenada
  • +502 Guatemala
  • +224 Guinea
  • +245 Guinea-Bissau
  • +592 Guyana
  • +509 Haiti
  • +504 Honduras
  • +36 Hungary
  • +354 Iceland
  • +91 India
  • +62 Indonesia
  • +98 Iran
  • +964 Iraq
  • +353 Ireland
  • +972 Israel
  • +39 Italy
  • +225 Ivory Coast
  • +1 Jamaica
  • +81 Japan
  • +962 Jordan
  • +7 Kazakhstan
  • +254 Kenya
  • +686 Kiribati
  • +383 Kosovo
  • +965 Kuwait
  • +996 Kyrgyzstan
  • +856 Laos
  • +371 Latvia
  • +961 Lebanon
  • +266 Lesotho
  • +231 Liberia
  • +218 Libya
  • +423 Liechtenstein
  • +370 Lithuania
  • +352 Luxembourg
  • +261 Madagascar
  • +265 Malawi
  • +60 Malaysia
  • +960 Maldives
  • +223 Mali
  • +356 Malta
  • +692 Marshall Islands
  • +222 Mauritania
  • +230 Mauritius
  • +52 Mexico
  • +691 Micronesia
  • +373 Moldova
  • +377 Monaco
  • +976 Mongolia
  • +382 Montenegro
  • +212 Morocco
  • +258 Mozambique
  • +95 Myanmar
  • +264 Namibia
  • +674 Nauru
  • +977 Nepal
  • +31 Netherlands
  • +64 New Zealand
  • +505 Nicaragua
  • +227 Niger
  • +234 Nigeria
  • +850 North Korea
  • +389 North Macedonia
  • +47 Norway
  • +968 Oman
  • +92 Pakistan
  • +680 Palau
  • +970 Palestine
  • +507 Panama
  • +675 Papua New Guinea
  • +595 Paraguay
  • +51 Peru
  • +63 Philippines
  • +48 Poland
  • +351 Portugal
  • +974 Qatar
  • +40 Romania
  • +7 Russia
  • +250 Rwanda
  • +1 Saint Kitts & Nevis
  • +1 Saint Lucia
  • +1 Saint Vincent
  • +685 Samoa
  • +378 San Marino
  • +239 São Tomé & Príncipe
  • +966 Saudi Arabia
  • +221 Senegal
  • +381 Serbia
  • +248 Seychelles
  • +232 Sierra Leone
  • +65 Singapore
  • +421 Slovakia
  • +386 Slovenia
  • +677 Solomon Islands
  • +252 Somalia
  • +27 South Africa
  • +82 South Korea
  • +211 South Sudan
  • +34 Spain
  • +94 Sri Lanka
  • +249 Sudan
  • +597 Suriname
  • +46 Sweden
  • +41 Switzerland
  • +963 Syria
  • +886 Taiwan
  • +992 Tajikistan
  • +255 Tanzania
  • +66 Thailand
  • +670 Timor-Leste
  • +228 Togo
  • +676 Tonga
  • +1 Trinidad & Tobago
  • +216 Tunisia
  • +90 Turkey
  • +993 Turkmenistan
  • +688 Tuvalu
  • +256 Uganda
  • +380 Ukraine
  • +971 UAE
  • +44 United Kingdom
  • +1 United States
  • +598 Uruguay
  • +998 Uzbekistan
  • +678 Vanuatu
  • +58 Venezuela
  • +84 Vietnam
  • +967 Yemen
  • +260 Zambia
  • +263 Zimbabwe
✓
You're booked!
We'll send a confirmation to your email and a Google Meet link before the call.