log(ger)

A professional web-based personal productivity tracking application — real-time timers, analytics dashboards, AI-powered chat, and project progression visualization.

Kaiwen Bian · Yuer Tang · Jiaying Chen

Under Active Development. Logger is currently a local-only application. Cloud deployment and multi-user support are planned for future releases.

Overview

Logger is a ground-up rebuild of Chatable-Study-Database — a Python/Jupyter-based study time analysis system with basic LLM chat. The previous version relied on manual Excel logging, Jupyter notebooks for visualization, and a RAG pipeline for querying history.

The problem: Manual time tracking in spreadsheets is tedious, error-prone, and disconnects the act of logging from the insight it's meant to produce. You end up with 26 CSV files spanning three years of data, but no easy way to see patterns, track project evolution, or ask questions about your own productivity.

Logger solves this by combining real-time timer-based logging with an analytics dashboard, AI-powered natural language querying, and a project progression timeline — all in a polished, professional web interface that makes the daily act of tracking feel effortless.

Motivation

Productivity tracking shouldn't require a data science workflow. The original system worked — three years of continuous logging prove that — but each quarter required manual CSV creation, column formatting, and Jupyter notebook reruns just to see basic trends. Text descriptions were separated from time data. Category names drifted across quarters. Getting a simple answer like "how much time did I spend on research in 2024?" meant writing pandas queries.

Logger turns passive data collection into an active feedback loop: log time with timers, see patterns instantly in dashboards, and ask questions in natural language. The goal is to make productivity tracking a tool you actually use daily, not a chore you maintain weekly.

The project also serves as a case study in structured AI-assisted development using Propel — a constraint framework for Claude Code that enforces investigation-first methodology, human-in-the-loop gates, and domain-specific auditing throughout the development process.

Core Features

Real-Time Timers

Start, pause, and stop timers per category. Run multiple timers in parallel. Automatic rounding to the nearest minute. Add descriptions and locations on completion.

Analytics Dashboard

Interactive charts powered by D3.js — daily area charts, category breakdowns, weekly heatmaps, and session comparisons. Filter by date range, session, or category.

AI-Powered Chat

Query your productivity history using natural language via Claude API. Ask "How much time did I spend on research in 2024?" and get factually grounded answers with manual approval for all LLM operations.

Project Progression

Visualize how projects evolve across academic sessions with vertical timelines, GitHub repo linking, and AI-generated session descriptions. Group by research, courses, personal projects.

Smart Data Management

Session-based data model with category linking across quarters. Import legacy CSV data (26 files, Fall 2022–Summer 2025) with automatic BOM handling and category normalization.

Professional UI

Polished dark/light theme with a responsive sidebar layout. Built with SvelteKit and Tailwind CSS for a native-app feel. Designed for daily use, not a prototype aesthetic.

Architecture

Logger follows a clean client-server architecture with a SvelteKit frontend communicating with a FastAPI backend over REST APIs. The backend manages all data persistence, CSV import logic, timer state, analytics aggregation, and Claude API calls.

Frontend (SvelteKit + Tailwind CSS)
Dashboard Timer Analytics Chat Projects Data Settings
REST API
Backend (FastAPI + Python)
Timer Service Analytics Service Chat Service Import Service Group Service GitHub Service
SQLite / Claude API
Storage & External
SQLite DB Claude API GitHub API Legacy CSVs

The frontend is organized into seven pages matching the sidebar navigation, each with dedicated components and stores. The backend uses a service-layer pattern with routers for HTTP routing and services for business logic.

Data Model

Logger's data model is session-centric. Each academic quarter (e.g., "Winter 2025") is a session containing categories, timer entries, manual entries, and daily observations. Categories are linked across sessions through category families, enabling project-level tracking over time.

Sessions

One per academic term. Holds year, season, date range. Only one session active at a time for timer-based logging.

Categories

Per-session activity types (e.g., salk_winter25). Linked to families for cross-session tracking. Support display names and colors.

Category Families

Group related categories across sessions: training_*, salk_*, mpi_*. Typed as research, course, personal, or recurring.

Timer Entries

Real-time timer records with start/end timestamps, pause tracking, description, and location. Auto-rounded to nearest minute.

Manual Entries

Retroactive time entries with date, minutes, category, description. Used for imported CSV data and manual logging.

Observations

Daily aggregated totals per category. Computed from timer + manual entries. Powers the analytics dashboard and daily breakdown bars.

Legacy Data

Logger imports 26 CSV files spanning Fall 2022 through Summer 2025, handling format variations (missing week/day columns in 2022, BOM characters, inconsistent column names in text CSVs) and normalizing category names with quarter suffixes into linked families.

AI Integration

Logger uses the Claude API for two features, both requiring explicit user approval in the UI before any LLM call is made:

Natural Language Chat

Ask questions about your productivity history in plain English. The chat service builds a context window from your data, sends it to Claude, and streams back factually grounded responses.

"Summarize my 2024 productivity" "How much time did I spend on training?" "Compare Fall 2024 and Winter 2025" "What are my top categories?"

Project Descriptions

AI-generated session summaries for the project progression timeline. Given a family's history and category data, Claude produces concise descriptions of what happened in each session.

Manual Approval: All LLM operations surface a confirmation card in the UI before executing. No data leaves the app without the user explicitly clicking "Approve." This design keeps AI usage minimal, transparent, and under user control.

Tech Stack

LayerTechnologyPurpose
FrontendSvelteKit 2.xApp shell, routing, compiled reactivity for real-time timers
StylingTailwind CSS 4.xUtility-first CSS with dark/light theme support
ChartingD3.jsDaily area charts, category bars, heatmaps, session comparisons
BackendFastAPIREST API with Pydantic validation, async endpoints
DatabaseSQLiteZero-config local storage with aiosqlite
LLMClaude API (Anthropic)Natural language chat and AI-generated descriptions
Python3.11+Backend runtime with uv for dependency management
Node.js20+Frontend runtime with pnpm

Why These Choices

SvelteKit over React/Next.js

Compiled reactivity is ideal for real-time timer UIs. 40% less boilerplate for a solo developer.

FastAPI over Express

First-class Anthropic Python SDK. Python's csv/pandas libraries make CSV import trivial. Type-safe with Pydantic.

SQLite over Postgres

Single-user local app. Zero config. File-based backup. Can migrate to Postgres later if needed.

D3.js for Charting

Maximum control over visualization. Custom heatmaps, responsive area charts, and interactive category bars.

Getting Started

Clone the repository

git clone https://github.com/KevinBian107/logger.git
cd logger

Start the backend

cd backend
uv venv && source .venv/bin/activate
uv pip install -e .
uvicorn logger.main:app --reload

Start the frontend

cd frontend
pnpm install
pnpm dev

Open http://localhost:5173 in your browser.

Import legacy data (optional)

# Place CSV files in data/ directory
# Use the Data page to import sessions

Supports the {year}_{quarter}_study.csv and {year}_{quarter}_text.csv format.

Application Pages

Logger is organized into seven pages, each accessible from the persistent sidebar navigation.

PageDescription
DashboardToday's summary — total time, entries, streak, active timers, quick start, and daily breakdown bar
TimerStart/pause/stop timers per category, manual entry form, today's log
AnalyticsFilterable charts: daily area chart, category bars, weekly heatmap, session comparison
ChatAI-powered natural language interface with suggested queries, streaming responses, and approval cards
ProjectsProject progression across sessions — group selector, vertical timelines, GitHub linking, AI descriptions
DataSession management, CSV import with drag-and-drop, family management, bubble visualization
SettingsAPI key configuration, theme toggle, app preferences

Acknowledgments