Simplified SDLC for MVP Development

This process focuses on rapid definition and foundational documentation necessary to start development quickly and maintain architectural integrity.

SDLC Overview

Phase	Step	Key Artifacts	Description & Goal
I. Planning & Concept	1	Product Vision Document (or Brief)	Define the why and what of the product. Clearly state the problem it solves and the target user.
I. Planning & Concept	2	MVP Definition	Define the core, must-have features (the minimum necessary to solve the main problem).
II. Requirements	3	Functional Requirements List (FRs)	A detailed list of what the system must do (e.g., Start, Stop, Reset).
II. Requirements	4	Non-Functional Requirements List (NFRs)	A detailed list of how well the system must perform (e.g., Accuracy, Latency).
III. Design	5	System Architecture Diagram	A simple block diagram showing the main components (e.g., Front-end UI, Timing Logic, State Management).
III. Design	6	Design Specifications Document	UI/UX Mockups, Data Model, and Component Behavior logic flows for key functions.
IV. Implementation	7	Source Code & Unit Test Scripts	Write the code based on the design specifications and create tests for individual components (e.g., test the accuracy of the timing function).
V. Testing & Deployment	8	Test Plan & Execution Report	Verify that all FRs and NFRs are met. Confirm components work together correctly.
V. Testing & Deployment	9	Deployed MVP	Launch the product to the initial target users for feedback and iteration.

Project Scope: Stopwatch MVP

1. Planning & Concept

Idea: A highly accurate stopwatch that can eventually integrate with electronic timing.

Vision: To create a professional, accurate, and integrable timing tool.

2. Core Value & User

Core Value: Provide perfect, simple time measurement with high resolution.

Primary User: Athletes, Coaches, or anyone who needs reliable manual timing (Focus on Swimming).

Deferred Features (Not MVP)

Lap/Split time recording.
Integration/Connectivity (APIs, network protocols).
Saved history of previous recorded times.

II. Requirements

⚙️ Functional Requirements (FRs)

FR1-FR3: Start/Stop/Resume Timing: The system must allow the user to control the timer state accurately.
FR4: Reset Timer: The system must allow the user to reset the displayed time back to $00:00:00$.
FR5: Time Display: Must continuously display the elapsed time in the format MM:SS:xx (Minutes:Seconds:Hundredths).
FR6: Button State: The system must change the display text of the Start/Stop button (e.g., show "Stop" when running).

📈 Non-Functional Requirements (NFRs)

Performance & Accuracy

NFR1. Accuracy: The timer must measure time with a precision of at least 10 milliseconds (i.e., hundredths of a second).
NFR2. Latency: The time delay between a user pressing the Start/Stop button and the timer reacting should be less than $100\text{ms}$.

Usability & Reliability

NFR3. Interface Clarity: The display for the time and the button labels must be clear and readable.
NFR6. Stability: The system must not crash or freeze during normal operation.

III. Design

5. Conceptual (High-Level) Design

The system uses a simple three-tier architecture within the client application. [Image of Simple 3-Tier Client Architecture Diagram]

Presentation Layer (UI): Handles rendering and user input (buttons).
Application Logic Layer (Timing Core): Manages state and the high-resolution timing loop (`setInterval`).
Data Layer (State Model): Stores raw time values (`startTime`, `elapsedTime`) in milliseconds.

6. Detailed Design (Specifications)

B. Data Model / State

Variable Name	Type	Description
timerState	String/Enum	Current state: IDLE, RUNNING, PAUSED.
startTime	Number (ms)	Timestamp when the timer last moved to RUNNING.
elapsedTime	Number (ms)	Total time accumulated when the timer is PAUSED or IDLE (the base time).

C. Component Behavior: State Chart

Transitions of the core Stopwatch logic:

From State	Event (Button Press)	To State	Action Taken (Logic Layer)
IDLE	Start	RUNNING	Set `startTime`, Start `intervalRef`.
RUNNING	Stop	PAUSED	Calculate time, accumulate to `elapsedTime`, Clear `intervalRef`.
PAUSED	Start	RUNNING	Set `startTime`, Start `intervalRef`.
PAUSED	Reset	IDLE	Set `elapsedTime` and `startTime` to $0$.

IV. Implementation & V. Testing

7. Coding & Unit Testing (Core Logic)

The core, reusable timing logic is implemented in a platform-agnostic class (`stopwatch_logic.js`). This component manages state and performs all time calculations.

// The full implementation of the Stopwatch class is in stopwatch_logic.js.
// Key elements for reuse and porting:

class Stopwatch {
    constructor(updateCallback) { /* ... */ }

    // Core state transitions (FR1, FR2, FR3, FR4)
    start() { /* ... */ }
    stop() { /* ... */ }
    reset() { /* ... */ }

    // Time retrieval (NFR1)
    getTime() {
        if (this.state === 'RUNNING') {
            return this.accumulatedTimeMs + (Date.now() - this.startTimeMs);
        }
        return this.accumulatedTimeMs;
    }

    // Time formatting (FR5)
    static formatTime(ms) {
        // Logic to convert milliseconds to MM:SS:xx
        // ...
    }
}

8. Integration & System Testing

The Test Plan verifies all Functional (FRs) and Non-Functional (NFRs) requirements before the MVP deployment.

A. Functional Test Cases (Excerpts)

ID	Test Case Steps	Expected Result (Pass Criteria)
FR2/FR3	1. Start timer. 2. Run for 2s. 3. Stop. 4. Resume for 2s.	Total time accumulates correctly, reflecting both run segments.
FR4 (Guard)	1. Click "Start." 2. Try clicking "Reset."	The "Reset" button is visibly disabled and ignores clicks while RUNNING.
FR5	1. Observe timer running past 1 minute.	The display format is consistently MM:SS:xx.

B. Non-Functional Test Cases (Excerpts)

ID	Requirement	Expected Result (Pass Criteria)
NFR1	Accuracy: The timer must measure time with $\ge 10\text{ms}$ precision.	Deviation is minimal compared to system clock over a 10-minute period.
NFR2	Latency: Start/Stop reaction must be $< 100\text{ms}$.	Time display stops instantaneously upon button click with no visible lag.