Nationship

Slides pages
Civilization game
Home page

Inspiration

We were inspired by City Skylines and the idea of dating apps to create a merge of both, something that has never been done before.

What it does

By combining a dating app and civilization expansion game, we created a gamified matchmaking site. First, complete a survey including questions about yourself then get matched with a similar partner! (chatbot for our demo). You will then be guided to a chat with your "partner" where consistent texting will grow your civilization. In this web, you can thrive through eight different civilizations, build your military, develop your technology, and grow resources. You may also battle, raid, declare diplomacy, or research. Keep texting, or else your civilization will decline. This is a fun way to connect with others while incorporating a game to encourage communication.

How we built it

Using HTML, CSS, Cursor. We started by brainstorming as many combinations of wacky ideas we could, going through different versions of productivity apps, to do lists, and more. We eventually came across the idea of using a dating site in conjunction with collaborative games to build relationships between people. We settled on the idea of a civilization after some more ideas, trying to find the most ridiculous combination we could. Starting with a design specification system, we had cursor code the framework and general website to give us a jumping off point. Then, we added features manually with HTML and CSS until our project was refined to a point we were proud of.

Challenges we ran into

Brainstorming was a significant challenge. We wanted to be able to have as unique of an idea as possible, while still maintaining real world applications. Since this is our first hackathon, we were inexperienced with HTML and CSS, so we turned to vibecoding agents. This also presented a set of challenges, like ballooning codebases and redundant files, so we also had to manually delete and edit many files. We had some bugs with our website, like unwanted redirection towards certain pages, visual bugs, and glitching interfaces, but these were able to be fixed manually through the understanding of the code that we were able to develop.

Accomplishments that we're proud of

As this is all of ours' first hackathon, we are proud of creating a functional and user-friendly site that works! Some key points are the interactive sliders and drop down tabs on the user survey.

What we learned

We learned much through this project, both technical and managerial. We learnt technical syntax for HTML and CSS, and some vibe coding guidelines. On the managerial side, we developed our brainstorming and ability to coordinate tasks. Something we had particularly more experience with was vibe coding. We realized that AI coding was both useful and limiting. The code the AI wrote was not always accurate or optimized, and often ballooned out of control, but was much quicker than manual HTML typing. AI agents need monitoring and steady guidance in order to be used effectively, alongside some manual code. Though we used AI agents, we believe we learnt more, as the problems it presented forced us to understand the code at a deep level

What's next for Nationship

With more time, we would replace the chatbot with real people to create a real experience for users. We would also add a interactive civilization rather than buttons to create a better user experience.