Inspiration
Networking can feel like a chore, especially in high-pressure environments like hackathons. We realized that even at this very event, many people (ourselves included!) struggled with the initial "social barrier" that awkward moment of trying to find a team or asking a stranger a question. We wanted to move away from the "artificial follower" culture of traditional social media and create something that felt more like a community and less like a resume board.
What it does
FishNet is a highly visual, immersive networking platform designed to help people connect for team-based events like hackathons, game jams, and group projects. Instead of static profiles, users share their personal interests and skills in a way that feels approachable and authentic. It’s a "school" of like-minded individuals looking for meaningful collaboration rather than just another digital connection.
How we built it
We leaned into modern web technologies to create a 3D environment that stands out from typical 2D interfaces:
Frontend: Built with React and Tailwind CSS for a responsive, sleek UI.
3D Graphics:
We used Three.js and Blender to create a custom 3D world. We even included hand-drawn elements and original 3D models to give it a unique, "handmade" feel.
Real-time Backend:
We utilized Firebase to handle live data and set up a GitHub repository to ensure seamless deployment and collaboration across different devices.
Challenges we ran into
The biggest hurdle was the technical leap into 3D web design. Integrating Three.js with React required a steep learning curve, especially when trying to ensure the 3D models rendered correctly across different browsers. Additionally, managing real-time interactions in a 3D space meant we had to be very careful with how we structured our Firebase calls to keep the experience smooth and lag-free.
Accomplishments that we're proud of
We are incredibly proud of the Immersive UI. Moving away from standard buttons and grids to a 3D space felt like a gamble, but seeing the hand-drawn art and custom models come to life was worth it. We also successfully implemented a live environment where different users can interact simultaneously, proving that our concept of a "digital school of fish" actually works.
What we learned
We learned that 3D is the future of web design. It transforms a website from a document you read into a space you inhabit. On a personal level, we learned how to overcome our own social anxieties by building a tool specifically designed to solve them. We also gained a much deeper understanding of the "React-Three-Fiber" ecosystem and real-time database management.
What's next for FishNet
We see FishNet scaling far beyond just hackathons. Our roadmap includes:
In-Event Communication:
Adding a corner chat interface and animated text bubbles that pop up directly from the fish (users).
Public Interest Hubs:
Expanding into public servers for topics like engineering, art, and programming help.
Enhanced Accessibility:
Optimizing our 3D renders for lower-end devices to ensure FishNet is inclusive for everyone, regardless of their hardware.
Log in or sign up for Devpost to join the conversation.