Redesigning Crayon's onboarding experience
What began as a navigation redesign evolved into a comprehensive onboarding overhaul, reducing support requirements while empowering users to self-service their competitive intelligence ecosystem.
Expand
Team
Members
- Main designer (me)
- Team of 4 developers
- Product Manager
- Chief Product Officer
My role
- Discovery
- Prototyping
- Usability testing
- Feature launch
Problem
The original ask was simple: Redesign the navigation.
However, once I started digging into Crayon’s platform, it became clear that navigation wasn’t the root problem. Behind it was a tangle of onboarding friction, underused features, and unclear value delivery.
We needed to help users activate the power of Crayon's competitive intelligence platform without requiring hand-holding from customer success.
Discovery
To understand the experience more holistically, I partnered with Product to gather data on the following.
- Customer feedback from Productboard
- Heap analytics on feature usage
- Interviews with customer success team members
Key findings
- Onboarding dependency. New users relied heavily on customer success due to empty default states and a lack of guidance
- Interface redundancy. “My Feed” and the main Insights page were nearly indistinguishable, creating confusion in core navigation
- Unscalable workarounds. Quick links were a stopgap solution that had gained widespread adoption, but this temporary fix didn’t scale with user growth
- Cluttered navigation. Underused features like “Team Activity” occupied prime space in the navigation, distracting from the platform’s core value drivers
- Hidden features. Critical capabilities—like integrations and Saved Searches (which powered email alerts)—were difficult to discover and poorly explained
The platform had grown organically over six years into what I call a “Frankensteined” structure, with redundant elements, vestigial pages, and critical workflows buried in admin-style layouts.
Furthermore, new users were dropped into a blank “My Feed” page. The CTA assumed familiarity with “Saved Searches,” a core feature most new users would not understand.
Reframing the problem
Crayon's issues stemmed from more than just navigation problems. They were rooted in onboarding friction and unclear value delivery.
This wasn’t just a design issue; it was a perception gap. How could we help users feel Crayon’s value from the start?
Strategy
To answer this question, I reorganized the problem into three strategic opportunity areas.
Navigation and onboarding
- First-session activation. Guide users to meaningful action on their very first visit
- Content differentiation. Create clear delineation between "My Feed" and "Search All Insights"
- Value driver education. Introduce Saved Searches as a powerful, accessible tool
Feature clarification
- Structural coherence. Replace organic growth with intentional organization
- Scalable solutions. Eliminate workarounds like "quick links" that masked deeper issues
- Real estate optimization. Prioritize high-value features in prime locations
Integration ecosystem
- Self-service facilitation. Enable email digest setup without customer success intervention
- Discoverability enhancement. Surface integration options within natural user flows
- Philosophy alignment. Fulfill Crayon's promise to "meet users where they are"
Solution
Competitive analysis
I began with low-fidelity sketches exploring horizontal tabs, vertical menus, and hybrid structures. After feedback from the CPO that the sketches were too similar to the existing design, I conducted additional competitive analysis beyond feed-based platforms.
During this second round of iteration, what stood out was a dropdown model that was light and modern while preserving context.
I conducted competitive analysis of navigation models from feed-based platforms and beyond
Early sketches and higher-fidelity iterations of the navigation redesign
Navigation transformation
This led to a two-panel dropdown navigation featuring the following improvements.
- Menu item consolidation. Consolidated the main navigation items into a scalable, elastic-searchable dropdown with hover states and expansion options
- Taxonomy clarification. Replaced ambiguous labels with clearer alternatives (e.g., "New Search" to "Search All Insights", "My Feed" to "Following")
- Streamlined actions. Simplified creation of Saved Searches and clarified their connection to the daily email updates that the users valued
Feature-value clarification
- Navigation simplification. Removed low-usage elements like “Team Activity” based on analytics and testing
- Quick filter KPI cards. Introduced visual cards for commonly used filters
- Onboarding flow improvements. Replaced blank landing pages with pre-populated Insights and added guided tooltips
Integration focus
- Gong integration. Designed end-to-end experience for a strategic integration partnership between Gong and Crayon
- Discovery enhancement. Boosted discoverability of integrations through visual cues
- Component library addition. Created a tailored dropdown selector that was added to the shared design system
User testing
With the redesigned navigation and onboarding prototyped, we turned to user testing.
I validated designs through two rounds of testing: first with four customer success employees, then with four external customers.
Key findings
- The dropdown was immediately understood as interactive
- Landing users on a page with the dropdown already open confused users, and we reverted to landing on "Search All Insights"
- Tooltips in the "Follow" button helped users connect it to daily alerts
- Users intuitively grasped the starring mechanism for Saved Searches
- Removal of low-usage items was not noticed
- Terminology changes like "My Feed" to "Following" tested positively
- Quick-filter KPI cards saw strong engagement but had to be scaled down in scope due to technical constraints
I had discoverability concerns around the navigation dropdown and tested it pre-opened. It did not test well, and further user testing showed users understood the closed dropdown intuitively.
Just by putting the email explanation inside the 'Follow' button, users better understood that clicking it would start the alerts
Delivery
We launched successfully with no negative feedback in the first month, despite changing core navigation flows
Post-launch iteration
Shortly after launch, we noticed a friction point: users were thrown off by the saved search they were currently viewing jumping to the top of the list.
Through observation and testing, we realized many users processed searches sequentially. I worked with the development team to quickly update the pattern to preserve static order of the Saved Searches, improving predictability.
Retrospective
This project taught me that onboarding isn’t a moment, but a system. These are the things I would push for if I could do it again.
Deeper segmentation
Power users were the most vocal and accessible and dominated our feedback loop. However, their advanced behavior doesn't reflect the broader user base — particularly the new users we were concerned about. Equal input from all segments of users would have led to a more balanced solution.
Progressive onboarding
To improve sign-up conversion, we pared down the requirements for user input, but we lost valuable context. Instead, we could’ve explored approaches where we collect and refine user inputs over time, rather than all at once.
Reconsidering tooltip tutorials
No one likes to read. Users skip tooltips. While Appcues offered a quick, trackable onboarding solution through tooltips, embedding feature education into user workflows would offer more meaningful education while dovetailing with progressive onboarding.
This project showed me that intuitive onboarding isn’t about adding more guidance—it’s about meeting users where they are. With better segmentation, gradual input collection, and contextual learning, we could have created a more self-sufficient experience that builds trust early and reduces friction throughout.