8000 GitHub - sizzlebop/vscode-cheerleader: Supercharge your dev experience with an anime coding companion
[go: up one dir, main page]
More Web Proxy on the site http://driver.im/
Skip to content

sizzlebop/vscode-cheerleader

 
 

Repository files navigation

VSCode Cheerleader

Supercharge your dev experience with an anime coding companion!

Watch Full Demo

Important

We rely on LLMs provided through GitHub Copilot, so you must have Copilot enabled in your workspace.

Features

Cheerleader brings a fun, interactive anime assistant to your VS Code environment that helps you stay motivated, productive, and engaged while coding with editor support and AI mentor.

Coding with Cheerleader
Coding with your anime companion

  • Interactive Avatar: A fully customizable character that reacts to your mouse movements and clicks, bringing your workspace to life.

  • Voice Interaction: Hit a roadblock? Talk it out with cheerleader — voice-first help that does everything Copilot Chat can, but with extra flair and personality.

  • Motivation Boost: Get real-time encouragement and compliments based on your coding activity, console results, and LSP feedback.

  • Focus and Wellness: Stay on track with productivity nudges and reminders to take breaks or end sessions for a healthier workflow.

Note

For a detailed description of each feature, please refer to this page

Usage

Some background features can be configured in the sidebar, refer to the Setup and Configuration section below. Other features can be accessed through the overlay UI:

Try out interactive features
Try out interactive features!

Setup and Configuration

API Keys Management

You must provide your own ElevenLabs API key for text-to-speech and speech-to-textn features. It can be obtained for free with quite generous usage limits by signing up for an account at their website.

Caution

In the pre-release version, we used to support both ElevenLabs and HuggingFace. However, we have currently discontinued support for HuggingFace since the Kokoro TTS API is not reliable.

Note

In future releases, we might consider adding local TTS and STT models to avoid the need for API keys. However, this will make the extension less accessible to many users who do not have the required hardware since these models are quite large.

Settings

You can configure the following settings in the sidebar (with cheerleader icon) OR the original settings panel (Ctrl+Shift+P -> Preferences: Open Settings (UI)):

Settings
Sidebar (left) and VSCode settings panel (right)

Available setitngs include:

  • API Keys: Enter your ElevenLabs or Hugging Face API key for TTS and STT features.

  • Copilot Models: Choose which Copilot models to use for inline chat and code review. Currently, we support gpt4o, gpt4o-mini, and claude-3.5-sonnet. Note that o1 and o1-mini are said to be supported in their documentation but somehow not in reality...

  • Anime Character: Choose your favorite anime character from the list. The cheerleader will reload with the new character after a few seconds.

  • Features Toggle: Enable or disable different features of the cheerleader.

  • Feature Settings: Configure settings like break reminder interval, time to quit session, etc from both the sidebar and the original settings panel

Note

In a future release soon you will be able to bring any Live2D model you want by providing a URL. We will also expand the default catalog to include characters other than anime.

Installation

VSCode Extensions Marketplace

We are officially listed on the VSCode Marketplace. Just search for "Cheerleader" in the extensions tab of VSCode and install it from there.

From VSIX

We provide a packaged version of the extension for every major and minor release. You can find the latest version and download the cheerleader-<version>.vsix file from the Releases page.

Then, open VSCode and go to the extensions tab. Under more options, select "Install from VSIX" and select the .vsix file you just built to install it.

Install from VSIX

From Source

node.js and npm are required for installing from source. You can install them from npm's official website.

  1. Clone the repo:

    git clone https://github.com/endernoke/vscode-cheerleader
  2. Install electron.js, which is required for rendering the interactive cheerleader. We recommend installing globally so you don't need to install it individually for every workspace.

    npm install -g electron
  3. Install project dependencies:

    npm install
  4. Install the VScode extension CLI

    npm install -g @vscode/vsce
  5. In the project directory, run the following command to generate a .vsix file:

    cd path/to/vscode-cheerleader
    vsce package
  6. This tool will generate a .vsix file in the current directory. You can then install it in VSCode following the instructions in From VSIX.

How It Works

