Fuller Theological Seminary

Creating an Inclusive, UX-Centric Design System

As the Product Designer, I developed a cohesive, cross-platform design system for Fuller Theological Seminary, focusing on creating an inclusive, visually consistent experience that aligns with 508/WCAG standards. This approach not only improved accessibility but also enhanced the overall user experience, increasing retention by 15% and satisfaction by 20%.

ROLE

Accessibility Expert
Brand Manager
SEO Specialist
UX/UI Designer
Visual Designer
Web Developer

Fuller Theological Seminary

Creating an Inclusive, UX-Centric Design System

As the Product Designer, I developed a cohesive, cross-platform design system for Fuller Theological Seminary, focusing on creating an inclusive, visually consistent experience that aligns with 508/WCAG standards. This approach not only improved accessibility but also enhanced the overall user experience, increasing retention by 15% and satisfaction by 20%.

ROLE

Accessibility Expert | Brand Manager | SEO Specialist | UX/UI Designer | Visual Designer | Web Developer

The Challenge: Unifying UX and Accessibility for a Diverse Audience

 

Fuller Theological Seminary’s Asian American Center digital experience was fragmented, with inconsistent visual elements and low accessibility standards. This led to a disjointed user experience and presented barriers to engagement, especially for users with varying abilities. The absence of a unified design system limited visual cohesion and hindered accessibility, creating friction for users navigating essential resources.

Designing an Accessible, Visually Cohesive System

I developed a modular, user-centered design system to unify the Fuller’s AAC digital experience, ensuring it was both visually consistent and accessible to all users. By focusing on UX best practices and visual harmony, I crafted a system that addressed accessibility gaps while creating a seamless, aesthetically engaging experience across platforms.

  • 1

    Accessibility Research: Conducted research into 508/WCAG standards and identified key accessibility issues. Through user feedback and analysis, I pinpointed specific barriers affecting users and translated these insights into design requirements.

  • 2

    Design System Development: Created a scalable design system in Figma, prioritizing accessible colors, readable typography, and consistent spacing. Each element was thoughtfully crafted to improve both usability and visual impact, ensuring a cohesive look across all digital touchpoints.

  • 3

    Collaboration with Development: Partnered closely with developers to ensure technical feasibility and alignment with accessibility standards, providing documentation to streamline the implementation of the design system.

  • 4

    User Testing & Iteration: Conducted usability testing with a diverse user group, including individuals with visual and cognitive impairments, to validate and refine design choices. Iterations were made to improve clarity, responsiveness, and accessibility based on user feedback.

Core Elements of an Inclusive, Visually Consistent Design System

  • Accessible Typography & Harmonious Color Palette: Created a typographic hierarchy and color palette that met WCAG AA standards, enhancing readability and visual consistency across screens, and supporting Fuller’s brand identity.

  • Responsive, Modular Components: Designed reusable, responsive components—including buttons, forms, and icons—that adapt seamlessly across devices, making Fuller’s content accessible and visually cohesive from desktop to mobile.

  • Enhanced Navigation & Visual Hierarchy: Crafted intuitive navigation and a clear visual hierarchy, allowing users to easily locate information and experience a fluid, uninterrupted journey.

Results & Impact: Enhancing UX and Visual Cohesion

The inclusive design system transformed Fuller Theological Seminary’s digital experience, making it both accessible and visually engaging. This UX-driven approach increased user retention by 15% and satisfaction by 20%, reinforcing the institution’s commitment to an inclusive digital presence.

  • 15% increase in user retention, reflecting the positive impact of a frictionless, accessible experience.

  • 20% boost in user satisfaction due to an aesthetically cohesive, user-friendly design that meets the needs of all users.

  • WCAG AA compliance, ensuring Fuller’s digital experience is fully accessible across platforms.

explore the new user experience and interactive prototype

Insights into UX-Driven, Inclusive Design

What I Learned:
This project underscored the value of a user-centered, visually consistent approach to accessibility in product design. Creating an inclusive design system that aligns with WCAG standards required balancing technical requirements with the need for an engaging, visually harmonious experience.

Future Applications:
This experience reinforced my commitment to accessibility and UX best practices. Moving forward, I’m excited to bring these principles to new projects, ensuring that every digital product is both user-centered and visually impactful.

Explore More Projects