Inspiration
Our inspiration came from the towering skyscrapers that stretch into the clouds, filled with hundreds of people living just a few walls apart, yet often feeling like strangers. Unlike suburban neighborhoods, where neighbors might wave from their porches, chat across fences, or help each other out, apartment buildings can sometimes lack that same close-knit community feeling. We wanted to bring that suburban neighborhood block feeling into the sky, creating a space where people living high above the streets could experience the same sense of belonging and connection. That's how CloudBlock was born: a neighborhood block in the clouds, both literally and figuratively, where every window represents a person, every floor holds new connections, and neighbors can finally feel like neighbors again.
What it does
CloudBlock transforms apartment buildings into interactive communities in the clouds. Through a playful 3D skyscraper, residents can join their building, claim their own window, explore floors, discover neighbors, and connect through shared interests. The Contribute feature allows neighbors to exchange resources, post requests, and offer help, bringing the close-knit feeling of a suburban neighborhood block into the sky. Our goal is to make apartment living feel less anonymous and more like a community, one window at a time.
How we built it
We built CloudBlock using React, JavaScript, Three.js, HTML, and CSS. We used Three.js to create interactive 3D skyscrapers, floating clouds, and playful animations, while React helped us build a smooth, component-based interface. We focused on combining creative 3D design with a clean, user-friendly experience inspired by Apple's minimalistic design style.
Challenges we ran into
One of our biggest challenges was finding the right approach to implementing our 3D graphics. Since visual storytelling was a major focus of the project, we initially jumped straight into Blender to bring our ideas to life, without fully considering how Three.js could better support our interactive goals. This taught us an important lesson: the most powerful tool isn't always the most suitable one. Rather than rushing into solutions, we learned the importance of evaluating our project's specific needs and choosing tools that best support them.
Accomplishments that we're proud of
We're proud to have brought our vision for CloudBlock's landing page to life! Although we weren't able to implement all the features we originally envisioned, we successfully established the visual identity and foundation for our project. We're especially proud of experimenting with 3D graphics and creating a playful, cloud-inspired experience that reflects our original idea.
What we learned
One of our biggest takeaways was learning to balance creative ambition with technical execution. Having a strong creative vision is exciting, but it's equally important to set realistic technical goals that help bring that vision to life. We learned that successful projects aren't just about having great ideas or impressive visuals, but about finding the balance between imagination, functionality, and what's achievable.
What's next for CloudBlock
We'd love to explore more immersive 3D storytelling by creating customizable characters, personalized apartments, and interactive spaces that reflect the people living in them. We also plan to expand our social features and refine the request-and-offer system, making CloudBlock both visually engaging and genuinely useful for everyday apartment living.