Overview
I led the product design end-to-end, from discovery research to the final design system across 13 product modules.
From the drag-and-drop pipeline board where recruiters spend over 80% of active screen time, to the conditional automation engine and client-embeddable career portal, every screen was crafted to minimize operational friction.
About the Project
Hirecraft is an applicant tracking system engineered for modern recruiting teams that have outgrown manual spreadsheets and fragmented SaaS subscriptions.
The Problem
The Swivel-Chair Bottleneck in Modern Recruiting
Recruiters were jumping between spreadsheets, calendars, email, and scoring sheets just to manage one hire. More features wouldn’t fix that; the real problem was that nothing was connected.
The core design challenge: Build a system opinionated enough to eliminate repetitive tab-switching, yet flexible enough to adapt to any team hiring workflow.
Three Critical Constraints Identified:
1. Pipeline variance: Engineering roles and sales roles require different stages, but recruiters shouldn’t have to relearn the UI for each requisition. 2. Non-technical automation: Recruiters need to configure workflows in minutes without writing boolean syntax. 3. AI Trust: Automated resume scoring destroys trust if it behaves like a black box. The reasoning behind matches must be immediately visible.
The Thinking Process
Deconstructing the Daily Workflow
Conducted recruiter shadowing sessions and competitive teardowns across 5 mid-market ATS platforms.
- Observed that recruiters spend over 80% of active screen time on the pipeline board rather than individual profile views.
- Found that formula-based rule builders cause severe drop-offs during workflow creation.
- Identified that candidates lose trust in transactional, automated emails that lack personal touches.
Sentence-Based Logic & Contextual IA
Replaced abstract database tables with natural language interaction paradigms.
- Transformed workflow rules into sentence-shaped logic blocks: "When this happens, check this, then do this".
- Architected candidate details as contextual slide-over panels so recruiters never lose pipeline orientation.
- Redesigned the AI score into a transparent matching breakdown directly mapped to specific job criteria.
Optimistic UI & Cross-Platform System
Engineered a high-velocity design system synced directly with engineering component tokens.
- Built zero-latency drag-and-drop state transitions with instant optimistic updates and toast error fallbacks.
- Created a single modular component library powering both internal recruiter dashboards and public candidate portals.
- Reduced workflow creation time from 15 minutes to under 3 minutes during user verification tests.
Key Iterations
V1 Formula Bar & Opaque AI Score
Initial workflow builder utilized a formula input bar with syntax like `city == "Bengaluru" AND tag IN ("senior")`. Recruiters found it intimidating and error-prone. The initial AI match score was a standalone number without context.
V2 Sentence Chips & Transparent Reasoning (Shipped)
Redesigned the workflow builder to use stacked visual chips (Match All / Match Any / Match None) reading like plain English. The AI score was refactored into a subtle horizontal indicator with an expandable "Why" analysis drawer.
The Solution
#1 The Drag-and-Drop Pipeline Board
An optimistic UI where candidates move across stages instantly. Recruiters never lose their place, keeping their complete pipeline in clear view.
#2 Natural Language Workflow Automation
Trigger → Conditions → Actions organized top-to-bottom. Recruiters set up automated assignments, email alerts, and status changes in minutes without technical assistance.
#3 Transparent Candidate Match Breakdown
A structured breakdown surface revealing exact job criteria, experience alignment, and résumé evidence behind every match score.
Architecture & Scale
Modular Multi-Tenant Architecture
Every feature module functions independently. The navigation gracefully adapts whether an organization enables 3 modules or all 13.
Single Design System across Two Contexts
Client-hosted career pages render the exact same design primitives as the internal ATS application, ensuring zero visual drift and seamless maintenance.
Key Takeaways
- Good defaults help teams start, but every team hires differently, so the workflow has to adapt.
- Empty screens need as much care as busy ones. The empty state represents the primary onboarding vehicle for every new team.
- With AI features, showing the reasoning matters as much as showing the result.