Project: Story x AI

by ARVITHAMBI

What is This?

A year ago, I wrote about putting together an AI-generated story for my children. It was a “manual” process that involved me writing queries to ChatGPT to generate the stories I wanted, querying it again to generate images, and then piecing them together into presentation formats to read with my kids. It was a fun project that gave just a hint of what AI was able to do within education.

I would estimate that about ⅓ of my effort went into the actual creation of the story generator, and the remaining ⅔ consisted of all the packaging, like creating User Management that allowed users to be created, integrating PayPal into the system, developing more UI components, and lots and countless tweaks.

The scope creep was real, and I ended up needing to clearly outline all the requirements for a minimum viable product so that I could, quite literally, get to work. I have a laundry list of features and functions which didn’t make the cut, but could either be brought to life one day, or just left in the dust as I plow forward onto newer initiatives.

“Perfect is the enemy of good.”

– Voltaire

Why Did I Make This?

In summary, the two reasons that I put my time and effort into this project were:

  1. I believed it would be useful for me and my kids in our homeschooling process. I wanted to use this tool to generate stories about any topic, give them content to develop their reading skills, and help enhance their Spanish skills.
  2. I could use it as a project to showcase some of the developer skills, creativity, and resourcefulness that were required to bring the idea to fruition. This is a part of the launch of my new endeavor called thambidur.ai, a small business AI consultancy firm. You can read more about it here: thambidur.ai.

A Note on Scope Creep

With my primary goals being the two mentioned above, I had to limit scope creep and ensure I was building towards a minimum viable product.

How do you access it?

You can access the tool here: apps.thambidur.ai. Please note that I require accounts to be created because every story that gets generated uses my ChatGPT API key, which in turn is paid for by me. I’m allowing new users a certain number of credits to try out the project for free, along with the option to pay via PayPal or credit card if you find value in it and want to continue using it.

How do I use it?

Once you create a user account, you’ll be granted a set number of credits. The number of credits that you use will vary depending on the length and complexity of the story you create.

  1. Visit apps.thambidur.ai
  2. If needed, create a free user account (only an e-mail and password are needed)
  3. Log in
  4. Click the “Generate a New Story” button
  5. Enter the following details:
    1. Character description: You can enter a custom character (and save it for re-use if you wish) or select “none” to allow AI to generate any characters as appropriate
    2. Topic: This is where you enter the details of the story. It can be as specific or general as possible. Here are some examples:
      1. How photosynthesis works
      2. A tour through the major objects in our solar system, starting from the Sun and moving out, along with two interesting facts per stop
    3. Genre: Select “Educational” if you want it to contain facts for learning, otherwise select Adventure for more fantasy-based adventures.
    4. Word Structure: This choice drives whether the book uses more advanced vocabulary suitable for read-alouds to your child, or if the words should be simpler to be read by the child.
    5. Target Age: Enter the age of the intended audience to ensure the appropriateness of the content.
    6. Language: If a language is selected here, each page of the generated story will also contain the translation of the English sentence.
    7. Illustration Style: You can select from different illustration styles or enter your own.
      1. Note: There are significant limitations to the current capabilities of the AI-driven image generation. While providing detailed and unique descriptions of characters will help, there may at times be very limited continuity in the illustrations. These images are meant to be complementary to, but not the focus of, each story.
    8. Length of Story: Enter the target number of sentences for the story. Longer lengths will allow for a more developed story, but will also require more credits.
  6. Click “Generate Story”
    1. A pop-up box will appear to warn you that the generation itself can take anywhere from 10 seconds to a few minutes, again depending on the length of the story. Please do not leave the page, click any links, or try and re-run the story. It will result in the credits being used and no story getting saved.
  7. Functions within the Viewer:
    1. Navigation: You can click “Previous Page” or “Next Page”, or use the left and right arrow keys, to navigate through each page.
    2. Download as PDF: Download the story as a PDF for use later.  Please note that the initial images displayed in the story are temporary and will get cleared after some time. Exporting the story to PDF is one way to permanently save the story for reading or sharing later.
    3. Export Book Contents: Download the story as a .zip file, containing the story and images. This will allow you to load the story back into the app by going to Your Story Library and selecting the .zip file in the “Load a New Story” section at the bottom.

Example stories

The Story Library section of this app allows users to view a story history, open downloaded books, and read several example stories. You do not need an account to view the example stories. Here is a brief summary of them, as well as links to the PDF viewer:

  1. Pax and Maya’s Visit to Cuenca’s Cathedral
  2. Billy and Bella’s Deep-sea Discovery: A Submarine Adventure
  3. Lily’s Tiny Adventure: Exploring the Magic of Photosynthesis
  4. Luna the Baby Narwhal’s Enchanted Adventure
  5. A Brief History of Ecuador
  6. Lily’s Lost Locket – A Lesson in Honesty

