The Story Point Calculator

I took it upon myself to vibe-code my way to a tool that I could use on a daily basis. The Story Points Calculator is a Progressive Web App (PWA) designed to assist Agile development teams in estimating story points during planning poker sessions. This tool provides a structured approach to breaking down and evaluating user stories based on multiple complexity factors. I also use this tool as a product manager to pre-plan my roadmap for the coming cycles. I apply the same general questions to product features when asking developers from a high level about the features I want to build and it significantly helps me plan the cycle ahead.

‍

‍

1. The build a tool that could accurately estimate story points for planning purposes
2. The tool must be easy to use
3. The tool must use a weighted scoring system, and dynamically change based on variables and combinations of variables to match our estimation process
4. To learn how to vibe code a basic calculation model with output in graphic format (points, tshirt size, and contribution breakdown).

1. Intelligent Story Point Calculation

• Hybrid Fibonacci Algorithm: Implements a sophisticated calculation method that considers multiple weighted factors
• Rule-Based Overrides: Includes specific rules for edge cases (e.g., when unknowns or dependencies are maxed out)
• Nonlinear Normalization: Uses mathematical functions to map input values to the Fibonacci sequence

2. User Experience

• Responsive Design: Works seamlessly across all devices (desktop, tablet, mobile)
• Interactive Sliders: Intuitive interface for adjusting complexity factors
• Visual Feedback: Real-time updates and visualizations of the estimation

3. Technical Implementation

• Progressive Web App: Works offline and can be installed on devices (with toast prompting user to download to homescreen)
• Service Worker Caching: Enables offline functionality

4. Analytics Integration

• Google Analytics: Tracks usage patterns and feature adoption
• Event Tracking: Monitors user interactions for continuous improvement

How It Works

1. Input Collection:
   • Users adjust sliders for various complexity factors including:
     • Business Logic Complexity
     • Technical Implementation Difficulty
     • Dependencies
     • Unknowns
     • And more...
2. Calculation Process:
   • The app applies a weighted algorithm to the input values
   • Special rules are triggered for specific scenarios
   • A nonlinear transformation maps the inputs to the Fibonacci sequence
3. Output:
   • Story points are displayed in the Fibonacci sequence (1, 2, 3, 5, 8, 13, 21, 34)
   • T-shirt size equivalents (XS, S, M, L, XL) are provided for quick reference
   • A visual chart shows the contribution of each factor

The Calculation Logic

The scoring system in the Story Points Calculator uses a sophisticated hybrid approach that combines rule-based overrides with a mathematical model to calculate story points. Here's a breakdown of how it works:

1. Input Processing

• The calculator takes 8 different input factors (6 regular and 2 inverse)
• Regular factors (0-5): Higher values increase the score
• Inverse factors (0-5): Higher values decrease the score

2. Rule-Based Overrides

The system first checks for specific conditions that override the normal calculation:

1. Maximum Uncertainty (21+ points)
   • If both "Unknowns" and "Dependencies" are maxed out (5), the minimum score is 21
2. High Complexity (13+ points)
   • If either "Business Logic Complexity" or "Technical Implementation Difficulty" is maxed out (5), the minimum score is 13
3. Neutral Case (5 points)
   • If all sliders are at their midpoint (3), the score is exactly 5
4. Minimum Effort (1 point)
   • If all regular factors are at minimum (1) and all inverse factors are at maximum (5), the score is 1
5. Maximum Effort (34 points)
   • If all regular factors are at maximum (5) and all inverse factors are at minimum (1), the score is 34
6. High Uncertainty (8+ points)
   • If either "Unknowns" or "Dependencies" are maxed out (5), the minimum score is 8

3. Hybrid Fibonacci Calculation

If no overrides apply, the system uses a nonlinear calculation:

1. Weighted Sum with Exponential Scaling

javascript

let sum = 0;for (let i = 0; i < inputs.length; i++) {    let v = inputs[i].inverse ? 6 - Number(inputs[i].value) : Number(inputs[i].value);    sum += Math.pow(v, 1.7);  // Non-linear scaling}

1. Normalization
   • Calculates the minimum possible sum (all regular factors = 1, all inverse = 5)
   • Calculates the maximum possible sum (all regular factors = 5, all inverse = 1)
   • Normalizes the actual sum to a value between 0 and 1
2. Fibonacci Mapping The normalized value is mapped to the Fibonacci sequence:

norm ≤ 0.05  → 1
norm ≤ 0.15  → 2
norm ≤ 0.30  → 3
norm ≤ 0.48  → 5
norm ≤ 0.65  → 8
norm ≤ 0.80  → 13
norm ≤ 0.93  → 21
norm > 0.93  → 34

Key Design Principles

1. Nonlinear Scaling
   • Uses Math.pow(v, 1.7) to ensure that higher complexity ratings have proportionally more impact
   • This reflects the reality that complex features often have exponential, not linear, impact on effort
2. Fibonacci Sequence
   • Uses the standard Agile Fibonacci sequence (1, 2, 3, 5, 8, 13, 21, 34)
   • The sequence accounts for increasing uncertainty with larger numbers
3. Inverse Factors
   • Some factors (like "Team Familiarity") are inversely related to effort
   • These are handled by inverting their scale (6 - value) before calculation
4. Defensive Programming
   • Includes extensive input validation
   • Handles edge cases explicitly through the rule-based overrides

This hybrid approach provides a good balance between:

• Mathematical rigor (through the normalized scoring)
• Practical experience (through the rule-based overrides)
• Agile principles (through the Fibonacci mapping)

Technical Stack

• Frontend: HTML5, CSS3, JavaScript (Vanilla)
• Charts: Chart.js for data visualization
• Build Tools: npm scripts
• Hosting: Static web hosting

Use Cases

• Agile sprint planning sessions
• Backlog refinement meetings
• Story point estimation training
• Cross-team alignment on story sizing

This project demonstrates a practical application of web technologies to solve a common challenge in Agile software development, providing teams with a consistent and data-driven approach to story point estimation.