Summary & Context

Livebook is an open-source, interactive code notebook platform for Elixir that enables developers, data scientists, and machine learning engineers to write code, visualize data, and run AI models in real time. 

When I joined as the Solo Product DESIGNER, Jonatan Kłosko had built an early, functional skeleton prototype. While the underlying technology was brilliant, the UI was barebones and lacked visual hierarchy, layout logic, and scalable design tokens. The logo existed, but its color palette and visual identity needed refinement to feel like a modern, developer-grade tool. Working in direct partnership with José Valim and Jonatan Kłosko,

 I owned the end-to-end UX/UI architecture. Together, we transformed an early technical prototype into a polished, high-adoption open-source platform with over 5,000+ GitHub stars.

Core UX & Architectural Challenges

Designing tools for developers demands low latency, zero visual clutter, keyboard-driven efficiency, and high spatial density.

Challenge A: Real-Time Multi-User Collaboration

The Problem:
Developers needed to pair-program and run live code cells simultaneously within the same notebook without stepping on each other's execution states.

The UX Solution:
Modeled multiplayer visual indicators—such as live multiplayer cursors, user presence badges, and active cell locks—directly into the execution canvas so teams could collaborate seamlessly.

Challenge B: "Smart Cells" (Bridging Code & No-Code UI)