Technical Background

In developing this project of nearly 2000 lines of python code, I was able to demonstrate a wide range of skills and technologies. The following is just a brief list to highlight some of the key ones.

Project Planning:

As mentioned in the beginning, I treated this idea as a project from the onset. I had to go through ideation and brainstorming, definition of key requirements, mapping out the minimum viable product, creating a project plan, and managing the software development lifecycle as it relates to version controls, testing, and debugging at each step.

Scope creep was a real problem because as I built out my vision, more ideas would come to mind. Ultimately, assessing what was required for minimum viability was crucial to ensure liftoff.

Python Programming:

The entire system is designed using Python programming. I took the “100 Days of Code: The Complete Python Pro Bootcamp” to learn Python, and got nearly halfway through it when I had to stop for two reasons. First, because I just kept getting ideas that I wanted to follow up and create, which constantly threatened to derail me from linearly progressing through the course. Second, the nature of learning and coding has been fundamentally changed. With technology, and AI very specifically, I’m able to identify what I want to do and learn and deep dive directly into that topic with laser precision. The nearly 2000 lines of python code that make up this app are a testament to learning to build exactly what I need, as I need it.

SQLite Database Management:

SQLite was employed for efficient storage of user, story, character, and token utilization data, ensuring users’ stories and account details were safely recorded and easily accessible, allowing seamless integration with the app’s backend

PythonAnywhere Platform:

I successfully deployed the app on PythonAnywhere, demonstrating proficiency in cloud-based hosting solutions, allowing users to access the story generation service from anywhere.

Flask:

The entire project is developed using Flask, managing routes, forms, and template rendering. It was central to the development of this app. 

User Management:

To restrict the consumption of my OpenAI API tokens (which costs me money), I decided to implement user management, including features like e-mail verification, admin creations, user subscription details, and saved story elements (recent stories, reusable character, etc.).

CSV Reading/Writing:

I leverage CSV files if the user wishes to export their stories for later use. A .zip file is generated containing a CSV of the story, along with copies of all the images, so that the story can be shared and loaded back into the app’s Story Reader at a later date.

PDF Generation:

Because images generated by DALL-E 2 are hosted only temporarily on the OpenAI servers, the URLs for the images generated will only be valid until the images get wiped on their servers. I had develop a process to convert the stories into PDFs in order to allow users the opportunity to export their stories in an independent format that can be saved or shared.

SMTP Email Communications:

Integration of my e-mail server with the application to allow for e-mail communications for various purposes – primarily related to user management.

Data Visualization:

While not viewable from a regular user’s view, data analytics and visualization were employed to provide users with insights into their app usage, including token costs and daily usage, presented using Chart.js.

Here, I map out the token/dollar utilization for a user:

Web Development: 

HTML/CSS/JavaScript are used heavily, with Flask, to create the web app. I used these to try and build an aesthetically pleasing interface that functioned across all devices while also offering useful functionality.  JavaScript was used for front-end functionality, including story navigation, form validation, and dynamic updates, enhancing the interactivity of the app.”

APIs & Integrations:

OpenAI API (ChatGPT + DALL-E)

This is the engine behind the story generator. I use ChatGPT to generate the story, generate the language translation, generate the image descriptions, and ultimately to generate the corresponding images.

PayPal API

I plugged into the PayPal system to integrate the user management system I created with PayPal, allowing users to initiate and manage their subscriptions from within the app, while also translating those subscriptions to the built-in credit system. Using PayPal was critical for supporting a safe and reliable payment method.

Webhooks

I utilize webhooks to enable system-to-system communications between PayPal and the app to ensure that activity conducted outside the app can be synchronized within the app.

Postman

I utilized the Postman API platform as a tool when building, testing and troubleshooting my API integrations and webhooks.

Resources (ChatGPT, Claude, Perplexity)

My development, research, debugging, and more were all aided through various AI tools, such as ChatGPT, Claude, and Perplexity, each for different purposes. I was truly astounded by how poorly OpenAI’s ChatGPT was at aiding me in debugging issues with my OpenAI API key, issues where competitors like Claude were able to better support me in accessing OpenAI’s API.

What’s Next?

As I mentioned before, this was borne for two reasons: first, as a tool to use in my own homeschool adventure, and second as a demonstration and segue into my new Small Business AI Consultancy venture, thambidur.ai.

If you are interested in learning about the vast number of ways in which AI and related technologies can save your time and amplify your impact, please check out my site thambidur.ai or reach out to me for a quick conversation.

If you have feedback or requests based on this Story Generator, please feel free to reach out as well! I would love to hear how it is being used and how it can be improved.

Leave a Reply

Your email address will not be published. Required fields are marked *