Nonprofit SaaS Platform
Modernizing a complex nonprofit SaaS platform into a unified, task-focused experience.
Brick River is an all-in-one nonprofit SaaS platform used by 5,000+ staff to manage communications, fundraising, websites, events, contacts, and organizational data.
I led the platform redesign to simplify navigation, modernize the interface, and create a more consistent, intuitive experience. A major focus was reorganizing the platform around task-based Centers, making it easier for users to find the tools they need and complete everyday workflows.
Design QuestionHow might we modernize a legacy platform into a unified, task-focused experience that simplifies workflows and supports scalability?
Key Contributions
Simplified Navigation
Reorganized the platform around task-based Centers, making common workflows easier to find and understand.
Scalable Design System
Built reusable components and UI standards to improve consistency and support future growth.
Modernized Interface
Transitioned from Bootstrap toward Tailwind CSS while continuing to support legacy features.
Improved Complex Workflows
Introduced a collapsible sidebar, improved tables, filtering, and interaction patterns to simplify everyday tasks.
More Approachable Experience
Introduced friendlier language, custom illustrations, subtle color, and clearer feedback to make the software feel more human.
Navigation relied on lengthy dropdown menus, making it difficult to find tools and understand where features belonged.
Long cluttered menus
Reorganized tools into dedicated Centers with a collapsable sidebar navigation, making everyday workflows easier to find and manage.
Task based centers
Design System
To keep the platform consistent as it grew, I built and maintained a reusable design system that served as a shared reference for design and development.
Using Material Design as a starting point, I adapted components and interaction patterns to fit Brick River's workflows and visual language. I also created a Tailwind CSS color palette to keep styling consistent and support faster front-end development.
The system brought together reusable components, interaction states, and UI standards, making it easier to build new features while maintaining consistency across the platform.
The original login had a dated layout and basic username and password authentication, with no additional security verification.
Legacy Login
Updated the login experience with a cleaner layout, improved form hierarchy, and two-factor authentication for added security.
Redesigned Login
The Process
Start With How People Actually Work
Talking with nonprofit staff helped me understand where they got stuck, what they struggled to find, and which tasks mattered most. Those conversations directly shaped the redesign.
Design for the Whole System
Because Brick River includes many connected tools, I had to think beyond individual screens. New patterns needed to work across different workflows while still feeling familiar.
Work Within Legacy Constraints
The platform couldn't be rebuilt all at once. I designed new experiences that could coexist with older parts of the product, allowing us to improve the interface gradually without disrupting existing users.
Keep Iterating
The redesign continued to evolve as we gathered feedback from users and developers and introduced new features.
The legacy sitemap made it difficult to distinguish published, hidden, and parent pages at a glance. Without a clear search function, users had to dig through collapsible menus to find and manage individual pages.
Legacy Website Sitemap
The redesigned sitemap introduced color-coded status labels, search, and a quick-edit panel to make pages easier to find and manage. Bringing everything into the Websites Center also gave users convenient access to related actions, including editing pages and viewing the live site.
Redesigned Website Sitemap
Brick River Website: Matching branding for each center used as a marketing tool.
Contacts Center: Manage people, interactions, and donor data with search and filtering tools.
Communications Center: Manage and publish content across websites, brands, and public pages.
Registration Center: Create registrations, collect payments, and track participant data.
Donations Center: Manage campaigns, donor activity, and fundraising information in one place.
Email Center: Create, send, and review email campaigns through a clearer workflow.
ConclusionThe Brick River redesign brought more clarity and consistency to a large, evolving software platform.
By organizing the experience around real user tasks and creating reusable patterns across the product, I helped make the platform easier to navigate while giving the team a stronger foundation for future development.