Developing an AI-Powered Multilingual Children's Library App

Company:
Role:
Front-end Developer
Project Lenght:
2 weeks
Tools:
Visual Studio
Team:
4 Web Development Bootcamp Students
Summary:
This case study is about how my team and I managed to build and tablet application on Ruby on rails in under 2 weeks.

Project Overview

Buki is an AI-powered digital library designed for children, offering a diverse collection of picture books available in over 30 languages. Begin by selecting the languages you'd like to read in, then explore the curated gallery to find a book that interests you.

Once you have chosen a book, you can read it in a single language or enable bilingual mode to display two languages side by side. Additionally, Buki offers both text-to-speech functionality for read-aloud experiences and the option to record your own narration—making story-time interactive, multilingual, and engaging.

Goals & Challenges

Buki was inspired by a personal moment—when my two-year-old daughter brought me her favorite book, and I couldn’t read it aloud because it was in Japanese. In our trilingual home, where we speak English, Japanese, and Spanish, she’s learning all three languages at once.

What if I created a tablet-based application that could instantly translate any picture book? It would make shared reading accessible regardless of language. I had already begun exploring the idea before starting the Le Wagon bootcamp, so developing Buki as part of my learning journey made the experience especially meaningful and rewarding.

Target Audience

The app is thoughtfully designed for multilingual families with preschool-aged children, as well as for parents who wish to introduce or reinforce a second language at home. By offering an engaging tablet experience that blends entertainment with education, the app encourages meaningful, language-rich interactions. It transforms screen time into a productive, guilt-free opportunity for early learning—empowering parents to feel confident about their child’s time on a device.

Ideation & Design Process

During the ideation process, I used Figma to create a first approach to Buki. Once we started working  on the app as a team, there were some iterations. Based on our recently acquired knowledge, we knew the possibilities and the limitations of working on Ruby on rails.

For example, we decided to add a new feature where users could create their own short children friendly stories why AI, By simply adding a name and an animal. But after pushing it for days, and hardcoding the prompts to work just enough for the Demo day, I decided to scrap it as it wasn't adding any value to the overall experience.

Development & Implementation

During the development and implementation stage, we designed the application following the MVC architecture provided by Ruby on Rails. After defining user stories, we set up the database schema with Active Record and built RESTful routes. We integrated various gems such as Cloudinary for image hosting, Bootstrap for responsive design components, and Font Awesome for icons.

The book content was dynamically loaded from a Google Sheets CSV URL, allowing for easy updates and external data management. We collaborated on GitHub and implemented several APIs to enhance functionality: Voice Box for voice recording, Eleven Labs for AI-generated speech synthesis, and OpenAI’s API to provide real-time translation of books. The app was deployed to Heroku.

My Role & Team

In my team of 4, I did most of the front-end. As I had previously designed the app on Figma, it was only normal for me to jump into HTML and CSS and create the components and pages of the app. My team partners collaborated setting up the backend (things like Rails logic, AI API’s, AI features, seeds and stuff)

Building a functioning app in just two weeks was challenging, adding the fact that a couple of months ago we close to zero knowledge on Ruby in rails, API’s implementation, Javascript, HTML or CSS. Fortunately, I had previously done the wireframe and prototype in Figma, which came in handy for a quick start and a map as we built.

Other Projects