Inspiration
As a college freshman on a large university campus, I often find myself losing time, wandering on campus in between my classes, looking for the perfect place to study. While college campuses have dozens of great study locations, there's always a difficulty in finding the nearest one, or a tendency to stick to the same locations each time. I wanted to find a solution for students like me to quickly pinpoint their most optimal study environment.
What it does
Study Map is an app that helps college students navigate their campus to discover the best study locations for their needs. The app features an interactive map with all available study locations across their very own campus and a list of details for each, including noise level, amenities, capacity, and open hours. Users receive personalized study spot suggestions powered by Google Gemini, which analyzes your location and current time to recommend the top 3 spots for you!
How I built it
Full-stack hybrid web/mobile application:
- React Native Frontend: React Native with Vite for fast app production, deployable as an iOS app. Google Maps API integration for accurate campus visualization. UI designed with Figma.
- Node.js/Express Backend: API security and Google Gemini API integration for AI-powered recommendations.
- Deployment Strategy: web application accessible via browser or native iOS app. Android app support is viable as well.
Challenges I ran into
My initial prototype was tested using Expo Go, since it was the most efficient for iOS testing. However, integrating Google Maps requires native code, which Expo Go does not support, and so this confused me and completely rerouted my development flow. Google Maps was difficult to successfully deploy, and I had to figure out how to switch to building a native app in the Xcode iOS simulator.
Setting up Xcode's iOS simulator as a first-time user was also difficult. I struggled with understanding how my IDE and Xcode were collaborating, as well as countless AirGoogleMaps configuration errors. Debugging the map integration, figuring out how to enable Google SDK for iOS and use Google API's, plus dealing with unfamiliar Xcode tools, was an incredibly challenging development process.
Accomplishments that I'm proud of
- Successfully integrating Google Maps and Google Gemini APIs into a genuinely useful application for students like me
- Finding out how to create a hybrid web/mobile app, which is very common in most distributed software products, and thus is an important understanding
- Building a solo, full-stack application within a weekend while learning how frontend and backend components work with each other. Also, gaining experience in utilizing React Native, API calls, generative AI, Figma, and so much more!
What I learned
- AI integration and prompt engineering
- API calling and security
- full-stack web development
- environment-based configuration
- iOS app testing
- UI/UX design
What's next for Study Map
- Enhanced AI Capabilities: to improve recommendations based on user history and preferences, discover/recommend even more new places for the user, add study session planning based on student's Google Calendar
- Community Features: share study locations with friends, leave reviews, study buddy matching, study group scheduling/location voting, etc.!
- Expanded Campus Coverage: cover more major universities (potential partnerships with universities 👀), submission portal for students to add new study locations
- Accessibility & Inclusivity Features: accessibility information, multi-language support
Although I participated in this hackathon virtually and was unfortunately unable to present my project due to other commitments, the experience was still incredibly rewarding and taught me so much!
Enjoy! 📚🦆
Built With
- figma
- google-gemini-api
- google-maps
- ios
- react-native
- vite

Log in or sign up for Devpost to join the conversation.