SKY UX Design System

Summary

Blackbaud created the SKY UX Design System to help designers and developers build consistent user experiences by leveraging standard components, interaction patterns, and styling.  The design system is open-source and is leveraged by both internal and external consumers. I joined the SKY UX design team in 2021 to assist in both the maintenance and evolution of the design system to improve the consumer experience of working with SKY UX.  This includes updating component and design guidelines, creating proposals for new components or updates to component functionality, and conducting research with consumers of the design system to evaluate opportunities for improvement.

This page documents several of the projects that I worked on as a member of the SKY UX design team. Many of the specifics regarding my work at Blackbaud are protected under NDA but I am happy to speak on my experience working on a design system team at a high level.

My Role

UX Designer

Duration

July 2021 - Mar 2023

Responsive Toolbar Behavior

The responsive behavior of the toolbar component was lacking in standardization which resulted in inconsistent implementations of how toolbars would respond down at different media queries.  After conducting an inventory of responsive toolbar behaviors across the portfolio of SKY UX Blackbaud experiences, I completed a proposal for an updated responsive behavior for toolbars that would progressively collapse toolbar buttons and dropdowns into a context menu as the width of the viewport shrinks.  

Help Inline Injection

To simplify the process of leveraging the help inline user assistance pattern, I provided the SKY UX engineering team with specifications for how the help inline button would appear when used in combination with supported components.  The SKY UX engineering team has since used these specifications to update components with first-hand support for the help inline button.

Page Layout Implementation Support

Page layouts have been a longstanding area of inconsistent implementation across teams utilizing SKY UX.  In order to ensure a consistent user experience of the various SKY UX page layouts, I developed a strategy to reconcile how page layouts are implemented through the creation of custom properties that feed regular specifications for page section padding and spacing based on factors such as page layout, media query, and visual theming.

Internal Design Artifact Discovery

The SKY UX team regularly conducts research with the internal consumers of the design system to measure the usability and perception of the design system.  Based on findings from our annual survey of internal consumers, I led an effort to further investigate how designers and developers on project teams collaborate on designs using the SKY UX design system and how we might be able to reduce team friction in the creation and handover of SKY UX design artifacts. I designed a research plan to interview designers and developers across project teams at Blackbaud, conducted thematic coding on the qualitative data gathered from the interviews, and identified several key insights that will be used to guide further action and measurement to reduce team friction and improve developer efficiency when implementing SKY UX designs.