Campus+

Inspiration

69.2% of students report feeling lonely and disconnected from their peers. Despite spending hours together in lectures, labs, and study sessions, many students struggle to build meaningful connections that last beyond a single semester. Even when friendships do form, they often fade after graduation due to a lack of dedicated communication channels.

The problem? There's no centralized, student-only platform where university students can connect based on their actual academic experience—their classes, their faculty, their major. We built Campus+ to solve this.

## What it does

Campus+ is a student-first social platform designed exclusively for universities—built to transform your academic journey into real, lasting communities.

Instead of scattered Discord servers, temporary WhatsApp groups, or Instagram DMs, Campus+ creates three structured community layers:

📚 Your Classes - Connect with classmates, share notes, form study groups
🏛️ Your Faculty - Network across departments and year levels
🎓 Your Major - Build relationships that extend beyond graduation

Students can:

Post questions, resources, and announcements
Like and comment to engage with their community
Direct message classmates and peers
Stay connected long after the semester ends

Campus+ turns the fragmented university experience into a dynamic, permanent network where academic communities thrive.

## How we built it

Tech Stack:

Frontend: Next.js 16 (App Router), React 19, Tailwind CSS v4
Backend: Supabase (authentication, planned database integration)
Deployment: Vercel with auto-deployment from GitHub

Development Process:

Ideation - We brainstormed ideas that everyone felt motivated to work on, focusing on solving a real problem we all experienced
Design - We sketched UI layouts together on paper (since we're not Figma experts!) and iterated based on user flow
Architecture - Built a component-based architecture with reusable UI components and mock data for rapid prototyping
Features - Implemented hierarchical communities (Faculty → Department → Course), Reddit-style feed, Twitter-style post detail pages, and real-time messaging
Integration - Added Google OAuth for seamless authentication and guest mode for easy demos

We used Claude Code extensively for pair programming, which accelerated our development significantly during the 18-hour sprint.

## Challenges we ran into

Database complexity vs. time constraints: As first-timers working with Supabase, we quickly realized that building a complete database schema, setting up relationships, and implementing real-time features would be too ambitious for an 18-hour hackathon. We pivoted to a mock data approach with localStorage persistence, allowing us to build a functional prototype that demonstrates all core features without backend complexity.

Design tools learning curve: None of us were experienced with Figma, so we went old-school—paper sketches and whiteboard sessions. This actually helped us iterate faster and focus on functionality over pixel-perfect designs.

Feature scope management: We had to constantly prioritize features and cut scope to deliver a working demo. The mantra became: "Does this feature demonstrate our core value proposition?" If not, it got pushed to v2.

## Accomplishments that we're proud of

✅ Google OAuth integration - Implemented seamless third-party authentication using Supabase ✅ Complete feature set - Despite time constraints, we built: hierarchical communities, post/comment system, like functionality, DM messaging, mobile-responsive UI ✅ Guest mode - Added a demo mode so users can explore without signing up ✅ Team synergy - Everyone worked on what they were good at, communication was excellent, and we shipped features in parallel ✅ Mobile-first design - Fully responsive with hamburger menu, drawer navigation, and touch-friendly interactions ✅ Claude Code workflow - Leveraged AI pair programming to 10x our development speed

## What we learned

Technical Skills:

Supabase authentication and OAuth flows
React 19 and Next.js 16 App Router patterns
Component-driven architecture with Tailwind CSS
State management and localStorage persistence
Responsive design and mobile-first development

Soft Skills:

Team coordination - Effective communication and task distribution in a time-crunch
Scope management - Knowing when to cut features and focus on core value
Pitching & showcasing - Presenting our vision clearly and compellingly
AI-assisted development - Using Claude Code for rapid prototyping and debugging

Process:

The power of paper prototyping over complex design tools
Mock data → MVP → Real backend is a valid approach for hackathons
Ship features incrementally rather than building everything at once

## What's next for Campus+

Phase 1 - Backend Integration (1-2 months):

Migrate from mock data to full Supabase database
Implement real-time messaging with Supabase Realtime
Add university email verification for account creation
Build proper data relationships (users → posts → comments → communities)

Phase 2 - Feature Enhancement (3-4 months):

Add image/file attachments to posts and messages
Implement notification system for mentions and replies
Create assignment reminder system
Build moderation tools for community admins
Add search and filtering capabilities

Phase 3 - Growth & Scale (6+ months):

Partner with student clubs and organizations for initial user base
Pilot program at a single university (likely UBC)
Gather user feedback and iterate on UX
Expand to multiple universities with isolated community instances
Build cross-platform sharing features (export to Instagram, Facebook, etc.)

The real challenge isn't the tech—it's user acquisition. Our go-to-market strategy focuses on grassroots campus adoption: partnering with student clubs, hosting info sessions, and leveraging word-of-mouth within tight-knit academic communities. Once students see their actual classmates on the platform, network effects take over.

Campus+ isn't just another social network—it's the missing infrastructure for university communities.