Creating a unified integration onboarding framework to reduce setup time and standardize integrations.
Client
Red Canary
Shipped
Q4 2024
Tags
Close UX loopholes
Design Strategy
Project summary
I led a platform-wide redesign of integration onboarding, creating a unified, reusable framework that standardizes workflows across all alert sources. This effort improved efficiency for customers, accelerated new integration delivery by ~20%, and reduced support overhead, while establishing a scalable foundation for future growth.
My role
Owned the end-to-end design process for external alert source integrations.
Advocated for UX improvements and aligned PMs and engineers on scope.
Oversaw handoff to engineering, ensuring consistent implementation.
The problem
Red Canary has over 100 integrations and only about 30% of them were using the right patterns. The remaining 70% of integrations had fragmented, confusing, and inconsistent UXs that were causing a lot of confusion for our customers and eroded overall confidence in the product. We also were receiving a fair amount of support tickets that were attributed to these issues as well.
Core pain points
Integration onboarding flows varied significantly across products.
Integrations appeared “active” before ingesting data.
External alert sources behaved differently from true external services.
The solution
Unified all integration onboarding experiences into a single, predictable, user-friendly workflow. Created reusable design patterns and frameworks for consistency and scalability. Collaborated with PMs and engineers to define standards that could be applied across multiple products, making onboarding repeatable and maintainable at scale.
How we solved it
8 Weeks
Project time
5
Major iterations
14
Team size
How we started
To solve this problem, we needed to do a few things before we even touched figma. To start, we needed to map out all of the different types of integrations and categorize their flows. Some would fit into the “good” pattern that we want to proliferate, others fit into “bad” 1-off patterns or outdated versions that we needed to sunset. This was arguably the hardest part of the whole project.
Map it all out first
After we had our mapping done, the next phase was to dig into the “bad” flows and figure out how we can fit them into our new gold-standard. Some integrations would translate really well, while others would need a lot more finessing in order for them to make sense in their new home. The key goal here was to ensure that these integrations still felt familiar, and customers who were already used to these “bad” patterns would still be able to make sense of them once we standardized them. We had to test this quite a bit both internally and externally to make sure we got it right.
Now we can finally design! Since this project is a migration, we already knew what the rough UX should look like here. We had our gold-standard experience that we’re applying here, so all that's left is to start mocking things up. The goal here was to give engineering enough variety so that all the different use cases were covered.
Handoff
For projects of this scale, the engineering handoff is very hands-on. My mission was to have frequent check-ins with the developers to make sure the different variations were all correct and using the right design components. We would compare this to the existing integrations that were already using the right patterns as a sanity check. Overall this part went surprisingly well, we hit a couple snags along the way in terms of QA, there were so many integrations to go through it's easy to miss the little things (looking at you field hints).
Customer impact
Reduced onboarding time by ~20%, accelerating time-to-value for customers.
Streamlined workflows and decreased support tickets, freeing teams for higher-value work.
Established a scalable framework that accelerated future integration development.
Increased customer confidence and adoption across the platform.
Lessons learned
Know when to expand scope. Sometimes what's written in the epic doesn't fully solve the problem and deliver the best experience.
When making big, systemic changes, be thorough and shop it around to as many folks as possible. You never know what you might have missed.
Slow roll the release if you need to. It's alright to roll out big changes slowly and catch any use cases/bugs you might have missed earlier.