The guide behind the reel

Build a Windows/Mac desktop AI pet (Electron)

You’ll end up with a real desktop pet that sits on top of your screen. It’s not a webpage demo. It visits you on its own, can remind you about water and breaks, and it can chat in a compact way. You’ll also have settings for frequency, quiet hours, size, and whether AI mode is on.

Watch the reel@okaashish

What you need

4 things

The steps

12 steps

  1. Start with the core app prompt

    Copy the prompt below as-is. This is the spec you want the project to follow. It’s the only way to keep the behavior consistent: transparent always-on-top pet window, speech-bubble visits, summon button, tray menu, chat, two AI modes, and a settings screen.

    • Build me a complete working animated desktop AI pet app for Windows/Mac.
This should not be a webpage demo. I want a real desktop pet that lives on top of my computer screen like old desktop companions.
Use Electron unless there is a better lightweight desktop-app choice.
I will provide one reference image of the pet character [see attached image]. Use it as the visual reference and make the final pet look as close as possible to that image. If only one image is provided, create convincing animation using transforms, bobbing, blinking, squash/stretch, walking motion, and entering/leaving animations. Keep the code structured so I can replace or add sprite frames later.
Core requirements:
1. Desktop pet window
- Transparent background
- Frameless window
- Always on top
- No title bar
- Only the character should visually appear
- Must not look like a rectangular app window
- Should not block the whole screen
- Medium pet size by default
- Pet should appear near the bottom of the screen
2. Animation
- Idle breathing/bobbing
- Blinking
- Walking motion
- Turning left/right
- Entering screen
- Leaving screen
- Occasional small wandering
- Movement should feel cute and alive, not like a flat image sliding
3. Visits/reminders
- By default, every 5 minutes the pet should visit me
- Pet walks onto screen, stops, shows a small speech bubble, then leaves after around 10-30 seconds
- Do not use OS notifications
- The reminder must come from the pet itself
- Speech bubble must not cover the pet’s face
- Put the bubble beside the pet with a small pointer toward the character
- Keep messages short and relevant
Message categories should mainly be:
- greeting/check-in
- water reminder
- stretch reminder
- break reminder
- mood/work check-in
Example messages:
- “Hi, how are you doing?”
- “Hi, checking in.”
- “Hi, need a break?”
- “Hi, want some water?”
- “Hi, quick stretch?”
- “Hi, water check.”
- “Hi, still doing okay?”
Avoid irrelevant/random comments. The pet should feel helpful and companion-like.
4. Water reminders
- Include water reminders
- Let me change water reminder frequency in Settings
5. Summon controls
- Add a small floating summon button on the edge of the desktop
- It should use the pet/avatar icon
- It should be visible and draggable
- It should clamp to the visible screen so it cannot disappear off-screen
- Clicking it summons the pet immediately
- Also add a system tray icon with:
 - Summon Pet
 - Chat
 - Settings
 - Pause Pet
 - Quit
6. Chat
- Clicking the pet opens a compact chat box next to it
- The chat should feel like part of the pet, not a big ChatGPT interface
- Include:
 - previous messages in current conversation
 - text input
 - send button
 - close button
- Basic/offline mode should respond naturally to greetings like:
 - “hi”
 - “nice to meet you”
 - “how are you”
 - “I’m tired”
 - “I need water”
 - “I’m stressed”
- Responses should be short, warm, and relevant
7. AI mode
- Support two modes:
 - Basic mode: works without an API key using built-in responses
 - AI mode: uses OpenAI API if I add an API key
- Store API key securely, never hard-code it
- Put pet personality in a separate editable config file
- Use this personality:
 “You are a tiny desktop companion. You are friendly, slightly playful and concise. You help the user remember to drink water, stretch and take breaks, but you are not annoying or overly enthusiastic. Most responses should be 1-2 sentences. Talk like a small companion sitting on the user's desktop, not like an AI assistant.”
8. Settings screen
Create a simple settings screen with:
- Enable/disable pet
- Visit frequency: 5 min, 10 min, 15 min, 30 min, 1 hour, custom
- Water reminder frequency
- Check-ins on/off
- Sound on/off
- Animation speed
- Pet size
- AI chat on/off
- API key
- Launch when computer starts
- Always on top
- Quiet hours
9. Quiet mode
Allow:
- Pause for 30 minutes
- Pause for 1 hour
- Pause until tomorrow
- Resume
During pause, random visits stop, but manual summon still works.
10. Local persistence
Save locally:
- settings
- reminder timing
- pet size
- summon button position
- quiet hours
Conversation history does not need to persist after closing.
11. Usability
Assume I am not technical.
Provide:
- a complete project folder
- a simple launcher script I can double-click
- a “bring on screen” launcher that resets pet/button position if they disappear
- a README explaining how to run it
Important implementation details:
- Use a transparent frameless always-on-top Electron window for the pet
- Use a separate tiny always-on-top draggable window for the summon button
- Use system tray controls
- Use local config files for messages and personality
- Keep CPU usage low when idle/hidden
- Validate the app launches successfully

  2. Personality and message style you must bake in

    This is the exact tone the pet should use. Make sure the personality is stored in a separate editable config file, and that most responses are 1-2 sentences like a small companion on your desktop.

    • You are a tiny desktop companion. You are friendly, slightly playful and concise. You help the user remember to drink water, stretch and take breaks, but you are not annoying or overly enthusiastic. Most responses should be 1-2 sentences. Talk like a small companion sitting on the user's desktop, not like an AI assistant.

  3. Set the visit behavior and speech bubble rules

    Configure visits so they feel like the pet itself is doing the reminder, not like the OS is popping alerts. By default it should visit every 5 minutes, walk onto the screen, stop, show a small speech bubble, then leave after around 10-30 seconds. The bubble must be beside the pet, with a small pointer toward the character, and it must not cover the pet’s face.

    • Visit frequency default: every 5 minutes
    • Visit duration: around 10-30 seconds
    • Speech bubble placement: beside the pet with a small pointer toward the character
    • Speech bubble rule: must not cover the pet’s face
    • Reminder rule: do not use OS notifications; reminder must come from the pet itself
    • Message categories: greeting/check-in, water reminder, stretch reminder, break reminder, mood/work check-in
    • Example messages:
