Needles
Product Overview
Needles is a comprehensive go-to-market platform built for B2B teams. It unifies three critical stages of bringing a product to market into one tool: documenting the product, discovering the right audience, and executing campaigns.
Brain
Product Documentation
Create and organize product specs, value propositions, and positioning materials
Audiences
Discovery & Segmentation
Research, segment, and identify ideal customer profiles using AI-driven insights
Campaigns
Discovery & Segmentation
Plan, launch, and track hyper-personalized outreach
The Problem
InVitro Capital builds and scales B2B SaaS products. They found a recurring pattern: marketing and sales teams were losing significant time and money to a fragmented, manual GTM process.
1
Wasteful Data Spend
Teams buy audience data without validating ICP fit, purchase intent, or budget — most contacts never convert
2
Manual Data Chaos
CRM reconciliation is manual. Duplicates, overlapping outreach, and no funnel visibility kill conversion rates
3
Wasteful Data Spend
Disconnected tools for execution. Strategy changes stay siloed, requiring rounds of meetings to propagate
The Solution
One Platform.
One Source of Truth.
Only what you need. Nothing more, nothing less.
Design Process
"I follow the standard Double Diamond — but with a bit of sauce. My tools and workflow cut delivery time and kill the iterations that only exist because something was missed."
Discover
Research & Empathy
Desk Research
- B2B GTM market analysis
- Competitive audit: HubSpot, Apollo, Clay, Salesforce, Attio
- Identified four systemic weaknesses none of them solve
Stakeholder Interviews
- Understand Needles' product vision and market positioning
- Align on business goals: reduce data waste, increase conversion rates
Field Research
- Sat directly with sales managers and SDRs inside InVitro's portfolio companies
- Observed GTM workflows, pain points, and workarounds firsthand
Define
Strategy & Alignment
User Artifacts
- Drew personas for four user types (Sales Manager, SDR, Marketing Manager, CEO)
- Drew user journeys and happy path across all three modules
- Mapped user flows for Brain, Audiences, and Campaigns
Strategy Alignment
- Reviewed interview takeaways together
- Aligned on three-module structure with AI at the core
- Received the product strategy
Experience Strategy
- Defined the design system foundations
- Established experience principles: neutral by default, density without clutter, consistent three-column layout, AI as a persistent companion
- These guided every visual and interaction decision going forward
Design
Explore & Create
Layout Sketching
- Explored sidebar vs top nav, two-column vs three-column, floating vs docked chat
- Defined design principles and design KPIs
- Decided on visual direction and style
First Mockup & Design | Figma
- Created the first mockup based on winning sketches
- Built the component library and design system (light + dark modes)
Deliver
Build & Ship
Functional Prototype | Claude Code
- Received: component library + design system + first Figma mockup + sketched layouts
- Produced: a functional working prototype hosted on Vercel
- Tested with real users, monitored via PostHog analytics
Final Delivery | Figma
- Took prototype learnings back into Figma
- Pixel-perfect final screens and components
- Delivered Figma file + Storybook + prototype to developers for interactions, accessibility, and handoff
Competitive Analysis
Key Insights
Five insights that shaped every major design decision
Teams don’t need more features — they need fewer, better-connected ones
Data quality matters more than data quantity
Strategy changes are inevitable — tools must adapt in real time
Team alignment is the hidden conversion killer
AI should handle data work, so humans focus on strategy
Empathy Map
Says
Does
Thinks
Feels
Information Architecture
A product-first hierarchy where each product contains its own Brain, Audiences, and Campaigns
Sketches
Reviews
High Fidelity Screens
Layout Shell
Three-Column Shell
Consistent layout across all modules. Left and right panels collapse independently — giving users full control over workspace density. Same shell, different content per module.
Top Navigation Bar
Product-level navigation. Brain, Audiences, and Campaigns tabs always visible. One click to switch modules. Product selector on the left.
Top Navigation Bar
Product-level navigation. Brain, Audiences, and Campaigns tabs always visible. One click to switch modules. Product selector on the left.
Center Panel — Content
The main workspace. Displays the content of whatever is selected in the left panel. Rich text editor, data tables, or campaign views depending on the module.
Right Panel — AI Chat
The Brain assistant. Context-aware, session- based. Understands which module, product, and artifact you're working on. Collapsible.
Selected Screens
Create an Account
Verify with OTP
Workspace Setup
Members Invitation
Product Brain
Create New Product
Add Product Resources
AI Artifacts Creation
Notion Like Editor
Audiences Empty State
AI Audience Finder
Selection Action Bar
Data Grid Columns Control
Campaigns Creation Configuration
Campaigns Pipeline Configuration
Campaigns Content Preview
Single Lead Profile
Style Guide
Color Palette
Accent
The accent color represents the primary brand or product identity. It is used to draw attention to key actions, highlights, and moments of emphasis.
Accent should be used intentionally and sparingly. Overuse reduces its impact and can harm visual hierarchy. In most cases, components derive multiple accent-related values (hover, subtle backgrounds, focus states) automatically from the base accent color.
Default (neutrals)
Default colors form the neutral backbone of the system. They are used for most non-emphasized UI elements.
