Running Your
Entire Business.
A unified ERP workspace consolidating CRM, HRM, payroll, billing, inventory, and collaboration into a cohesive, high-performance web experience. Design-led. Modular. Scalable.
The Challenge
Growing enterprises suffered from heavy cognitive fatigue and fragmented data when managing CRM, HRM, payroll, and billing across disconnected legacy software.
My Role & Stack
Lead Product Designer & Full-Stack Developer. Designed the modular ERP design system in Figma, architected reusable token components, and built the production Next.js/TypeScript frontend.
Measurable Impact
Consolidated 6 disparate business tools into a singular workspace, cut administrative operational time by 65%, and scaled to support 500+ active enterprise seats.
Solving for
SaaS Fragmentation.
Connected Business Modules
SMEs lose hundreds of productive hours switching between different tools for CRM, HRM, payroll, and project tracking. Emplanr unifies these operations under one database.
The Tab Fatigue Friction
Tab fatigue increases cognitive load. I engineered a modular workspace UI where active applications load side-by-side inside a single responsive container shell.
Onboarding Optimization
Setting up a company ERP is notoriously long and complex. I designed a self-serve 4-step initialization flow that dynamically configures default databases and modules based on sector.
Consolidated Invoicing
Real-time sales CRM deals connect directly to the Finance engine. This allows sales reps to generate tax-compliant invoices and preview PDFs instantly, bypassing accounting delays.
Role
Lead Product Designer & Frontend Architect
Client
Emplanr Inc.
Platform
Responsive Web Workspace
Registered Scale
50,000+ Active Corporate Profiles
Sales Intelligence & Pipeline CRM.
The Usecase
Providing sales executives and managers with real-time conversion rates, deal velocity tracking, and active sales pipelines.
Design Rationale
To avoid choice overload, we built high-contrast deal pipelines. Sales cards present glanceable metrics and drag-and-drop mechanics to progress leads cleanly.
Core Performance Metric
"Boosted monthly sales pipeline update speeds by 35% across corporate teams."
Deal Specifications & Timeline Logs.
The Usecase
Reviewing details of active leads, tracking progress logs, and managing communication history.
Design Rationale
We built a multi-tab panel architecture grouping customer info, mail history, activity logs, and pricing quotes in a single, fast-loading modal drawer, preventing page changes.
Core Performance Metric
"Reduced average CRM deal-review times by 28%, speeding up sales team collaboration."
Automated Invoicing & PDF Previews.
The Usecase
Generating customer invoices directly from closed deals with instant tax calculations and visual PDF generation.
Design Rationale
Manual billing delays cash flow. We designed a side-by-side preview system where ledger details render live in a standard invoice template, verifying correctness immediately.
Core Performance Metric
"Reduced dispatch latency from deal-close to invoice-sent down to under 3 seconds."
Enterprise self-serve Onboarding.
The Usecase
Enabling business owners to initialize workspace, choose business structures, and activate core modules.
Design Rationale
ERP setups suffer high drop-offs. I designed an interactive 4-step card that captures organizational basics, dynamically establishing database tables based on industry.
Core Performance Metric
"Reduced initial platform setup dropout rates by 22%."
Geofenced Employee Clock-Ins.
The Usecase
Providing employees with responsive mobile interfaces to register daily check-ins and submit timesheets.
Design Rationale
Timesheets suffer from late submissions and verification delays. We built a high-contrast geofenced check-in button showing immediate status feedback.
Core Performance Metric
"Achieved 99.4% check-in timesheet correctness across mobile corporate users."
Strategic Decisions &
Product Thinking.
Strategic Framework Flow
Problem
Corporate users wasting hours jumping between separate SaaS tools.
Constraints
Complex organization workflows requiring modular configurations.
Options
Monolithic layouts vs Separate subdomain sites vs Unified dashboard shell
Decision
Built a modular web container letting clients toggle required business apps.
Trade-offs
Restricted extreme layout modifications to ensure uniform UI consistency.
Expected Outcome
A singular database system cutting synchronization lag and tool costs.
What problem are we solving?
Consolidating fragmented business tools—CRM, HRM, payroll, billing, and collaboration—into a single digital workspace for small-to-medium enterprises.
Why choose this approach over alternatives?
A single modular platform ensures zero API integration costs, a single database source, and zero data sync discrepancies between departments.
How does this help the user achieve their goal?
Enables corporate managers to run billing, timesheets, and customer pipelines from one consistent dashboard tab, reducing screen clutter.
What evidence/research informed this decision?
A survey of active SMEs indicated that employees used an average of 5 distinct platforms daily, leading to 'tab fatigue' and 12+ lost sync hours weekly.
What trade-offs did we make?
We restricted individual custom fields in tables to ensure high-performance queries and quick page load speeds across modular grids.
How will we measure whether it worked?
Tracked by active modules count and business session stickiness. Led to 50% higher module integration and dropped tool subscription overheads.
The Engineering Backing
Next.js Page Optimizations
Leveraging Next.js App Router static optimization layouts to deliver instant initial page loads, using Client-Side React rendering for complex interactive dashboard states.
Relational PostgreSQL Schemas
Designed normalized table structures linking CRM pipelines, employee timesheets, and invoices to ensure complete data consistency across activated modules.
Restful API Routing
Architected RESTful endpoints utilizing token-based authentication headers to restrict business data access strictly within authorized organizational boundaries.
Modular Redux State
Managed modular dashboards using a unified Redux state manager. Dynamically registers and slices workspace state as the client toggles and runs distinct apps.
Explore My Other Work
Navigate back to my projects archive to see how I solve complex user experience problems in fintech, SaaS, and logistics.
View Projects Archive