Inspiration
The name TENKU-NO-MACHI translates to "City in the Sky." Our main inspiration came from a desire to break free from traditional 2D web layouts and create a sense of boundless exploration. We were deeply inspired by futuristic anime aesthetics, specifically the ethereal and floating architecture seen in classic animations. We wanted to see if we could bring that same feeling of wonder and scale directly into a standard web browser using modern AI and web technologies.
What it does
The name TENKU-NO-MACHI translates to "City in the Sky." Our main inspiration came from a desire to break free from traditional 2D web layouts and create a sense of boundless exploration. We were deeply inspired by futuristic anime aesthetics, specifically the ethereal and floating architecture seen in classic animations. We wanted to see if we could bring that same feeling of wonder and scale directly into a standard web browser using modern AI and web technologies.
How we built it
We embraced a modern, AI-driven workflow to bring this vision to life rapidly:
3D Asset Generation: We used Meshy.ai to rapidly generate the 3D models of our floating buildings and islands. This generative AI tool allowed us to turn our concepts into textured 3D assets in record time.
Code & Logic: We used Claude as our AI pair-programmer. Claude helped us write the core web code, set up the 3D scene rendering, handle the camera controls, and troubleshoot bugs along the way.
Hosting: The project is deployed and hosted on Netlify for fast and reliable access.
Challenges we ran into
Using AI tools brought unique challenges. While Meshy.ai is amazing for fast generation, AI-generated 3D models can sometimes have large file sizes or complex geometry. We had to figure out how to optimize these assets so the website wouldn't lag. Additionally, working with Claude to code the 3D spatial logic required careful prompt engineering to ensure the camera and lighting behaved exactly how we wanted in the browser.
Accomplishments that we're proud of
We are incredibly proud of successfully merging AI-generated art with web development. Being able to take an idea, generate the 3D assets with Meshy.ai, code the environment with Claude, and publish a smooth, working 3D website is a huge milestone for us.
What we learned
This project taught us how to effectively collaborate with AI. We learned valuable skills in prompt engineering for both code generation (Claude) and 3D generation (Meshy.ai). We also learned the basics of integrating 3D assets into a web environment and making sure the final result is optimized for users.
What's next for TENKU-NO--MACHI
In the future, we would love to add:
Audio immersion: Spatial 3D audio with wind and futuristic ambient sounds.
Interactivity: Clickable buildings that reveal information or trigger animations.
More AI assets: Expanding the city with even more intricate, AI-generated floating structures.
Log in or sign up for Devpost to join the conversation.