Inspiration

We were inspired by a desire to move beyond competitive gaming and explore the power of collective creativity. We noticed how many online communities form around shared interests, and we wanted to create a game that truly embodied that spirit. The idea was simple: what if a community could write a story together, not by winning or losing, but by simply contributing one word at a time? We were inspired by the spontaneous, collaborative nature of real-time chat and collaborative documents, and we wanted to build a dedicated space for that creative energy.

What it does

Thread Weavers is a cooperative word game designed to foster community storytelling. It provides a real-time platform where multiple users can collectively write a single story, with each person contributing a single word at a time. The application is built using React for the front end and Firebase Firestore for a fast, responsive back end that ensures all users see updates instantly.

How we built it

Thread Weavers is built as a single-page web application to ensure a seamless, real-time experience. The front end is developed using React, which allowed us to create a dynamic and responsive user interface that is easy to interact with. For real-time data synchronization, we used Firebase Firestore. This was a crucial choice, as it allowed multiple users to see the story update instantly as each new word was submitted, creating a truly collaborative environment. We designed the database schema to store each story as a document, with a simple array of strings to represent the sequence of words. This structure made it easy to append new words and retrieve the complete story for display.

Challenges we ran into

The biggest challenge was ensuring a truly smooth, real-time experience without any lag or errors. We had to carefully manage state and user input to prevent synchronization issues, especially when multiple people were submitting words at the same time. Another significant challenge was designing the game mechanics to be both simple and engaging. We had to figure out how to guide the narrative without being overly restrictive. This led to a lot of iteration on the user interface and the core rules, as we sought to find the perfect balance between creative freedom and narrative coherence.

Accomplishments that we're proud of

We are particularly proud of several key achievements:

  • Seamless Real-Time Experience: We successfully managed the complex challenge of real-time data synchronization, ensuring that the story updates smoothly and without lag for all users, regardless of how many people are contributing at once.

-Intuitive and Engaging Design: We created a game that is simple to understand and play, yet offers enough creative freedom to be truly engaging. We are proud of striking the right balance between guiding the narrative and allowing for spontaneous creativity.

-Encouraging Collaboration: Beyond the technical aspects, we are most proud of building a platform that genuinely encourages and celebrates collective creativity, demonstrating that technology can be a powerful tool for community building

What we learned

This project taught us a tremendous amount about real-time web development and the importance of a robust back end. We gained a deeper understanding of how to manage asynchronous data with Firestore and how to design a front-end that can handle constant updates efficiently. On a more conceptual level, we learned that a well-designed collaborative platform can unleash incredible creativity. It's not just about the code; it's about building an environment that encourages people to work together and see the value in their collective contributions. The process of watching a story unfold, one word at a time, was a powerful reminder that the whole is often greater than the sum of its parts.

What's next for Thread Weavers

Share this project:

Updates

posted an update

Hey everyone! We're excited to share our first update on our hackathon project, Thread Weavers. It's a cooperative word game where you can weave a story, one word at a time, with friends and strangers in real time.

Our Progress So Far We've been hard at work building the core functionality of the game. We're proud to announce that we've successfully set up our development environment and integrated it with a version control system.

We successfully connected our front-end framework to the Firebase Firestore backend, allowing for real-time updates—the central feature of our game! When a new word is added, the story updates instantly for everyone.

We've also built a user interface that's both intuitive and responsive, so it works smoothly on desktop and mobile devices. The Challenges We Overcame It hasn't all been smooth sailing, but we're proud of the problems we've solved. Initially, we faced significant lag when users submitted words because of inefficient database queries. We tackled this by optimizing our data structure and using real-time listeners to reduce network requests.

Making the design look good on smaller mobile screens was another big challenge, but we overcame it by learning responsive design principles and implementing a modern CSS framework.

Sneak Peek: A Code Snippet To give you a glimpse of what we're working on, here's a simple, interactive game that served as a prototype for some of our real-time logic. It’s a "Catch the Emoji" game, fully contained in a single HTML file. This helped us test the game loop and interaction principles.

Log in or sign up for Devpost to join the conversation.