DEV Community

Kissada-W
Kissada-W Subscriber

Posted on

Ancient Hero Dossier | Nonanyt

Education Track: Build Apps with Google AI Studio

This post is my submission for DEV Education Track: Build Apps with Google AI Studio.

What I Built

I built the Ancient Hero Dossier, an RPG character generator that combines Google AI Studio's Gemini with character art generation to create unique fantasy characters. The app generates detailed character cards with Roman-themed identity documents that pop up when you click the info icon, creating an immersive ancient world experience.

The key innovation was using structured prompting to make Gemini act as "Aelius," an expert world-builder who creates characters following a specific Roman identity card format (Tabula Identitatis), complete with fields like NOMEN, GENUS, ORIGO, and VIRTUTES.

The Master Prompt

Click to see the detailed prompt I used

[CONTEXT]
You are an expert world-builder and RPG master named "Aelius," tasked with creating character dossiers for a new fantasy game set in a world with Greco-Roman influences. Your creations must be unique, imaginative, and detailed.

[TASK]
Your main task is to generate a complete character profile based on a user's initial idea. This profile will be divided into three parts:
1. A short, engaging summary for a character card.
2. A detailed dossier formatted like an ancient Roman identity document (Tabula Identitatis).
3. A highly descriptive prompt suitable for a text-to-image AI (like Imagen) to generate the character's portrait.

[INPUTS]
You will be given a basic character idea from the user.
- character_idea: {{character_idea}}

[OUTPUT FORMAT]
You MUST provide the output in a single, valid JSON object. Do not write any text outside of the JSON structure.
The JSON structure must be as follows:
{
  "summaryCard": {
    "name": "Character's Name",
    "class": "Character's Class or Title",
    "quote": "A short, impactful quote from the character.",
    "description": "A brief (2-3 sentences) public-facing description of the character."
  },
  "romanDossier": {
    "NOMEN": "Full Name (e.g., Kaelus Vorenus)",
    "GENUS": "Race / Species (e.g., Human, Elf, Dwarf, Orc)",
    "ORIGO": "Origin / Hometown (e.g., From the Sunstone Peaks)",
    "PROFESSIO": "Profession / Role (e.g., Legionary, Senator, Mystic)",
    "VIRTUTES": {
      "Strength": "A value from 1-10",
      "Perception": "A value from 1-10",
      "Endurance": "A value from 1-10",
      "Charisma": "A value from 1-10",
      "Intellect": "A value from 1-10"
    },
    "HISTORIA": "A slightly more detailed background story or a notable achievement.",
    "SIGILLUM": "Description of their personal seal or symbol."
  },
  "imagePrompt": "A detailed, descriptive prompt for an image generator. Include keywords like character appearance, clothing, style (e.g., 'oil painting', 'fantasy art'), lighting (e.g., 'cinematic lighting'), and details (e.g., 'highly detailed', 'sharp focus')."
}

[EXAMPLE]
If the user input for character_idea is "An old, blind oracle living in a swamp", your output should be a complete JSON object following the specified structure. Be creative.
Enter fullscreen mode Exit fullscreen mode

Demo

Character Card Generation

Ancient Hero Dossier Character Card

Roman-Themed Information Dossier

When you click the info icon, a detailed dossier appears, styled as an authentic Roman identity card with all character information beautifully formatted:

Image-screenshot

Image-screenshot

Try it yourself: Ancient Hero Dossier Live App

AI Studio Google: View on Google Studio

Source Code: View on GitHub

Installation and Setup

For detailed instructions on setting up the project, refer to the INSTALL.md file. It includes steps for installing Bun, configuring environment variables, and running the project locally.

Additional Notes

  • Ensure that the .env.local file is properly configured with your GEMINI_API_KEY. This file contains sensitive information and should not be shared or committed to version control.
  • Use Bun for all package management tasks, including installing dependencies, running the development server, and building the project.

Features

  • Generate Roman-themed RPG character dossiers.
  • Structured prompting for Google AI Studio's Gemini.
  • Immersive character cards with detailed identity documents.

Prerequisites

  • Node.js
  • Bun (for package management)

Running the Project

For detailed instructions, refer to the INSTALL.md file.

Key Features

  • AI-Generated Character Art: Each character gets unique artwork
  • Roman Identity Cards: Detailed dossiers formatted as ancient Roman documents
  • Structured Character Stats: Includes Strength, Perception, Endurance, Charisma, and Intellect
  • Responsive Design: Works seamlessly on desktop, tablet, and mobile
  • Thematic UI: Parchment textures, Roman fonts, and gold accents

My Experience

Working on this project taught me the incredible power of structured prompting. The biggest surprise was how accurately Gemini could interpret and consistently follow the Roman identity card theme when given clear, detailed instructions.

Key Learnings:

Prompt Engineering is Everything: My initial vague prompts produced inconsistent results. Success came from breaking down requests into specific, structured instructions. For example, explicitly defining Roman fields like 'NOMEN' (Name), 'ORIGO' (Origin), and 'VIRTUTES' (Virtues) yielded much more consistent outputs.

JSON Structure for Consistency: By requiring Gemini to output structured JSON with specific fields, I eliminated formatting inconsistencies and made the data easy to parse and display.

Iterative Refinement: The app evolved through multiple prompt iterations. I started with a basic character generator and gradually added the Roman theming, responsive design, and detailed character statistics.

Most Surprising Discovery:

Gemini's ability to maintain thematic consistency across different character types while following strict formatting rules was remarkable. Whether generating a "blind oracle in a swamp" or a "Roman legionary," it consistently produced authentic-feeling Roman identity documents with appropriate Latin terminology.

Technical Challenges Overcome:

  • Responsive Design: Ensuring the Roman-themed UI worked across all device sizes
  • Prompt Optimization: Balancing creativity with structural requirements
  • UX Flow: Making the info popup intuitive and engaging

This project demonstrated how combining AI creativity with structured prompting can create genuinely engaging user experiences that feel both authentic and innovative.


Top comments (1)

Collapse
 
nathan_tarbert profile image
Nathan Tarbert

I've enjoyed all of the research you've put into this project, it really adds up

Some comments may only be visible to logged-in visitors. Sign in to view all comments.