Cheerleader is the world's first interactive anime assistant for VSCode powered by VSCode API and Copilot.

how-it-works

In addition, the character avatar is rendered using the PixiJS library, which is a 2D rendering engine that uses WebGL and HTML5. The character model is built using Live2D technology.

In the future, we plan to extend more unique functionalities to the cheerleader that would make programming more fun and engaging while also improving productivity and convenience.

Note

We welcome contributions and suggestions from the community so that we know what features you would like to see in the future. Feel free to open an issue or PR on our GitHub repository.

Philosophy

We believe coding should feel less like solitary, mundane work and more like a creative jam session. That’s why we built the cheerleader — not just as an assistant, but as a vibrant, voice-driven companion that brings energy, motivation, and a bit of fun to your coding flow.

Most coding agents today (like Copilot, Cursor, or Roo) are powerful but sterile — all utility, no personality. They’re optimized for efficiency, but forget that creativity thrives in an environment that’s playful, human, and a little unexpected. We’re flipping the script by making human-computer interaction not only smart, but emotionally engaging.

We also see coding as inherently social — even when you’re solo. Whether you’re rubber-ducking a bug or celebrating a passing test, the cheerleader is there to respond, react, and cheer you on in real time.

Importantly, we’re not trying to replace mature agentic tools which are optimized and excellent. Cheerleader is here to complement and emphasize reflection and growth. It’s ideal for moments when you want to think through a problem, like grinding LeetCode or learning a new language — not just vibe code your way through it. Our goal isn’t to automate away the effort, but to make the effort more meaningful. That’s how human skill is perfected.

We're building a collaborator with charm. One that talks, listens, celebrates small wins, and nudges you forward when you hit a wall. Programming should be powerful and delightful. That’s our philosophy.

Commands Catalog

If you wish to execute any of the commands manually, you can do so by opening the command palette (Ctrl+Shift+P) and type the command name:

  • cheerleader.launchOverlay: Launch the cheerleader overlay

  • cheerleader.killOverlay: Stop the cheerleader overlay

  • cheerleader.inlineChat: Open a text-based inline chat for the current file

  • cheerleader.inlineChatVoice: Start a voice-based inline chat for the current file (Key binding: ctrl/cmd+shift+c)

  • cheerleader.rubberDuckVoice: Start a voice-based rubber duck debugging session (Key binding: ctrl/cmd+shift+d)

  • cheerleader.reviewCode: Run a code review on the current file (Key binding: ctrl/cmd+shift+r)

  • cheerleader.explainPastedCode: Explain the pasted code

  • cheerleader.toggleEncouragement: Toggle encouragement features on/off

  • cheerleader.toggleMonitoringRotting: Toggle productivity monitoring

  • cheerleader.togglePasteMonitoring: Toggle paste me feature

The following commands are used for testing and development purposes, categorized under "Testing":

  • cheerleader.record: Test recording audio
  • cheerleader.testTTS: Test text-to-speech functionality
  • cheerleader.testEncouragement: Test encouragement messages

Contributing

This is an open-source project and we welcome contributions! Let's make VSCode a more fun and productive place for developers by reimagining human-computer interaction. Please refer to the CONTRIBUTING.md file for guidelines on how to contribute.

License

Released under the MIT License.

The interactive anime cheerleader is built with live2d. Note that none of the live2d models used are owned by the authors of this repository. The copyrights of all Live2D models, images, and motion data belong to their respective original authors (e.g. HakkoAI). They should not be used for commercial purposes.

You can visit the official Live2D website or their GitHub repo for more information about the technology and its licensing:

Live2D Cubism Core is provided under the Live2D Proprietary Software License.

Live2D Cubism Components are provided under the Live2D Open Software License.

The terms and conditions do prohibit modification, but obfuscating in live2d.min.js would not be considered illegal modification (source).

Credits

Authors: James Zheng, Jet Chiang

We salute to the authors and contributors of the following awesome repositories/projects:

About

Supercharge your dev experience with an anime coding companion

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • TypeScript 79.8%
  • JavaScript 18.4%
  • CSS 1.3%
  • HTML 0.5%
0