jessa

Much of my childhood was spent playing Pokémon Sapphire, to my friends’ often-disappointed faces because I kept passing up playing house with them. I was so goal-oriented and focused on leveling up that spending time not doing so felt like wasted time. The other games followed—Final Fantasy IV, The Sims Pets, whichever I could get my hands on—all of them training me to yearn for something I couldn’t quite name yet.

So when I caught wind of the newly launched Claude Design, I thought about what my first experiment would be, given my limited token. And surprisingly, it was the kid in me who answered first. I thought about creating something inspired by a pixel game where the character could roam and read a curated selection of my blog posts.

The first thing I did was download all of my 1,470 published blog posts in an Extensible Markup Language (XML) file that would be easier for Claude to read using fewer tokens. Then, following the tutorial that I could simply type what I imagine the output be like, I wrote:

Based on “filename-here.xml”, can you create an embed for my website that looks like a Pokémon game, with the character traveling to places and discovering landmarks, and each landmark representing a blog post? When they click the blog post, they can read it. The environment should resonate with the blog post’s theme, so you can cluster blog posts by theme. I want it to be interactive and accessible on my website: http://www.jessa.blog.

… and pasted some images of my website pages for theme reference.

After some tweaks and back-and-forth comments because the pop-up conversations/prompts didn’t work well on smaller screens, Claude Design brought my idea to life and I had not typed a single line of code! Those who speak the language of code probably got further than I did. But this is mine.

Meanwhile, you can give my first creation with Claude design a try here.

You can:

• turn on/off background music
• change the theme between pastel, twilight, and mint
• use the arrow keys/WASD/simply tap where you want to go:
  • 🌲 Life Forest
  • 🏙️ Work District
  • 💞 Relationship Harbor
  • ✝️ Faith Chapel Hills
  • 🔮 Futures Observatory
  • 📚 Book Grove
  • 🐾 Pet Meadow
  • ⚡ Energy Labs.
• talk to NPCs
• read through my blog posts within the game while having the option to read them in my blog

The game also remembers how many blog posts you’ve already visited out of the 50 spread throughout the area.

Maybe the best way to understand what I made is to just walk through it yourself.