Campus Guide

A web app that aid students and other staffs to navigate through the University Campus easily.

Comment

Project Story: Campus Guide AI

About the Project

Campus Guide is a smart campus navigation and pharmacy locator web app that I created to help students, especially freshmen, easily find their way around the university. The idea came from my own experience—when I first arrived on campus, I often got lost trying to locate lecture halls, offices, or health centers. I knew I wasn't alone in that, and I wanted to find a solution to the problem.

The platform allows users to search for specific campus locations and medicines using either text or voice input. It supports real-time directions via Google Maps and offers multilingual support—including French, Spanish, German, Chinese, Twi, Ga, and other Ghanaian languages—so that even students more comfortable in local languages can easily use it.

What Inspired Me

I still remember my first week on campus. I was late to class, walked in circles trying to find the classroom block, and had to rely on strangers for directions. That sense of confusion and frustration stuck with me. The issue was worse for students from rural areas, especially those who aren’t fluent in English. I imagined how helpful it would be to have a smart assistant that understands local dialects and offers instant directions, right from your phone or computer. I wanted to build something inclusive, intelligent, and useful from day one of campus life.

How I Built It

  • Using Bolt AI, I built;
  • Frontend: I used React and TypeScript to build a modern, responsive interface with Tailwind CSS.
  • Backend: I integrated Supabase to handle authentication and manage data like campus locations and pharmacy inventories.
  • Voice Search: I used the Web Speech API to add voice commands for searching locations and medicines.
  • Multilingual Support: I implemented language detection and translation support for Ghanaian languages like Twi and Ga, as well as global languages like French, Spanish, German, and Chinese.
  • AI Integration: Using Bolt AI Studio, I generated prompts to enhance voice interaction and improve navigation logic.
  • PWA: I made the platform installable as a Progressive Web App so students can access it even with limited internet.
  • Admin & Pharmacy Dashboards: I built two dashboards—one for administrators to manage locations and one for pharmacies to manage available medicines.

What I Learned

  • How to use voice recognition with multilingual inputs.
  • Building real-world AI-enhanced applications in a fast-paced environment.
  • Integrating APIs like Google Maps and Supabase smoothly into a React app.
  • How to plan and structure a scalable, modular project under tight deadlines.

Challenges I Faced

  • Gathering and entering accurate GPS data for various campus locations was tedious.
  • Supporting voice input in Twi and Ga required testing and training the input models carefully.
  • I had to optimize the app to work even in areas with poor internet connectivity.
  • Designing an interface that was simple for students yet powerful for admins and pharmacies was a balancing act.

Final Thoughts

Campus Guide is my answer to the everyday struggles students face navigating a large campus. I’m proud of how far it has come—from a personal frustration to a working solution that blends accessibility and practical design. I believe this tool can scale to serve other universities and student communities across Africa and beyond.

Built With

  • bolt
  • elevenlabs
  • google
  • localstorage
  • lottie
  • lucide
  • maps
  • netlify
  • pwa
  • react
  • speech
  • supabase
  • tailwind
  • vite
  • web
Share this project:

Updates