

Store Revamp
A redesigned shopping experience
for Discovery, Scalability & Clarity

What is Star Wars: Galaxy of Heroes?
The #1 Star Wars mobile game of all-time!
1
2
Build your squad
Level up your characters
Defeat enemies
Win rewards


Store Importance
Progression Backbone
Monetization Backbone
+



Why Store Revamp?
New Players
Spend when
value is clear
Deal-driven Spenders
Spend only on
compelling offers
Heavy Spenders
Decisive buyers
& spend weekly
Store visits %
Pack click through %
Store conversion %
Opportunity
Opportunity

Click to see screensStore Overview
Part 1: Storefront
Part 2: Pack Details

Research
Analyzing the Current Experience
High-value Offers Lacked Visibility
Uniform modules made promotional and priority packs harder to discover.
Low Pack Info Readability Slowed Browsing
Low contrast between cover art and text reduced readability.
Navigation Created Interaction Friction
Top navigation was harder to reach and limited future category expansion.
The Browsing Model Limited Discoverability
Horizontal scrolling reduced content visibility and made offer comparison less efficient.
Text-dependent Mechanics Increased Cognitive Load
Players had to read long descriptions to understand pack mechanics before purchasing.
Unclear Grouping Reduced Pack Clarity
Players struggled to understand which items belonged together.

Goals
Part 1: Storefront
Part 2: Pack Details
Improve Discoverability & Layout Scalability
Improve Information Clarity

Part 1: Storefront
Improve Discoverability & Layout Scalability
Part 2: Pack Details
Improve Information Clarity


UX Patterns Research
- Align interactions with thumb reach in landscape
- Vertical layouts improve scanability
- Larger modules create stronger visual hierarchy
- Clear visuals and item details increase perceived value

Vertical Tab Bar
Thumb-friendly navigation & scalable
layout for content-rich stores
VS
Vertical nav for
reachability
Icons for
clarity
Space for
scalability
Large
Default
Mini
Exploration on Module Sizes
Adapting layout to promote high-value
offers while optimizing screen space



Scrolling Exploration: Horizontal vs. Vertical
VS
Horizontal Scroll
Less intuitive, harder to scan, poor for mixed-size content
Vertical Scroll
Familiar, efficient, better for hierarchy and thumb reach

Refined Pack Modules
Empowering Pack Promotion, enhancing
Value Perception & IP Expression
Art Presentation:
Expanded art area to
showcase IP fantasy &
boost engagement
Item Preview:
Added item preview
to clarify pack value
and increase appeal

Refined Pack Modules
Expanded module, optimized for
space & backward compatibility
After
Before

Refined Pack Modules
Enable quick recognition of offer type
Enhanced
Readability
Timer:
Uniform timers =
faster recognition,
stronger urgency.
Storefront – Final Design Showcase
Improve Discoverability & Layout Scalability


Before
After

Part 1: Storefront
Improve Discoverability & Layout Scalability
Part 2: Pack Details
Improve Information Clarity

Why It’s Unclear?
Various Pack Mechanics,
BUT One Rigid UI Layout









What Pack Mechanics Do We Have?
Flat Offer
What You See Is
What You Get
Gacha
Chance-Based
Drops

Flat Pack: All items
guaranteed
Trove Gacha: Random item,
fixed quantity
Grouped Gacha: Random item
group, fixed quantity
Multi-Card v2: Each card = random
item from a set, fixed quantity
Hybrid Gacha: Flat + Gacha
Single Item Gacha: fixed
item, random quantity
Multi-Card v1: Each card =
fixed item + random quantity
Random Gacha: Random item
+ random quantity

















Decoding Pack Mechanics —
Mapping 8 Pack Types
into 4 UX Quadrants
Collaborated with PMs to identify
categories, top sellers, value tiers, and edge
cases that shaped our design framework,
classifying packs by reward logic to support
information design in pack details.
Fixed Item
Random Item
Fixed
Quantity
Random
Quantity

Fixed
Item
Random
Item
Fixed
Quantity
Random
Quantity
Highlighting High-Value Fixed Packs
Standardizing Randomized Pack Presentation
Improving Information Grouping
Structuring Pack Design Through UX-Driven Classification


Pack Details – Final Design
Before
After


Promotion Popup Revamp
An upgraded popup module to highlight spotlight offers
Before
After

Phased Rollout & Business Impact
Balancing UX impact, development cost, revenue
impact, and user adoption
Metrics omitted for confidentiality. Happy to walk through results in conversation.
Success Metric
Category Discovery Rate
Time to First Pack View
Success Metrics
Store Visits
Pack Click
Through Rate
Success Metric
Store Conversion Rate
Phase 1: Fix the Interaction (Ergonomics)
Improve navigation scalability (Vertical Tabs)
+ Revamp promotional popups.
Phase 2: Fix the Hierarchy (Layout)
Enhance storefront discoverability
(Tetris Module Storefront).
Phase 3: Fix the Clarity (Cognitive Load)
Improve pack detail clarity (Gacha Matrix
UI Implementation).