- “Hi, how are you doing?”
- “Hi, checking in.”
- “Hi, need a break?”
- “Hi, want some water?”
- “Hi, quick stretch?”
- “Hi, water check.”
- “Hi, still doing okay?”

  4. Implement water reminders with Settings control

    Add water reminders as a first-class reminder type. The user should be able to change the water reminder frequency inside Settings. This is also tied to the overall reminder schedule the pet uses.

    • Water reminder: include water reminders
    • Settings requirement: let me change water reminder frequency in Settings

  5. Add summon controls: floating button + system tray

    You want two ways to bring the pet back: a draggable summon button and a system tray menu. The summon button should be small, visible, draggable, and clamped to the visible screen so it cannot disappear off-screen. Clicking it summons the pet immediately.

    • Summon button:
- small floating summon button on the edge of the desktop
- uses the pet/avatar icon
- visible and draggable
- clamps to visible screen so it cannot disappear off-screen
- clicking summons the pet immediately
    • System tray icon menu items:
- Summon Pet
- Chat
- Settings
- Pause Pet
- Quit

  6. Wire the pet click chat box

    Clicking the pet should open a compact chat box next to it. It should look like part of the pet, not a big ChatGPT interface. The chat should include previous messages in the current conversation, a text input, a send button, and a close button. In Basic/offline mode, it should respond naturally to specific greetings and states. Keep responses short, warm, and relevant.

    • Chat UI behavior:
- clicking the pet opens a compact chat box next to it
- chat feels like part of the pet, not a big ChatGPT interface
    • Chat UI elements:
- previous messages in current conversation
- text input
- send button
- close button
    • Basic/offline mode should respond naturally to greetings like:
- “hi”
- “nice to meet you”
- “how are you”
- “I’m tired”
- “I need water”
- “I’m stressed”
    • Response style: short, warm, relevant

  7. Support two AI modes (Basic + OpenAI)

    Add two modes: Basic mode that works without an API key using built-in responses, and AI mode that uses the OpenAI API if an API key is provided. Store the API key securely and never hard-code it. Keep the pet personality in a separate editable config file so you can change tone without touching code.

    • AI mode options:
- Basic mode: works without an API key using built-in responses
- AI mode: uses OpenAI API if I add an API key
    • Security requirement: Store API key securely, never hard-code it
    • Personality storage: Put pet personality in a separate editable config file

  8. Create the Settings screen controls

    Build a simple settings screen with everything the user might want to tune: enabling the pet, visit frequency, water reminder frequency, check-ins, sound, animation speed, pet size, AI chat toggle, API key, launch on startup, always on top, and quiet hours. This is where the pet becomes truly usable for a non-technical person.

    • Settings screen controls:
- Enable/disable pet
- Visit frequency: 5 min, 10 min, 15 min, 30 min, 1 hour, custom
- Water reminder frequency
- Check-ins on/off
- Sound on/off
- Animation speed
- Pet size
- AI chat on/off
- API key
- Launch when computer starts
- Always on top
- Quiet hours

  9. Add quiet mode pauses that still allow manual summon

    Quiet mode must support multiple pause durations. During pause, random visits stop. Manual summon still works. Provide resume when the user wants the pet back.

    • Quiet mode options:
- Pause for 30 minutes
- Pause for 1 hour
- Pause until tomorrow
- Resume
    • Quiet mode rule: During pause, random visits stop, but manual summon still works.

  10. Persist settings locally and keep chat history non-persistent

    Save local state so the pet remembers preferences and positions across restarts. Settings, reminder timing, pet size, summon button position, and quiet hours should all be saved locally. Conversation history does not need to persist after closing.

    • Local persistence items to save:
- settings
- reminder timing
- pet size
- summon button position
- quiet hours
    • Conversation persistence rule: Conversation history does not need to persist after closing.

  11. Make it non-technical friendly: launcher + README + bring on screen

    Even if the app is technically complex, the delivery needs to be simple. Provide a complete project folder, a simple launcher script the user can double-click, and a “bring on screen” launcher that resets pet/button position if they disappear. Also include a README explaining how to run it.

    • Provide:
- a complete project folder
- a simple launcher script I can double-click
- a “bring on screen” launcher that resets pet/button position if they disappear
- a README explaining how to run it

  12. Use the right Electron implementation details (and keep CPU low)

    These are the implementation details that make it feel like a desktop companion. Use a transparent frameless always-on-top Electron window for the pet. Use a separate tiny always-on-top draggable window for the summon button. Use system tray controls. Use local config files for messages and personality. Keep CPU usage low when idle or hidden. Validate the app launches successfully.

    • Pet window implementation:
- Use a transparent frameless always-on-top Electron window for the pet
    • Summon button implementation:
- Use a separate tiny always-on-top draggable window for the summon button
    • Controls:
- Use system tray controls
    • Data:
- Use local config files for messages and personality
    • Performance:
- Keep CPU usage low when idle/hidden
    • Validation:
- Validate the app launches successfully

That is the whole thing

If a step did not work the way I said, tell me in the comments on the reel: I fix these.

Watch the reelMore guides