<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>Forem: hiehoo</title>
    <description>The latest articles on Forem by hiehoo (@hiehoo).</description>
    <link>https://forem.com/hiehoo</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F883335%2Fefac0c88-26a6-4f47-9c32-f1662568c16d.png</url>
      <title>Forem: hiehoo</title>
      <link>https://forem.com/hiehoo</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://forem.com/feed/hiehoo"/>
    <language>en</language>
    <item>
      <title>I gave my AI coding assistant a body — and now it lives in my terminal</title>
      <dc:creator>hiehoo</dc:creator>
      <pubDate>Thu, 02 Apr 2026 09:55:22 +0000</pubDate>
      <link>https://forem.com/hiehoo/i-gave-my-ai-coding-assistant-a-body-and-now-it-lives-in-my-terminal-2ijl</link>
      <guid>https://forem.com/hiehoo/i-gave-my-ai-coding-assistant-a-body-and-now-it-lives-in-my-terminal-2ijl</guid>
      <description>&lt;h2&gt;
  
  
  The problem with invisible AI
&lt;/h2&gt;

&lt;p&gt;I code with Claude every day. It's genuinely helpful. But the interaction is... clinical. Text in, text out. No personality. No sense that something is &lt;em&gt;there&lt;/em&gt; with me.&lt;/p&gt;

&lt;p&gt;I kept thinking: what if your AI assistant had a presence? Not a chatbot avatar. Something that &lt;em&gt;reacts&lt;/em&gt; to what you're doing. Gets happy when tests pass. Gets tired when you've been coding for 6 hours straight. Has idle thoughts while you're reading docs.&lt;/p&gt;

&lt;p&gt;So I built it.&lt;/p&gt;

&lt;h2&gt;
  
  
  Meet Oh My Kira
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fpurhde3hw25kbid083og.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fpurhde3hw25kbid083og.gif" alt="Animated GIF of Oh My Kira in a terminal side-pane, showing a pixel art character reacting to code changes and displaying hunger/energy stats" width="450" height="400"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Oh My Kira is a terminal renderer that displays an animated companion next to your code. It hooks into Claude code's state file and reacts in real time.&lt;/p&gt;

&lt;p&gt;Your buddy has:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Animated sprites&lt;/strong&gt; — different animations for idle, working, happy, tired, error states&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Live stat bars&lt;/strong&gt; — hunger, happiness, energy, hygiene (yes, really)&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;XP and evolution&lt;/strong&gt; — your buddy levels up as you code&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Speech bubbles&lt;/strong&gt; — random thoughts, reactions to your session&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Streak tracking&lt;/strong&gt; — consecutive coding days&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;It's a Tamagotchi that lives in your terminal and watches you code.&lt;/p&gt;

&lt;h2&gt;
  
  
  How it works
&lt;/h2&gt;

&lt;p&gt;The renderer watches a JSON state file that gets updated by the Claude Buddy plugin during coding sessions. When the state changes, the renderer:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Resolves which &lt;strong&gt;visual state&lt;/strong&gt; to display (idle? working? error? happy?)&lt;/li&gt;
&lt;li&gt;Loads the right &lt;strong&gt;spritesheet&lt;/strong&gt; and slices it into frames&lt;/li&gt;
&lt;li&gt;Renders the animation using the &lt;strong&gt;Kitty graphics protocol&lt;/strong&gt; (escape sequences that display images inline in your terminal)&lt;/li&gt;
&lt;li&gt;Draws stat bars, XP progress, and speech bubbles around the sprite&lt;/li&gt;
&lt;li&gt;Adapts the layout to your &lt;strong&gt;terminal size&lt;/strong&gt; — works in a narrow side pane or a full window&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Everything runs in a single terminal pane. No browser. No Electron. Just escape sequences.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;+------------------------------------------+
|        "hmm, interesting approach..."     |
|                                           |
|            [animated sprite]              |
|                                           |
+== My Agent ===============================+
| egg -&amp;gt; baby                               |
| XP ████░░░░░░░░░░░░░░░░ 25               |
|                                           |
| Hunger  ████████████████████              |
| Happy   ███████████████████░              |
| Energy  ███████████████████░              |
| Hygiene ███████████████████░              |
|                                           |
| 🔥 8-day streak                           |
+------------------------------------------+
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;

&lt;h2&gt;
  
  
  The tech
&lt;/h2&gt;

&lt;p&gt;Built with Node.js and zero frontend frameworks:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;sharp&lt;/strong&gt; — spritesheet slicing and background removal&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;chokidar&lt;/strong&gt; — file watching for state changes&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Kitty graphics protocol&lt;/strong&gt; — renders images directly in the terminal via escape sequences&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;The whole thing is ~8 files in &lt;code&gt;lib/&lt;/code&gt;. No build step. No bundler.&lt;/p&gt;

