Rogers.com

Created a three-step spacing system for Rogers.com to unify layouts, improve readability, and streamline design to dev workflows.

Role:
• UX & UI Design Research
• Design System Contribution
• Cross-Team Collaboration
• Tool Development & Documentation

How It Started

The project began with an in-depth competitive analysis of other websites to identify common spacing practices and establish a baseline for consistent, readable layouts.

The Approach

Defined small–medium–large spacing values from research, collaborated with design/system teams, and integrated tool into design system for site-wide consistency.

The Result

Unified Design System Standards

Established three-step spacing framework that improved readability, streamlined design-to-development handoffs, and created scalable consistency across Rogers.com properties.

Simplified Workflow

Developed plain-language tool that speeds up design and development processes, ensuring consistent spacing values across teams without conversion errors or miscommunication.

The three-step spacing system is now a core part of the Rogers.com design system, making every page more consistent, readable, and visually balanced.

Tools:
• Figma
• Design System Documentation
• Competitive Research
• Collaboration Workshops

All projects