Quick Start

This guide assumes you have completed the Installation steps.

1. Start the Backend#

dotnet run --project Backend

The backend starts as a console application (or Windows Service when installed via MSI) and opens a WebSocket server on port 8765.

2. Open the Live Dashboard#

Navigate to the dashboard in your browser:

http://localhost:8765

The Vue 3 dashboard shows real-time events, clip analysis results, and configuration controls.

3. Connect OBS#

Make sure OBS Studio is running with the WebSocket Server enabled:

1. In OBS, go to Tools → WebSocket Server Settings.
2. Enable the WebSocket server (default port 4455).
3. TK Clip Manager auto-connects and begins placing markers.

4. Launch a Game#

Start Valorant or League of Legends with Overwolf running. TK Clip Manager detects the game and begins capturing events immediately.

Events are:

• Displayed in the live dashboard
• Logged with millisecond precision to event log files
• Scored by the AI clip analyzer
• Marked in OBS recordings

5. Extract Clips#

After your session, use the clip extraction pipeline:

# Extract all highlight clips from the latest recording
python Scripts/extract_clips.py

Clips are formatted for short-form platforms with 9:16 vertical cropping, subtitles, and optional intro sequences.

Default Ports#

2-PC Setup#

TK Clip Manager supports split gaming/streaming setups. Configure the remote host in Backend/appsettings.json:

{
  "TwoPcSetup": {
    "Enabled": true,
    "StreamingPcHost": "192.168.1.100",
    "StreamingPcPort": 4455
  }
}

Next Steps#

• Configuration — Customize event rules, clip analysis, and output formats.
• Architecture Overview — Understand the service architecture.
• Game Events — Full list of captured events per game.