project screenshot 1
project screenshot 2
project screenshot 3
project screenshot 4
project screenshot 5
project screenshot 6

Community Infra Fund

Community Digital Infrastructure Game is an interactive adventure that educates players on funding and managing public and digital infrastructure using both traditional and blockchain-based methods, exploring concepts like restaking, EigenLayer, and SSV technology.

Community Infra Fund

Created At

ETHOnline 2024

Project Description

The "Community Digital Infrastructure Game" is an educational, interactive, choose-your-own-adventure experience designed to simulate the complexities of funding, managing, and sustaining large-scale public goods and digital infrastructure projects. This game serves as a learning tool, guiding players through the nuanced processes involved in both traditional infrastructure development and modern, decentralized digital projects.

Key Features: Understanding Public Goods: Players learn the fundamental concept of public goods—resources that are non-excludable and non-rivalrous, benefiting the community without direct profit motives. The game explores why these goods are essential and how they impact society.

Traditional Infrastructure Funding: The game delves into how traditional public goods, like schools, parks, and roads, are funded using conventional methods such as municipal bonds. Players explore the steps involved in project planning, securing funding, and managing these projects to completion.

Digital Infrastructure Funding: Moving into the digital realm, the game introduces players to decentralized communities and blockchain-based methods for funding digital public goods. It highlights innovative concepts like decentralized oracle services, which provide essential data feeds for blockchain applications.

Restaking and EigenLayer: A unique aspect of the game is the exploration of restaking, where staked assets (such as ETH) are reused to secure multiple services or networks, enhancing utility and security. The game explains how EigenLayer allows validators to extend their security capabilities across various services, thus optimizing resource allocation.

EigenPods and SSV Technology: The game also covers the use of EigenPods to manage restaked assets across different decentralized services efficiently. It introduces players to SSV (Secret Shared Validator) technology, which ensures secure and decentralized management of validators by distributing control among multiple operators, mitigating risks and enhancing network resilience.

Gameplay: Choose Your Adventure: Players make decisions that affect the funding, development, and sustainability of both physical and digital infrastructure projects. Each choice leads to different paths with unique challenges, teaching players the consequences of various funding models and management strategies.

Set Up an EigenPod with SSV: The game provides a practical guide on setting up an EigenPod using SSV technology, demonstrating how staked assets can be securely managed to generate yield and support digital infrastructure projects.

Explore Funding Models: Through interactive scenarios, players compare traditional funding models like municipal bonds with decentralized digital infrastructure funding, gaining a deeper understanding of the pros and cons of each approach.

Achieve Project Goals: The ultimate objective is for players to successfully fund, build, and maintain a public good project, ensuring its long-term benefits for the community. This involves strategic decision-making to align resources, manage project execution, and secure ongoing support for the developed infrastructure.

Educational Impact: By playing the "Community Digital Infrastructure Game," participants gain hands-on experience with both the traditional and blockchain-based approaches to funding public goods. The game is designed to be both informative and engaging, offering players a practical understanding of how infrastructure projects are conceived, funded, and sustained, bridging the gap between physical and digital realms. Whether you are new to the world of public goods or exploring advanced blockchain concepts, this game provides valuable insights and practical skills to navigate the evolving landscape of community infrastructure.

How it's Made

How It’s Made

The "Community Digital Infrastructure Game" is a web-based interactive experience built using a modern tech stack that includes React, Next.js, Tailwind CSS, and various other libraries to deliver an immersive and educational journey. Here's a detailed breakdown of the technologies and approach used to create the project:

Technologies Used:

  1. Frontend:

    • React: The core framework used for building the user interface. React’s component-based architecture allows for a modular design, making the game's various interactive elements easily reusable and maintainable.
    • Next.js: Employed for server-side rendering and static site generation, Next.js enhances the game's performance and SEO, providing a seamless user experience. It also facilitates dynamic routing for the choose-your-own-adventure style gameplay.
    • Tailwind CSS: This utility-first CSS framework is used to style the application, enabling rapid UI development with a highly customizable design system that keeps the codebase clean and consistent.
  2. Data Handling:

    • JSON Files: The game content, including the narratives and passages for different scenarios, is stored in JSON files (funding.json, proposal.json, eigenlayer.json, ssv_instructions.json). This approach simplifies data management and allows for easy updates and expansions of the game content.
    • React State Management: useState and useEffect hooks are heavily utilized to manage the game state, including tracking the current story, passages, and user navigation. This ensures a responsive and dynamic gameplay experience.
  3. Markdown Rendering:

    • React Markdown: The narrative content is written in markdown for ease of formatting and content management. React Markdown is used to render these markdown files directly in the game, allowing for rich text, links, and other elements to be easily displayed and styled.
  4. Interactivity and Navigation:

    • Custom Navigation Logic: A bespoke navigation system was built using JavaScript, allowing users to move between different passages based on their choices. The game dynamically updates the current story and passage based on user actions, integrating seamlessly with the React state.
  5. Error Handling and Debugging:

    • Integrated error logging and debugging using console.log() statements throughout the codebase. This approach helps in tracking the game’s state and flow, particularly when managing complex story branching and user choices.

Partner Technologies:

  • GitHub: Hosted the codebase and facilitated collaboration among team members. GitHub Actions may have been used for CI/CD pipelines to streamline deployment and testing processes, ensuring that updates to the game are smoothly integrated and deployed.

Notable Hacks and Challenges:

  1. Dynamic Content Management: One of the more hacky solutions involved dynamically loading different story files based on user interactions. This required creative use of React's state management to ensure that the game seamlessly transitions between various JSON datasets without reloading the entire application.

  2. Conditional Rendering for Enhanced UX: We leveraged React’s conditional rendering capabilities extensively to control the display of game elements, such as buttons and passage content. This approach not only enhances user experience but also reduces the amount of unnecessary re-renders, optimizing performance.

  3. Flexible Story Expansion: By storing stories in JSON format and using dynamic import techniques, the game can be easily expanded with new stories and scenarios without major changes to the core codebase. This flexibility allows for ongoing development and scalability of the project.

  4. Edge Case Handling: Significant effort went into managing edge cases where user input could lead to undefined or unexpected states. For example, navigation to non-existent passages is gracefully handled with user feedback, maintaining the integrity of the gameplay.

GitHub Repository:

All the source code and development history of the project can be found on our GitHub repository (https://github.com/dossinstitute/civicfundinggame). The repository includes the full codebase, documentation, and setup instructions for anyone interested in exploring or contributing to the project.

Overall, the project blends educational content with interactive gameplay, leveraging a modern tech stack to deliver a compelling experience that bridges the gap between traditional and digital infrastructure concepts.

background image mobile

Join the mailing list

Get the latest news and updates