My Role: UI Designer.
Tools: Fireworks, InVision, Adobe Creative Cloud.
For the Citi Employee Fitness Challenge, I designed an interactive gamification platform that transformed complex health data and leaderboards into an intuitive digital dashboard. By translating high-density fitness metrics into scannable data visualization modules, I delivered a responsive grid that ensured seamless cross-device participation for thousands of employees while perfectly balancing Citi’s corporate identity with modern wellness aesthetics.
The Challenge
Data-Heavy Dashboarding: Ingesting real-time fitness metrics, step counts, and department leaderboards into a single unified dashboard without causing visual fatigue.
Corporate vs. Engagement Balance: Designing within the rigid framework of financial corporate standards while creating an exciting, motivational, and fitness-forward user experience.
Seamless Scalability: Ensuring the complex dashboard interfaces, interactive graphs, and data cards scale perfectly across desktop browser frames and mobile views.
Strategy & Information Architecture (IA)
Gamified Information Hierarchy: Structured data around core motivational triggers—highlighting personal goals, team rankings, and upcoming milestones prominently at the top.
High-Contrast Data Design: Utilized vibrant, purposeful accent covers to differentiate distinct data sets, progress rings, and performance graphs against a clean, premium background.
Component-Driven Dashboard: Built an ultra-flexible grid system using modular card components to dynamically adapt based on active challenge phases.
Design Exploration & Solutions
Fireworks-Crafted UI Assets: Leveraged the unique vector-bitmap hybrid power of Adobe Fireworks to rapidly iterate on dense dashboard UI layouts and pixel-perfect chart elements.
Interactive InVision Prototyping: Utilized InVision to transform static visual frames into a clickable, high-fidelity interactive prototype, ensuring seamless UX flow validation with corporate stakeholders before development.
Vibrant Visual Identity: Infused energetic design accents and custom iconography into the platform, perfectly balancing Citi's professional brand integrity with a dynamic wellness aesthetic.
Business Impact & Reflection
B2E Product Insight: Gained deep experience in building corporate-facing products (Business to Employee) where design directly impacts employee wellness, engagement, and company culture.
Rigorous UI Standardization: Proven capability to execute highly creative and motivational interface designs within the strict boundary requirements of global financial institution standards.
