OverviewI built deskcat as a solo developer to serve as a continuous on-screen companion and productivity tool. It is a desktop application featuring a floating pixel-art cat that helps users jot quick notes throughout the day. The problem it solves is the exhaustion and frustration of having to sit down every evening and trying to remember what was accomplished all day just to write daily reflections; by continuously tracking activities alongside a virtual pet companion, users no longer have to rely on their memory at the end of the day.
The user flow is seamlessly integrated into the desktop environment: the virtual pet floats transparently on screen, with its eyes following the mouse cursor while clicks effortlessly pass through to underlying applications. Users can click the cat to instantly open a quick-note popup to jot down activities, or click and drag it around the screen using elastic physics. At configured intervals, the cat bounces with alert marks to prompt a new entry, and if ignored, its mood progressively transitions from content to lonely or grumpy until a note is saved. At the end of the day, a final reflection prompt aggregates all chronological notes, allowing users to write their evening summary without starting from a blank slate.
The project is structured as an Electron desktop application built entirely with TypeScript and packaged using electron-builder. The architecture strictly separates concerns: the main process handles window management, system tray menus, global keystroke monitoring using uiohook-napi, and atomic filesystem writes to safely store daily JSON and Markdown files. The renderer process manages the DOM and utilizes a custom spring-damper physics engine for drag-and-drop interactions, offloading hardware-accelerated rendering to the GPU with inline CSS transforms to eliminate browser layout thrashing.
One significant challenge was managing the dynamic rendering of the cat's states and patterns without degrading desktop performance. Originally, updating SVG skins caused expensive garbage collection sweeps; this was solved by implementing a DOM object pool that intelligently recycles <rect> elements and toggles their display states. The cat artwork, animations, and coat patterns are adapted from "Catjang" by jan (nerfspeed on Discord) under the CC BY-NC 4.0 license. To integrate these assets, I made specific technical modifications, including baking ear/tail paths, namespacing IDs, adding steam-puff groups, and reimplementing the data-patch-frame lightweight spot-painter entirely in TypeScript without runtime cell-mapping tables.
