Inspiration

I’ve wanted to build a tool like MangaCards for a while now. Something that would let me learn Japanese directly from manga, without the friction of manual flashcard creation.

The idea lingered as a "someday" project until the Gemini hackathon, which gave me the push to finally bring it to life.

To my surprise, Gemini CLI made the development process shockingly smooth. What I thought would take weeks of coding became a reality in days, thanks to Gemini’s ability to handle everything from text extraction to audio generation. It was the perfect catalyst to turn a long-held dream into a functional, user-friendly app.

What it does

MangaCards is a Gemini 3-powered app that lets users create Anki flashcards instantly while reading manga. With a quick photo of a manga panel or page, the app:

  • Extracts Japanese text and generates translations.
  • Creates ready-to-use Anki cards with a single click.
  • Includes AI-generated test-to-speech audio clips for listening and pronunciation practice.
  • Supports both individual panels and full-page analysis for comprehensive learning.

How I built it

I developed MangaCards using the Gemini CLI, which acted as a collaborative partner throughout the process. While I reviewed and guided the implementation, Gemini handled the bulk of the coding, allowing me to focus on design and user experience.

I deliberately tried to steer clear of writing code myself and I must confess it worked a lot better than expected. While there are things I would like to refactor, one has to wonder if it is worth the trouble.

The app uses Gemini 3 for:

  • Optical Character Recognition (OCR) to extract text from manga images.
  • Gemini’s language models for extracting meaning and creating translations
  • audio generation for text-to-speech (uses Gemini 2, since this is not yet available in 3)
  • multimodal capabilities for extracting the different panels from a larger page

Challenges I ran into

The thing that I was expecting to be a challenge was not a challenge. Gemini 3, even the flash version, could perfectly analyse the manga pages, extract text and key words, translate it and write a short explanation.

The thing I did struggle with was how to keep cost under control. I wanted to create a state-less app that would be easy to deploy. However, I did want to protect my wallet, since given users free and unlimited access has the potential to be quite expensive.

Eventually, I settles on the "Bring Your Own Key" model for now. Users will need to sign up for their own API key and provide it to the app.

Accomplishments that I'm proud of

What I am most proud of is that this is my first fully vibe-coded app and it is actually fully working with very little hickups along the way. While there are certainly limitations to the model and it required some guidance in some parts, I can see the future ahead (see below).

What I learned

I believe software engineers will be the ones creating APIs and skills for tools such as Gemini CLI. This will make it possible for any one to create an app exactly the way they want it, with no coding. Gone are the days that you download a specific app from the Appstore and hope that it suits your needs, you download the proper skills and just create the app you want. Tailor-made just for you and nobody else. That is the future of apps.

What's next for MangaCards

  1. User Management: Move away from "Bring Your Own Key" with a lightweight authentication system to simplify onboarding.
  2. Multi-Language Support: Expand beyond Japanese to other languages (e.g., Korean, Chinese). This should be possible with minimal adjustments.
  3. Skill Extraction: Distill the core functionality into a reusable template, so others can quickly build similar apps for their own learning goals.
  4. Community Features: Allow users to share decks or collaborate on translations for popular manga series. Although this is already part of Anki, I feel improvement can be made.

Built With

Share this project:

Updates