Back to Projects
Client ProjectEnterprise2024

KPI Management System

Enterprises needed a single place to track KPIs using the Balanced Scorecard (BSC) methodology with multi-level assignment, approval, and real-time visibility. I built a centralized platform covering KPI creation, assignment, cascading, and performance tracking, with formula-based scoring, live dashboards, and Excel-based reporting. Teams can now align on objectives and track progress from one dashboard. Built with Vue 3, Ant Design Vue, Vuex, Chart.js, Socket.IO, TypeScript, and ExcelJS.

KPI Management System
Vue 3Ant Design VueVuexChart.jsSocket.IOTypeScriptExcelJS

The Problem

Departments were tracking KPIs in scattered spreadsheets with no shared scoring logic, so managers couldn't see real-time progress or trust that numbers were computed the same way across teams.

Challenges

  • Modeling the Balanced Scorecard hierarchy (objectives → KPIs → formulas → targets) in a way non-technical managers could configure without code changes
  • Keeping scores consistent when formulas reference other KPIs, including values still pending approval
  • Pushing live updates to dashboards without overwhelming the client with excessive Socket.IO traffic

Key Decisions & Trade-offs

Formula-based scoring engine instead of hardcoded calculations

Different departments needed different weighting and target logic; a configurable formula layer meant new KPI types didn't require a code deploy.

Multi-level approval workflow with RBAC

BSC scoring only works if numbers are trusted — approval gates prevent unverified data from reaching the shared dashboard.

Results

  • Replaced spreadsheet-based KPI tracking with a single source of truth across departments
  • Managers get real-time visibility into approval status and scoring instead of waiting on manual reports
  • Excel export kept the tool compatible with existing reporting habits during rollout

Lessons Learned

  • Configurable formulas are worth the extra design time — the alternative is a stream of small code changes every time a department's scoring rules shift
  • Real-time features need throttling from day one; retrofitting rate limits onto Socket.IO events after users are used to instant updates is harder