Reusable System Design
Event Completion Window
A UI pattern answering: Progress, Remaining Tasks, Rewards, Completion Value. Now standard across all events.
Role
Game Designer
Status
Shipped · Standardized
Tools
Figma, Jira, Confluence
Recreated UI Mockup
Event Completion Window
A reconstructed event window based on the shipped pattern: category list on the left, active objective and rewards on the right, with progress and urgency visible at a glance.
Layout is recreated from the live-game UI and rewritten with generic placeholder content.
General rewards
Shared event rewards
Mission chain
Primary completion path
Completion track
Selected objective panel
Bonus tasks
Optional stretch goals
Logbook
Event rules and timing
Season Event Completion
Finish the main event chain to unlock the completion reward bundle and the final state badge.
Completion track
Complete the following tasks to earn the guaranteed reward package.
Guaranteed:
x10,000
x5
x12
x3
x20
x1
x250
x1
What have I already completed?
The selected entry shows finished steps and remaining requirements in one place.
What is left to do?
A task list and progress bars make the next action readable without opening separate windows.
What do I get for finishing?
Guaranteed rewards are visible before commitment, so the completion value is explicit.
Can I still miss anything?
The timer and completion state clarify urgency before the event window closes.
Context
- The Event Completion Window started as a response to a simple player problem: people could join an event without understanding how close they were to finishing or what the final reward package actually was.
- Because Seafight runs a constant event cadence, the stronger opportunity was to design a reusable pattern rather than a one-off screen.
Problem
- Players could participate in events without clearly understanding completion progress or remaining rewards.
- Small events needed stronger goals without requiring bespoke UI every time.
- The team needed a scalable pattern for future live events.
My role
- Game Designer
- The feature had to fit existing event structures and UI conventions.
- It needed to be reusable across different event types, not just one bespoke release.
- The pattern had to improve clarity without adding noisy UI to an already dense game.
Design decisions
- Centered the UI around four player questions: progress, remaining tasks, rewards, and completion value.
- Defined reusable states so the pattern could support different event structures without bespoke redesign each time.
- Kept the layout compact so the feature added guidance without increasing UI noise in an already dense MMO interface.
- Documented reward visibility, progress rules, and edge cases for repeatable event adoption.
Outcome
- Designed the Event Completion Window for Seafight events.
- The feature became the standard event-UI pattern and is now used in every event.
- Made completion progress, remaining tasks, and guaranteed rewards easier to understand at a glance.
What this shows
- The Event Completion Window became Seafight's standard event-UI pattern and is now used in every event. That makes it one of my strongest examples of a small decision becoming durable infrastructure.
- It improved player understanding in the moment and reduced the need to solve the same UX problem from scratch for each future event.