DEV Community

Cover image for Building ConspirAI: Orchestrating Absurdity
Harish Kotra (he/him)
Harish Kotra (he/him)

Posted on

Building ConspirAI: Orchestrating Absurdity

Conspiracies are usually dark, but what if they were just... absurd? That's the premise behind ConspirAI, an app that transforms a simple photo of a coffee mug into a "Trans-Dimensional Proxy" used by intergalactic laundry operations.

In this post, we'll dive into the technical architecture and the creative prompt engineering that makes this possible.

The Core Stack

The app is built using React 18 and Vite, chosen for their speed and developer experience. For the visual identity, we went with a "Hacker/Brutalist" aesthetic using Tailwind CSS. A heavy dose of Framer Motion was added to create that cinematic, glitchy feeling of "accessing forbidden data."

AI Orchestration: The Gemini Advantage

The heart of ConspirAI is Gemini 1.5 Flash. We chose Flash because conspiracy generation needs to be fast and creative. The model handles both the vision task (identifying the object) and the creative writing task (spinning the web of lies).

1. Multi-modal Safety

Before we generate a theory, we run a safety check. We don't just use standard filters; we tell the AI to look for specific "theory-breaking" content like real public figures or sensitive documents.

export async function checkImageSafety(base64Image: string) {
  const model = "gemini-3-flash-preview";
  const prompt = "Return SAFE or UNSAFE: [reason] if the image contains real tragedies or celebrities.";
  // ... AI call logic
}
Enter fullscreen mode Exit fullscreen mode

2. Structured Narrative Generation

To build the complex UI (evidence boards, timelines, Reddit comments), we needed more than just a block of text. We used Gemini's responseMimeType: "application/json" combined with a strict JSON schema.

const responseSchema = {
  properties: {
    title: { type: Type.STRING },
    threatLevel: { type: Type.STRING, enum: [/* ... */] },
    summary: { type: Type.STRING },
    evidenceBoard: {
      type: Type.ARRAY,
      items: { /* node/link structure */ }
    }
  }
};
Enter fullscreen mode Exit fullscreen mode

Prompt Engineering: Becoming the "Whistleblower"

The secret sauce is the system prompt. We instructed the AI to adopt a specific persona: An unhinged elite-level internet researcher who has seen too much.

We specifically asked it to connect ordinary objects to bizarre, non-existent historical events like the "Microwave Meltdown of '72." This ensures the theories are funny and surreal, rather than harmful or scary.

Visualizing the Chaos

Rendering an "Evidence Board" dynamically was a fun challenge. We used a helper function to calculate random but spread-out positions for "clues" and then used SVG paths to draw the "red strings" connecting them.

<svg>
  {links.map((link) => (
    <motion.line 
      x1={from.x} y1={from.y} 
      x2={to.x} y2={to.y} 
      stroke="red" 
    />
  ))}
</svg>
Enter fullscreen mode Exit fullscreen mode

ConspirAI is a testament to how multi-modal AI can be used for pure creative entertainment. By combining vision, structured data, and strong persona-driven prompts, we can turn any boring afternoon into a cinematic investigative thriller.

Screenshots

ConspirAI - 1

ConspirAI - 2

ConspirAI - 3

ConspirAI - 4

ConspirAI - 5

ConspirAI - 6

ConspirAI - 7

Code & more: https://www.dailybuild.xyz/project/132-conspirai

Top comments (0)