Ravenpack - Transforming product ecosystem into a cohesive experience

1. Context & Mission

Ravenpack is the world leader in Big Data analytics for the financial sector. Its NLP (Natural Language Processing) engine processes millions of unstructured data points in milliseconds. However, analysts—users under extreme cognitive load—were forced to navigate between two disconnected worlds:

1. Explore: The massive search engine for discovering trends.

2. Smart Topics: The advanced tool for training algorithms and monitoring entities.

The User "Pain": Observational research revealed that 85% of analysts worked with multiple tabs open, constantly jumping between tools. This fragmentation slowed down decision-making and increased human error in high-stakes operations.

Under the direction of the CEO (Armando), CPO (Kevin Crosbie), and CSO (Aakarsh Ramchandani), my mission was to unify these technologies into a single coherent platform. We had to evolve the tool from a simple search bar into an intelligent research assistant, ensuring a premium experience for what would become BigData much later.

2. Discovery

Truth be told, this was my first deep dive into the financial sector from the inside. I had to make a massive effort to learn complex terminology—terms like ticker, sentiment, alpha, bullish/bearish, and earnings call transcripts—to truly understand how to solve the core problem. The challenge wasn't just about merging two worlds (Explore and Smart Topics) on a technical level; it was about ensuring the user experience made intuitive sense. The goal was to empower analysts to dissect news, sources, transcripts, and regulatory filings in just 3 or 4 clicks, while allowing them to seamlessly save their findings into custom bookmarks.

To get there, I couldn't just rely on internal assumptions. I conducted deep competitive research and UX benchmarking on industry giants like AlphaSense, FactSet, and Bloomberg, mapping out how they handled massive data exploration without overwhelming the user.

The biggest "Aha! Moment" came when analyzing these flows alongside our users: Smart Topics was the context for Explore. Users were basically saying: "I want to search for X (Explore), but only within the parameters of my custom trained model Y (Smart Topics)." They weren't separate applications; they were the "what" and the "how" of the same investigation.

Key Insights & The Root Cause of Friction:

• Cognitive Overload & Loss of Context: Analysts were using their own short-term memory as the bridge between the two apps. Switching URLs caused a 20% increase in configuration errors for complex financial alerts.

• Design Technical Debt: When I joined, the team was using Adobe XD. There was no single source of truth or component library. Engineering was forced to implement designs "by eye."

• Inefficient Hand-off: Because XD specifications were static and lacked developer-friendly code snippets, front-end engineers had to interpret spacing and colors manually. This made developing new features painstakingly slow and prone to visual bugs, damaging the perception of a premium Enterprise tool.

3. Strategy

To solve these systemic issues, I proposed a transformation across three main axes: Tools, System, and Architecture. I had to make strategic trade-offs to ensure we could deliver a high-quality product quickly.

Strategic Decisions & Trade-offs:

1. Transition from Adobe XD to Figma: I led the migration to Figma. Why? Because we needed auto-layout, design tokens, and real-time collaboration with engineering. Adobe XD's static nature was a bottleneck (and we didn't know it yet but it was going to disappear). Figma allowed us to create a dynamic, single source of truth.

2. Standardization with MUI (Material UI): I made the hard choice not to build a UI framework completely from scratch. Why? Building custom grids and standard components takes months. By deciding to build our Design System on top of Material UI, I gave the engineering team access to optimized, accessible, and ready-to-code components immediately. The trade-off was that we sacrificed some extreme custom layout shapes, but in return, we gained incredible speed and consistency. My creative effort could then be intensely focused on the aesthetic customization layer (building a premium "Dark Theme" suitable for low-light trading floors) rather than reinventing a dropdown menu.

3. The Discovery Panel: To eliminate the URL hopping, I conceptualized a right-side contextual panel. Instead of navigating away from Explore to tweak an algorithm in Smart Topics, the user could now invoke Smart Topics capabilities in a sliding panel directly over their search results. This kept the user anchored in their data investigation.

4. Execution

The success of the execution lay in learning to speak the exact same language as the engineering team and acting as a bridge between design and code.

Step-by-Step Execution Milestones:

1. Mapping UI to Figma (Atomic Design): I translated all the required MUI specifications into an atomically organized Figma library (Atoms, Molecules, Organisms). Every component in Figma had a 1:1 direct naming counterpart in the developers' MUI React codebase. This ensured that what I designed was technically viable "out of the box."

2. Defining the Tokens (The Dark Theme): I established a rigorous set of design tokens tailored for financial data visualization. We standardized the typography (Roboto) for high legibility of dense data, and carefully calibrated the dark mode color palette to reduce eye strain for analysts staring at screens for 10+ hours a day.

3. Modularity and Scalability: We designed the new Discovery Panel ecosystem thinking about future evolution. The system had to be fully responsive and capable of handling massive data visualization widgets (like sentiment charts) without breaking the layout or losing rendering performance.

4. Agile Collaboration: I completely eliminated the old "throw it over the wall" hand-off. I held weekly syncs with Product Managers, C-Level and Front-End team using Figma's inspect mode to tweak variables in real-time. We conducted short, iterative feedback cycles with internal analysts to validate that the new side panel enriched the news reading flow rather than cluttering it.

5. Result

What happens when you merge the world’s most powerful search engine with a custom NLP training tool? You get de Discovery Panel. This project reaffirmed that the best design decision is the one that optimizes not only the user experience but also the product construction flow. By aligning the design system with the engineering framework (MUI), I transformed design from a bottleneck into a strategic accelerator. Nowadays those results are very deprecated due the project continued to be BigData today.