Batanani.io

Bata

Comment

Inspiration

Batanani.io was inspired by a simple but powerful observation — there’s incredible talent everywhere, even under the trees along the streets of Gaborone. I noticed many skilled hairstylists working informally, yet they often struggle to reach more clients or grow their businesses because of visibility and access issues. At the same time, I’ve seen how people in Botswana and beyond find it difficult to rely on one source of income. While some join the ride-hailing boom, others depend on creative or small-scale work that doesn’t always get the recognition or digital support it deserves. So I wanted to build something that connects people, empowers young entrepreneurs, and uses AI to remove barriers of language, location, and opportunity. Batanani.io is more than a web app — it’s a community-driven idea to help people earn, grow, and connect in their local area.

What it does

Batanani.io connects hairdressers and clients within Gaborone and surrounding areas. It allows users to: Discover nearby hairstylists based on location and style preferences, Book appointments easily online Chat or speak directly with an AI assistant in multiple languages (English, Setswana, and Ndebele) Manage bookings and profiles through a simple, mobile-friendly dashboard For hairstylists, it’s a tool to showcase their skills, get discovered, and grow their customer base. For clients, it’s the easiest way to find trusted professionals nearby, without endless searching or word-of-mouth.

How I built it

I built Batanani.io using a modern full-stack setup with Next.js, Prisma, PostgreSQL, Firebase, and Clerk Authentication. The frontend uses Next.js (App Router) with Tailwind CSS and shadcn/ui for a clean, responsive design. The backend is powered by Next.js API routes with Prisma ORM for PostgreSQL data management. Firebase Firestore and Storage handle real-time data and media uploads (like profile images). For AI integration, I implemented a Hybrid AI System: First, it tries the Chrome Built-in AI (on-device, experimental).If unavailable, it falls back to the Google Gemini API for text generation and translation .Clerk provides secure and easy authentication for both users and admins. This architecture allows the app to handle AI conversations, multilingual support, and booking management seamlessly.

Challenges I ran into

Building Batanani.io wasn’t without obstacles: AI Language Handling: Getting the AI to respond correctly in Setswana and Ndebele was challenging and not working. translation accuracy and cultural context are still areas to refine. Voice Recognition Issues: Ensuring consistent performance of speech-to-text across browsers was tricky, especially with local accents. Integration Overload: Combining Clerk, Firebase, and Prisma smoothly required careful state and data synchronization. Limited Access to Chrome AI: The Chrome Built-in AI is still experimental, meaning users need developer browsers and flags enabled. Scalability Planning: Designing a platform that could later expand into other industries (farming, logistics, etc.) required thoughtful architecture decisions early on.

Accomplishments that I'm proud of

How to integrate AI services (Gemini + Chrome AI) into a real-world product. The importance of language localization in AI — how people connect better when technology speaks their language. Deepened my understanding of Next.js App Router architecture and serverless API routes. Learned to handle complex authentication flows with Clerk and Prisma. Gained insight into building community-driven solutions that mix technology with real social impact. This project also taught me that AI isn’t just for tech giants — it can be a tool for everyday people if designed with empathy and purpose.

What I learned

How to integrate AI services (Gemini + Chrome AI) into a real-world product. The importance of language localization in AI — how people connect better when technology speaks their language. Deepened my understanding of Next.js App Router architecture and serverless API routes. Learned to handle complex authentication flows with Clerk and Prisma. Gained insight into building community-driven solutions that mix technology with real social impact. This project also taught me that AI isn’t just for tech giants — it can be a tool for everyday people if designed with empathy and purpose.

What's next for Batanani

The journey doesn’t end here. The next steps for Batanani.io include:

💬 Expanding language support — adding more African languages for inclusivity

🔔 Real-time notifications for appointments and messages

💳 Payment integration (Stripe, PayPal, or local options like Orange Money)

📱 Mobile app version (React Native)

🎥 Video consultations with stylists

🌾 Expansion beyond hairstyling — into other services like farming produce, logistics, and local crafts

📊 Advanced analytics for stylists to track bookings and earnings

🔊 AI voice responses (TTS) for a more natural, conversational experience

Beyond Batanani.io itself, I want to go deeper into AI development to help build and structure databases across Botswana especially for government institutions. Many organizations still face challenges with data management, accessibility, and digital integration. My long-term goal is to use AI tools and systems like those powering Batanani.io to simplify database creation, automate data organization, and strengthen digital infrastructure across the country.

Hopefully, AI can make this process faster, more efficient, and more inclusive, helping Botswana move closer to a connected, data-driven future.

Ultimately, the vision is to make Batanani.io a unified AI-powered local services platform — connecting people, opportunities, and institutions, and using technology to empower communities and build national progress.

Built With

Share this project:

Updates