CASE STUDY

The N3TWORK

Building a Unified Social Ecosystem for Mobile Gamers

Role: Lead Product Designer
Timeline: 2017 – 2020
Key Platforms: iOS, Android, Web, CMS, Marketing Web

1. The Challenge: The "Out-of-Game" Fragmentation

In 2017, N3TWORK noticed a critical leak in user engagement: high-value "Guild" players were organizing on external apps like Discord, WhatsApp and Line to coordinate strategies for Legendary: Game of Heroes.

The Goal: Create a proprietary community tool that kept communication, strategy sharing, and official game updates within the N3TWORK ecosystem.
The Core Question: How do we offer more value than established giants like Discord or WhatsApp to make players switch?

2. The Strategy: Identifying the Value Gap

I led a small "tiger team" (5 engineers + product owner) to define our MVP. Through user interviews, we identified that players didn't just want "another chat app"—they wanted a knowledge base.

The Engagement Loop: I developed a task analysis focusing on a "Question & Answer" framework.

For New Users: Frictionless path to seek expert advice.
For Veterans: Incentives to share knowledge and feel valued within the community (Status/Reputation).

Paper sketch of an engagement loop. We often use whiteboards or paper to visualize different frameworks during brainstorming sessions.

3. The Execution: A Multi-Platform Design System

As the solo designer for the first several years, I had to ensure consistency across iOS, Android, and Web.

From Paper to Figma: I used low-fidelity paper sketches to validate "engagement loops" before moving to high-fidelity prototyping.
The Design System: To stay lean, I built a "state-of-the-art" design system. This allowed us to iterate 2x faster, as we could build complex screens using pre-validated components.
Functional Specs: I implemented a rigorous "Functional Spec" documentation process, which became the "source of truth" for QA and Engineering, reducing hand-off friction and bug reports.

Early concepts of the question list section. The concepts got more refined from left to right as we learned what worked and resonated.

4. Feature Spotlight: The "Questions" Engine

The pivot from a simple chat tool to a community powerhouse was the Questions Section.

The Problem: Tribal knowledge was getting lost in the "noise" of fast-moving chat threads.
The Solution: A searchable, up-voteable Q&A hub. I iterated through multiple list views to find a layout that prioritized "solved" status and expert visibility.

Quick demonstration based on a prototype how voting up an answer or asking a new question can work. For the past two years we've used Figma exclusively: flow diagrams, design system, detailed screen designs, prototypes as well as functional specs.

It's been extremely helpful for everyone on our team to have these detailed spec docs. It allows us to look back on older features and recall the decisions we made at the time and understand why we sometimes need to iterate on them based on new insights.

5. Outcomes: Scaling the Community

What started as a small internal experiment evolved into the primary communication hub for tens of thousands of users.

📈 Massive Engagement & Retention: The launch of the centralized community hub led to a 12% increase in D30 retention and boosted average user engagement by 34 minutes per day, effectively capturing the time previously lost to external platforms like WhatsApp and Discord.
📱 Native Dominance: Successfully launched and maintained top-rated iOS and Android apps, with every screen personally designed from inception.
🛠 Internal Tooling: Designed a custom CMS that empowered the Media Team to manage video announcements directly, bypassing the need for engineering support for weekly updates.
🌐 Brand Presence: Launched a comprehensive marketing site that serves as the primary acquisition funnel for new game partners.

Snapshot of our newly created, state of the art design system. Creating the detailed screens for each state and interaction is significantly faster having a robust design system to draw from.