Inspiration
I (Alvin) was inspired by my partner, Elisha, who is also working with me on this project. She's just getting into development, and was the one who designed all of the characters for Kaizer (and the name).
She absolutely loves animals, and has five currently (two parrots, two dogs, one cat), and she plays with each and every single animal she can find, any chance she gets.
I came up with the idea for Kaizer because sometimes it can all get too much, especially while first learning something. I hoped that Kaizer could be something that could make her smile when she felt lost.
What it does
Kaizer lets you add a virtual buddy in VS Code that you can interact with using the Command Palette (Ctrl+Shift+P or Cmd+Shift+P on macOS). We have a total of four characters planned - Pengu, Dobby, Kathy and Pandora, with Pengu in this current version.
How we built it
We relied heavily on VS Code's documentation for extensions, and built on top of their code examples. We've written the extension in TypeScript and use Rive for the animations.
To let us render the Rive animations in VS Code, we make use of Webviews.
Challenges we ran into
- Figuring out how to use and animate in Rive
- Setting up the VS Code extension properly
Accomplishments that we're proud of
- Elisha designed four characters
- Alvin learnt how to make a VS Code extension
- Elisha learnt to write Markdown, for our README
- We made our first animation in Rive
What we learned
- Rive
- TypeScript
- VS Code Extensions
- Markdown
What's next for Kaizer
We'd love to finish up our four animals, and possibly add even more. We might also look into Webview views, which let you use VS Code Webviews inside a panel, which could be cool. We also hope to add more functionality when it comes to the range of commands available, and add persistence so we can save state between reloads.
Built With
- javascript
- node.js
- rive
- typescript
- vscode
Log in or sign up for Devpost to join the conversation.