Inspiration

Customer churn costs businesses $1.6 trillion annually. We watched Customer Success Managers drown in disconnected spreadsheets—tracking usage here, revenue there, support tickets somewhere else—unable to see the warning signs until customers had already decided to leave.

We asked: what if we could see customer health the way doctors see human health? Not as isolated metrics, but as interconnected "genes" that together reveal the full DNA of a relationship. That's SuccessHelix.

What it does

SuccessHelix transforms scattered customer data into an intelligent genome visualization. Four interconnected "genes"—Engagement, Financial, Sentiment, and Relationship—pulse with real-time health signals. Our ML engine predicts churn probability with SHAP-powered explainability (so you know why, not just what), while embedded Tableau Cloud dashboards provide deep analytics. Ask questions in plain English: "Which customers need attention this week?" and get actionable AI insights instantly.

How we built it

  • Frontend: React 18 + TypeScript with TailwindCSS, shadcn/ui components, and custom D3.js genome visualization that animates customer health as DNA strands—deployed on Vercel with SPA routing
  • Backend: FastAPI (Python) powering REST APIs with scikit-learn's CalibratedClassifierCV for probability-calibrated churn predictions—deployed as a serverless container on Google Cloud Run
  • ML Explainability: SHAP TreeExplainer wrapping our gradient boosting model, surfacing the exact features driving each prediction
  • Tableau Integration: Full pipeline—Hyper API generates data extracts, REST API publishes to Tableau Cloud, Embedding API v3 renders interactive dashboards
  • AI Layer: OpenRouter (Gemini 2.0 Flash) for natural language insights, customer diagnosis, and what-if intervention simulations
  • Alerts: Slack webhooks delivering proactive notifications with one-click customer context

Challenges we ran into

  • Tableau Embedding Complexity: Embedding API v3's web component lifecycle required careful script loading and state management to avoid race conditions
  • SHAP + Calibrated Classifiers: Standard SHAP doesn't work directly on CalibratedClassifierCV—we had to extract the base estimator and wrap it with TreeExplainer
  • Real-time Data Sync: Coordinating Hyper file generation, Tableau Cloud publishing, and frontend refresh without blocking the UI
  • AI Response Formatting: Raw LLM markdown needed custom parsing to render cleanly in React components
  • Cloud Deployment: Configuring Google Cloud Run with proper environment variables for Tableau tokens and ensuring CORS worked correctly between Vercel frontend and Cloud Run backend

Accomplishments that we're proud of

  • End-to-end Tableau Pipeline: Hyper API → REST API multipart publish → Embedding API v3—fully automated data refresh with one click
  • Interpretable ML: Not just predictions, but SHAP explanations that CSMs can actually act on ("engagement_score drove 40% of this risk")
  • The DNA Metaphor: Complex health data becomes intuitive—genes connect, cascade effects visualize, and the genome tells a story
  • Production-Ready Deployment: Live on Vercel + Google Cloud Run with auto-scaling, ready for real-world use
  • Production-Ready Alerts: One-click Slack notifications with full customer context, ready for real CSM workflows

APIs and Dev Tools Used

Tool Usage
Tableau Hyper API Programmatic .hyper extract generation for customer health, gene scores, cascade events
Tableau Embedding API v3 Native <tableau-viz> web component embedding with event listeners
Tableau REST API Multipart/mixed datasource publishing to Tableau Cloud
OpenRouter (Gemini 2.0 Flash) Natural language insights, customer diagnosis, what-if simulations
scikit-learn CalibratedClassifierCV + GradientBoostingClassifier for calibrated churn probabilities
SHAP TreeExplainer for feature importance and individual prediction explanations
D3.js Custom genome visualization with animated DNA strands and cascade flows
FastAPI High-performance async Python backend with automatic OpenAPI docs
React + TypeScript Type-safe frontend with TailwindCSS and shadcn/ui
Slack Webhooks Proactive health alerts with interactive message blocks
Google Cloud Run Serverless container deployment for backend API with auto-scaling
Vercel Frontend hosting with edge network and SPA routing

What we learned

  • Tableau's Power is in the Pipeline: Hyper API + Embedding API v3 together unlock experiences impossible with either alone
  • Explainability > Accuracy: CSMs don't trust black boxes—SHAP values turned our model from "interesting" to "actionable"
  • Metaphors Matter: The DNA framing transformed how users understood health—it's not a score, it's a living system
  • Serverless Simplifies: Google Cloud Run made backend deployment painless—just push a container and it scales automatically

What's next for SuccessHelix

  • Historical Churn Labels: Train on real outcomes for proper model evaluation and continuous improvement
  • Real-time WebSocket Streaming: Live health updates as customer behavior changes
  • Custom Gene Weights: Let CSMs configure weights per customer segment or industry
  • Tableau Actions Integration: Bidirectional communication—click in Tableau, update the genome; click the genome, filter Tableau
  • Multi-tenant SaaS: Deploy as a service with isolated customer workspaces

Built With

Share this project:

Updates