Jan 2026 - Present
Product Design Intern
4 months
OxBlue
The project itself :
Project Overview
My tenure at OxBlue has been defined by a transition from traditional UI architecture to a future-forward, AI-integrated design methodology. I began by establishing a robust Design System to ensure product-wide consistency and have since evolved my workflow to leverage Claude and the Figma MCP. This "vibe coding" approach allows me to build fully functional, logic-driven prototypes that bridge the gap between static design and production-ready code, directly enhancing the quality of user testing and the precision of developer handoff.
Phase 1:
Establishing the Blueprint
Design System Architecture & Scalability
The first phase of my work focused on creating a unified visual and functional language for OxBlue’s suite of tools. By moving away from fragmented UI elements, I built a scalable foundation that empowers the team to design with speed and precision.
Atomic Component Library: Developed a centralized library of reusable components, ensuring a cohesive user experience across all platforms.
Standardized Documentation: Established clear guidelines for typography, color theory, and spatial systems to minimize design debt.
Systemic Consistency: Bridged the gap between legacy features and new product modules, ensuring a seamless visual transition for the end-user.
Phase 2:
Workflow Transformation
AI-Augmented Design with Claude & Figma MCP
As the design system matured, I shifted my focus toward optimizing the design-to-development pipeline. By integrating Claude and the Figma Model Context Protocol (MCP), I transformed my workflow into a highly efficient, logic-first process.
Vibe Coding in Figma: Leveraged AI to automate repetitive layout tasks and generate component variations, allowing more time for high-level UX strategy.
Logic Integration: Used Claude to manage complex state changes and data structures within the design environment, moving beyond simple visual styling into functional orchestration.
Phase 3:
High-Fidelity Validation
Functional Prototypes for User Testing
Standard "click-through" prototypes often fail to capture the nuances of a real application. To solve this, I now build fully functional prototypes that simulate actual product behavior.
Realistic User Testing: By injecting real logic into prototypes, my team can conduct user testing sessions that uncover deep usability insights regarding state management and edge cases.
Data-Driven Interactions: These prototypes use simulated data, providing stakeholders with a tangible "preview" of the final product long before it hits production.
Phase 4:
The New Handoff Standard
Interactive Blueprints for Engineering
The final stage of my process focuses on eliminating the "guesswork" traditionally associated with Developer Handoff.
Precision Blueprints: Instead of static specs, I deliver interactive prototypes that serve as a source of truth for both UI and conditional logic.
Reducing Implementation Friction: By providing functional logic alongside visual assets, I have significantly shortened the feedback loop with the engineering team.
Direct Dev Synergy: This approach ensures that the final implementation is a pixel-perfect match to the intended user experience, reducing the need for post-development polish.