It started with an unusually good idea from a professor: evaluate an interface under genuinely realistic conditions — while driving a car. Testing complex interaction concepts behind the wheel is neither safe nor legal, so the question became how to measure an interface's resilience under distraction without putting anyone on the road.
The birth of Blinky
Our first plan was to demonstrate the method on the university grounds for an authentic test environment. When the insurer declined to provide the necessary coverage, we rethought it from scratch. The result was Blinky, a web application that does exactly what earlier test concepts were missing: it deliberately taxes the user's attention and records every relevant data point while doing so. It's genuinely fun to use — and it surfaces real insight into how usable an interface stays under pressure.
How does Blinky work?
You configure a custom stress test by setting parameters like test duration and the number of events to trigger. Once configured, the app generates a QR code; scan it, and the test begins. All connected devices then start blinking in a predefined pattern and fire an audible alarm, each of which the user has to acknowledge. This gives us precise reaction-time monitoring and a rich dataset to analyze afterward.
Beyond these core features, Blinky offers full user management: administrators manage accounts, control access rights, and save past tests to re-run or modify them.
The technical roadmap: what's under the hood?
Real-time communication with WebSockets
The backbone of Blinky is WebSockets, which open a persistent, bidirectional connection between server and clients — unlike conventional HTTP requests.
Learning 1: The WebSocket
• Why WebSockets? They enable continuous real-time communication — ideal for stress tests where fast reaction times and instant synchronization across every connected device matter.
• System architecture: Our clients (both hosts and participants) connect over dedicated URLs — hosts directly, while participants join the session via an appended group parameter. Messages flow in a standardized format, {type: "typeOfMessage", data: "objectWithData"}. Typical messages include socket_opened (connection confirmed), new_client (a new participant), trigger (fire an action, e.g. blink), and stop (end the session for all clients).
That architecture lets us steer every device in perfect sync — a decisive factor for coordinated stress tests.
Switching to Svelte
Learning 2: Svelte was the right call
We originally planned to use Vue.js for the frontend. But a few evaluation hours in — mostly fighting friction between TypeScript and Vue — we switched to Svelte. It turned out to be the right move: it slotted into the project seamlessly and made the whole developer experience considerably more enjoyable.
Styling and UI — Svelte, Tailwind & Skeleton/Flowbite
Learning 3: Svelte with Tailwind & Skeleton/Flowbite is a pleasure
For styling we paired Tailwind CSS with UI components from Skeleton and Flowbite. The combination gave us fast, flexible styling — defining styles directly in the markup instead of writing long CSS files — and a responsive, polished interface that looks great and reacts instantly on every device.
Data management with PocketBase
Learning 4: PocketBase for data management
To manage accounts, test results, and other relevant information efficiently, we chose PocketBase. It's lightweight and quick for database operations, offers a powerful infrastructure for real-time data exchange, and its document-oriented structure scales nicely with a growing project — and, full disclosure, the adorable mascot didn't hurt.
A look at the frontend architecture
Our frontend is built on Svelte and modular by design: a dedicated WebSocket module sets up and manages the connection; session functions like startSession, triggerDevice, and stopSession steer the real-time interactions; components let users start tests, trigger devices, and visualize results live; and Svelte stores keep the whole UI reactively up to date so results are always current.
Conclusion: stress, analyze, improve
Blinky is more than an app — it's a tool that makes interface stress testing possible in a controlled environment. By combining modern technologies like WebSockets, Svelte, and PocketBase, it became a platform that is technically convincing as well as user-friendly and efficient. It gives developers and designers a way to test the resilience of their interfaces under real conditions and gather valuable data that feeds straight back into making interfaces that stay intuitive even under pressure.
Curious? Come visit blinky.bandy-app.com and see for yourself how to properly “stress” an interface with modern technology. Building Blinky was an exciting ride full of challenges and genuine learning — exactly the kind of project I enjoy most.