&lt;p&gt;It works on any terminal that supports the Kitty graphics protocol — &lt;a href="https://ghostty.org" rel="noopener noreferrer"&gt;Ghostty&lt;/a&gt; and &lt;a href="https://sw.kovidgoyal.net/kitty/" rel="noopener noreferrer"&gt;Kitty&lt;/a&gt; are the two main ones.&lt;/p&gt;
&lt;h2&gt;
  
  
  Art packs
&lt;/h2&gt;

&lt;p&gt;The companion's look is fully customizable through &lt;strong&gt;art packs&lt;/strong&gt; — directories of spritesheets with a config file that maps states to animations.&lt;/p&gt;

&lt;p&gt;Two packs are bundled:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Kira&lt;/strong&gt; — anime-style companion&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;WPenguin&lt;/strong&gt; — pixel art penguin&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Creating your own is straightforward. Drop spritesheets into a folder, write a &lt;code&gt;pack.json&lt;/code&gt; that maps states to sheets:&lt;br&gt;

  Click to see the full pack.json structure
  &lt;br&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight json"&gt;&lt;code&gt;&lt;span class="p"&gt;{&lt;/span&gt;&lt;span class="w"&gt;
  &lt;/span&gt;&lt;span class="nl"&gt;"name"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="s2"&gt;"My Pack"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="w"&gt;
  &lt;/span&gt;&lt;span class="nl"&gt;"format"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="s2"&gt;"spritesheet-grid"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="w"&gt;
  &lt;/span&gt;&lt;span class="nl"&gt;"frame_size"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="p"&gt;{&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="nl"&gt;"width"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="mi"&gt;768&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="nl"&gt;"height"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="mi"&gt;448&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="p"&gt;},&lt;/span&gt;&lt;span class="w"&gt;
  &lt;/span&gt;&lt;span class="nl"&gt;"grid_cols"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="mi"&gt;4&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="w"&gt;
  &lt;/span&gt;&lt;span class="nl"&gt;"state_map"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="p"&gt;{&lt;/span&gt;&lt;span class="w"&gt;
    &lt;/span&gt;&lt;span class="nl"&gt;"idle"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt;    &lt;/span&gt;&lt;span class="p"&gt;{&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="nl"&gt;"sheet"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="s2"&gt;"idle.png"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="w"&gt;   &lt;/span&gt;&lt;span class="nl"&gt;"frames"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="mi"&gt;10&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="nl"&gt;"interval_ms"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="mi"&gt;100&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="p"&gt;},&lt;/span&gt;&lt;span class="w"&gt;
    &lt;/span&gt;&lt;span class="nl"&gt;"working"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="p"&gt;{&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="nl"&gt;"sheet"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="s2"&gt;"typing.png"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="nl"&gt;"frames"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="mi"&gt;8&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="w"&gt;  &lt;/span&gt;&lt;span class="nl"&gt;"interval_ms"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="mi"&gt;120&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="w"&gt;
  &lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="w"&gt;
&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="w"&gt;
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;




&lt;/p&gt;

&lt;p&gt;If you've ever made pixel art or have sprite assets lying around — they work here.&lt;/p&gt;
&lt;h2&gt;
  
  
  Try it
&lt;/h2&gt;


&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;git clone https://github.com/lukebaze/oh-my-kira.git
&lt;span class="nb"&gt;cd &lt;/span&gt;oh-my-kira
npm &lt;span class="nb"&gt;install
&lt;/span&gt;npm &lt;span class="nb"&gt;link
&lt;/span&gt;oh-my-kira &lt;span class="nt"&gt;--watch&lt;/span&gt; ~/.claude/buddy/state.json
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;


&lt;p&gt;Or if you have Claude Buddy installed, just run &lt;code&gt;/buddies launch&lt;/code&gt; and it splits your Ghostty terminal automatically.&lt;/p&gt;
&lt;h2&gt;
  
  
  What's next
&lt;/h2&gt;

&lt;p&gt;This is early. Things I'm thinking about:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;More art packs (contributions welcome)&lt;/li&gt;
&lt;li&gt;Sound effects (yes, really)&lt;/li&gt;
&lt;li&gt;Multi-buddy support&lt;/li&gt;
&lt;li&gt;A web-based art pack editor&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;If you think coding should have a little more personality — give it a star, try it out, or make your own art pack.&lt;/p&gt;


&lt;div class="ltag-github-readme-tag"&gt;
  &lt;div class="readme-overview"&gt;
    &lt;h2&gt;
      &lt;img src="https://assets.dev.to/assets/github-logo-5a155e1f9a670af7944dd5e12375bc76ed542ea80224905ecaf878b9157cdefc.svg" alt="GitHub logo"&gt;
      &lt;a href="https://github.com/lukebaze" rel="noopener noreferrer"&gt;
        lukebaze
      &lt;/a&gt; / &lt;a href="https://github.com/lukebaze/oh-my-kira" rel="noopener noreferrer"&gt;
        oh-my-kira
      &lt;/a&gt;
    &lt;/h2&gt;
    &lt;h3&gt;
      Terminal renderer for Claude Buddy — displays your coding companion via Kitty graphics protocol
    &lt;/h3&gt;
  &lt;/div&gt;
  &lt;div class="ltag-github-body"&gt;
    
&lt;div id="readme" class="md"&gt;
&lt;div&gt;
&lt;div class="markdown-heading"&gt;
&lt;h1 class="heading-element"&gt;Oh My Kira&lt;/h1&gt;
&lt;/div&gt;

&lt;p&gt;&lt;strong&gt;Your coding companion, alive in the terminal.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;A real-time animated sprite renderer for &lt;a href="https://github.com/anthropics/claude-code" rel="noopener noreferrer"&gt;Claude Buddy&lt;/a&gt; that brings your AI coding companion to life — right next to your code.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://nodejs.org" rel="nofollow noopener noreferrer"&gt;&lt;img src="https://camo.githubusercontent.com/78cb0571da24a6d7c4038dcb3415d44c8432aa181d96c146def632bab7540557/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f6e6f64652d25334525334431382d627269676874677265656e3f6c6f676f3d6e6f64652e6a73266c6f676f436f6c6f723d7768697465" alt="Node.js"&gt;&lt;/a&gt;
&lt;a href="https://ghostty.org" rel="nofollow noopener noreferrer"&gt;&lt;img src="https://camo.githubusercontent.com/0436f70dbb91110126a599d6dc5d79cec8110c2361ed6e662fd9096159fa2bd4/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f7465726d696e616c2d47686f737474792532302537432532304b697474792d626c75653f6c6f676f3d676e6f6d657465726d696e616c266c6f676f436f6c6f723d7768697465" alt="Terminal"&gt;&lt;/a&gt;
&lt;a href="https://github.com/lukebaze/oh-my-kira/LICENSE" rel="noopener noreferrer"&gt;&lt;img src="https://camo.githubusercontent.com/07a7d0169027aac6d7a0bfa8964dfef5fbc40d5a2075cabb3d8bc67e17be3451/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f6c6963656e73652d4d49542d79656c6c6f772e737667" alt="License: MIT"&gt;&lt;/a&gt;&lt;/p&gt;
&lt;br&gt;
&lt;a rel="noopener noreferrer" href="https://github.com/lukebaze/oh-my-kira/assets/screenshots/demo.gif"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fraw.githubusercontent.com%2Flukebaze%2Foh-my-kira%2FHEAD%2Fassets%2Fscreenshots%2Fdemo.gif" alt="Oh My Kira — animated coding companion in terminal" width="520"&gt;&lt;/a&gt;
&lt;br&gt;
&lt;p&gt;&lt;em&gt;Kira reacts to your coding session in real time — mood, stats, speech bubbles, and all.&lt;/em&gt;&lt;/p&gt;
&lt;/div&gt;

&lt;div class="markdown-heading"&gt;
&lt;h2 class="heading-element"&gt;What is this?&lt;/h2&gt;
&lt;/div&gt;
&lt;p&gt;Oh My Kira renders an &lt;strong&gt;animated companion&lt;/strong&gt; in a terminal pane while you code with Claude. It watches the buddy state file and displays:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Animated sprites&lt;/strong&gt; that react to mood and activity&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Live stat bars&lt;/strong&gt; — hunger, happiness, energy, hygiene&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;XP &amp;amp; evolution&lt;/strong&gt; — level up your buddy over time&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Speech bubbles&lt;/strong&gt; — idle thoughts and reactions&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Streak tracking&lt;/strong&gt; — consecutive coding days&lt;/li&gt;
&lt;/ul&gt;
&lt;div class="snippet-clipboard-content notranslate position-relative overflow-auto"&gt;
&lt;pre class="notranslate"&gt;&lt;code&gt;+------------------------------------------+
|        "hmm, interesting approach..."     |
|                                           |
|            [animated sprite]              |
|                                           |
+== My Linh ===============================+
| egg -&amp;gt; baby                               |
| XP ████░░░░░░░░░░░░░░░░ 25               |
|                                           |
| Hunger  ████████████████████              |
| Happy&lt;/code&gt;&lt;/pre&gt;…&lt;/div&gt;
&lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="gh-btn-container"&gt;&lt;a class="gh-btn" href="https://github.com/lukebaze/oh-my-kira" rel="noopener noreferrer"&gt;View on GitHub&lt;/a&gt;&lt;/div&gt;
&lt;/div&gt;


</description>
      <category>opensource</category>
      <category>terminal</category>
      <category>javascript</category>
      <category>ai</category>
    </item>
  </channel>
</rss>
