HopeHub

• 

• 

• 

👀 Inspiration

We were inspired by Fourth & Hope’s mission to provide shelter, meals, and support services for individuals experiencing homelessness. After speaking with a dedicated staff member, we saw the immense effort they put into serving clients — yet many of their systems remained fragmented, paper-based, or difficult to access. HopeHub was created to unify these processes and empower staff with a centralized tool to manage client data, track services, and demonstrate outcomes.

💡 What it does

HopeHub is a client management platform designed for nonprofits like Fourth & Hope. It enables staff to:

• Log and track services for both overnight and day-use clients

• View and manage client profiles

• Generate reports to support grant applications

• Improve internal communication with tools like Messages and Announcements

🛠 How we built it

• Design: We conducted interviews and synthesized insights to inform our features. We used Figma to design low-, mid-, and high-fidelity wireframes.

• Frontend & Backend: We plan to use Next.js and Tailwind CSS for the frontend, with a Node.js/Express backend.

• Database: Used Firebase (Firestore) for database and authentication.

• Architecture: We’re building a microservice for case management and defining secure API endpoints to limit client-side access to sensitive data.

🧱 Challenges we ran into

• Designing for both mobile and desktop within a short timeframe

• Structuring the database and planning how data flows securely between components

• Balancing visual hierarchy with functional needs in the UI

• Generating meaningful outcome reports using a limited dataset

🏆 Accomplishments that we're proud of

• Conducted thorough user research that directly influenced our design decisions

• Created high-fidelity prototypes for a platform tailored to real needs

• Built a flexible and scalable design system that can be extended into development

• Prioritized accessibility, clarity, and ease of use for a wide range of users

📚 What we learned

• Planning out tech stacks and endpoints early can save a lot of time later

• A SQL database is essential for structured data and long-term scalability

• Building with user context in mind — not assumptions — leads to better solutions

• Collaborative alignment on design systems improves development handoff

🚀 What’s next for HopeHub

• Finalize mobile-compatible high-fidelity wireframes

• Build the web app with backend integration and case management microservices

• Migrate to a SQL database and implement secure API endpoints

• Add features like Messages and Announcements to streamline staff communication

• Conduct more rounds of testing with real users

Built With

• figma
• firebase
• gemini
• next.js
• typescript