Events & Promotions Progress Tracker Redesign
A global design system and content standardization personal initiative to simplify progress tracking for independent distributors across all regional markets.
May 2024
Project Summary
Categories
- UX Design
- UI Design
- Design Systems
- Ecosystem Unification
Methods & Tools
- Figma
- UserZoom
- User Research
- Content Strategy
- Usability Testingc
- Stakeholder Alignment
- Requirements Mapping
- Microcopy Standardization
The Problem
In parallel with a major enterprise rebranding, our global promotion trackers experiences suffered from severe visual and content inconsistency. Because regional business teams independently modified copy and design elements without approval or guidance from the UX department, distributors faced ambiguous requirement descriptions, inconsistent status labels, and conflicting tracking logic. This lack of standardization created user confusion and excessive maintenance, translation, and development efforts across all markets.
The Process
To align both user expectations and global business requirements, the project followed an iterative, collaborative process:
User & Stakeholder Discovery
Conducted deep-dive discovery sessions to uncover distributor pain points regarding ambiguous qualification criteria, while hosting cross-regional alignment meetings with Product Owners, Business Analysts, and Localization teams.
Content & Logic Standardization
Partnered with stakeholders through weekly workshops to establish a unified text and descriptions repository, eliminate negative framing (e.g., replacing “Failed” or “Not Qualified” with clear, neutral indicators like “Not Achieved”), and streamline complex string templates.
Iterative Prototyping & Testing
Developed early wireframes and scalable component specs, validating design proposals through rapid feedback loops and Usability Testing with UserZoom to ensure accessibility across key target scenarios.
The Result
This iterative process resulted in a robust, highly customizable master component within the global design system, complete with standardized string formats and predefined status logic. To ensure a seamless engineering hand-off, I established clear component specifications and a centralized copy repository for dev, QA, and localization teams—significantly streamlining implementation, accelerating multi-language translation workflows, and lowering long-term maintenance across global regions.
UI Design Proposals
The redesigned UI introduces a responsive, mobile-first design system for promotion pages, bridging functional tracking with clear visual status signaling. Designed seamlessly across mobile and desktop viewports, the interface breaks down complex qualification paths into intuitive, modular cards. Dynamic status indicators instantly inform distributors of their current status—whether a requirement is In Progress, Achieved, or Not Achieved—using distinct visual hierarchies, standardized microcopy, and real-time progress bars to reduce cognitive load and drive engagement.
Micro-animations
To celebrate user milestones and boost motivation, key micro-interactions were prototyped directly in Figma. When a distributor completes a qualification level, a subtle, rewarding micro-animation triggers to unlock a newly achieved badge or medal. These micro-interactions provide tactile visual feedback, transform routine progress checks into delightful gaming-inspired moments, and encourage users to reach their next milestone.
