Skylight Design System
PennyMac Loan Services, LLC
Creative Brief
Pennymac’s library of reusable components, patterns and design standards to ensure scalability across the product ecosystem. Our team met regularly to collaborate on component usage, structure and guidelines. Contributing to and maintaining Skylight was a key function for our team.
My Contributions
I spent a significant amount of time researching how to incorporate a solid user experience writing guideline into an established design system. Conducting rounds of team agreement meetings and documenting writing best practices led to a great foundation for the team to build upon. I created and documented usage standards for avatar, notification, badge, file uploader, color styles, and several more. I conducted internal user interviews with the design team to identify pain points and explore options for improving ease of use.
Tools
Toast
Everyone loves a good toast notification! I updated our notification component, which included multiple variants, color and size adjustments, and interaction patterns. Documenting and sharing this with our design team was both challenging and rewarding.
Avatar
Avatars are an important component for all users, so it was essential that I thoughtfully craft the way in which we will use it.
File Uploader
The file uploader needed an additional compact size as well as slight adjustments to spacing. I took the opportunity to document usage best practices while I was at it.
Colors
I refactored our colors page in Skylight to include contrast ratios for each to ensure AAA or AA scores.
