CyberDreams AI - Vibe-Coding a Strange Cyberpunk World with Sanity + Gemini

Vladimir Joseph — Sat, 19 Sep 2026 15:05:58 +0000

# CyberDreams AI - Vibe-Coding a Strange Cyberpunk World with Sanity + Gemini

What I Built

I built CyberDreams AI, a strange cyberpunk story generator powered by Sanity, Next.js, and Google Gemini.

The idea is simple: instead of using Sanity only to store traditional website content, I use structured content as the building blocks of an unpredictable AI-generated universe.

CyberDreams AI combines five types of Sanity content:

Characters
Locations
Technologies
Threats
Events

When the user clicks Generate CyberDream, the application randomly selects one element from each category and sends them to Google Gemini. Gemini transforms these structured elements into a short, mysterious cyberpunk story.

The result is a different CyberDream every time.

Demo

Live Demo

Try clicking Generate CyberDream several times and watch the story change.

Code

GitHub Repository

The project is built with:

Next.js
React
TypeScript
Tailwind CSS
Sanity
Google Gemini
Vercel

My Build Process

I wanted to experiment with a simple question:

What happens when structured CMS content becomes fuel for generative AI?

I started by creating a Sanity project and designing a small content model around a cyberpunk universe.

The content model contains five document types:

Characters
Locations
Technologies
Threats
Events

I then created example content such as Maya Chen, Neo-Miami, Quantum Firewall, Rogue AI, and The Quantum Awakening.

Next, I connected the Sanity project to a Next.js application. The application retrieves the structured content and randomly selects one item from each category.

I then integrated Google Gemini to transform those five structured elements into a short cyberpunk story.

Finally, I created a neon cyberpunk interface, deployed the application to Vercel, connected the production Gemini API key through environment variables, and published the project on GitHub.

The interesting part of the build was seeing how a relatively small structured content model could produce many different creative combinations.

Sanity Project Details

Sanity Project ID: ffi2ahke

Dataset: production

Content Types

character
location
technology
threat
event

Sanity is not just being used as a database in this project. Its structured content directly influences the AI-generated output.

Why I Built It

I wanted to make something that felt different from a traditional CMS demo.

Instead of simply displaying structured content, CyberDreams AI turns that content into ingredients for an AI-generated world.

A hacker, a futuristic technology, a dangerous AI, a mysterious location, and a strange event can be combined into a completely new story.

That unpredictability is the strange part.

The Experience

The interface is designed as a futuristic cyberpunk control panel.

It displays:

System status
CyberDream generator
AI transmission
Generated story
Sanity content model
Available characters
Locations
Technologies
Threats
Events

The goal was to make the Sanity content visible and understandable while still giving the application an experimental feeling.

Agent Session

This project was built interactively during development rather than from a separately published agent-session transcript, so I am not including a transcript that does not exist.

Conclusion

CyberDreams AI is a small experiment in combining structured content and generative AI.

Sanity provides the structured world.

Next.js provides the application.

Gemini provides the imagination.

Together, they create a cyberpunk universe that can generate a new dream every time.

Links