Inspiration
The idea for Àmàlàmi was sparked by a simple, shared experience: the challenge of finding a truly great plate of Àmàlà in a new city or neighborhood. While countless apps exist for finding pizza or coffee, a dedicated, community-driven platform for a beloved cultural dish like Àmàlà was missing. We envisioned an app that could not only help people find these cherished spots but also foster a community of enthusiasts who could share their discoveries. Our project, Àmàlàmi, is our answer to that need—a digital atlas for all things Àmàlà, built by and for its lovers. The project's value is truly in its collaborative nature, where the sum of all community contributions creates a powerful, useful resource.
∑i=1nUserContributionsi=AˋmaˋlaˋmiAtlas
What it does
Àmàlàmi is a single-page web application that serves as a crowdsourced map and review guide for Àmàlà spots. It allows users to:
Authenticate as either a signed-in user or an anonymous guest.
Submit new Àmàlà spots to a public, real-time database.
Discover new spots displayed on a dynamic map.
Benefit from AI-powered features, including automatic descriptions, image analysis, review summarization, and a conversational assistant powered by the Google Gemini API.
Receive an audio welcome via a text-to-speech feature, adding a unique, auditory layer to the user experience.
How we built it
We built Àmàlàmi using a lean but robust technology stack focused on rapid development and real-time functionality.
Our frontend is a single-page application built with HTML5, CSS3 (Tailwind CSS), and JavaScript (ES6+). This approach allowed us to create a fast, responsive, and mobile-first user interface.
For our backend-as-a-service, we relied on Firebase. We used Firebase Authentication to manage user logins and Firestore Database for all data storage. The real-time nature of Firestore was critical, ensuring that new spots appeared on the map instantly for all users.
The core of our intelligent features is our integration with the Google Gemini API. We made multiple API calls to handle different functionalities, including text generation for spot descriptions, image-to-text analysis, and a chat assistant. The seamless connection between these technologies is the essence of our project's architecture.
Challenges we ran into
Despite our clear plan, we encountered a few hurdles:
Firebase Security Rules: Ensuring our Firestore data was secure while still allowing public read/write access for user-submitted content required careful configuration of security rules.
Multi-Modal API Integration: Integrating a multi-modal API like Gemini, which handles both text and images, presented a challenge. Managing asynchronous calls and ensuring smooth performance without slowing down the app required careful planning and execution.
Time Constraints: The fast-paced hackathon environment meant we had to be ruthless with our prioritization, focusing only on the core MVP features to ensure we had a working product to submit.
Accomplishments that we're proud of
We are most proud of successfully integrating three complex technologies—HTML, Firebase, and the Google Gemini API—into a single, cohesive, and functional application. Building an entire multi-user, data-driven application in a single file demonstrates our ability to work efficiently and deliver a complete solution. We are also proud of the unique AI features we implemented, which go beyond a simple map to provide a truly delightful user experience.
What we learned
This project was a masterclass in modern web development and rapid prototyping. We learned that:
Generative AI is a powerful tool that can be integrated into core product features to create unique and engaging user experiences, not just chatbots.
Building with constraints forces you to focus on the essential features that deliver the most value.
The value of a platform grows exponentially when it is powered by a community, which was the foundational principle of our project.
What's next for Àmàlámi (Amala Atlas)
We have a clear roadmap for future enhancements, including:
Review and Rating System: Implementing a full-featured review system where users can submit ratings and comments for each spot.
Geolocation: Using the browser's geolocation API to automatically suggest a user's current location when adding a new spot.
Image Uploads: Allowing users to upload images of Àmàlà spots to the database for more comprehensive listings.
Search and Filters: Adding functionality to search and filter spots by criteria such as rating, location, and price range.
Admin Dashboard: Creating a separate admin interface for managing, approving, or removing submitted spots and reviews.
Built With
- css3-(tailwind-css)
- frontend:-html5
- javascript
Log in or sign up for Devpost to join the conversation.