MantraOS

"MantraOS: Your private AI mindset coach that works offline - personal motivation, zero privacy compromises." 🧠✨

Comment

Inspiration I struggled with motivation apps that either required expensive subscriptions or compromised privacy by sending personal data to cloud servers. When Google announced Chrome's revolutionary on-device AI APIs, I saw an opportunity to build something truly different - a motivation app that respects user privacy while delivering personalized AI-powered experiences entirely locally on the device.

What it does MantraOS is a progressive web app that helps users build positive mindsets through daily mantras and affirmations. While Chrome's AI APIs are gradually rolling out globally, I've built the complete architecture for features like AI-generated mantras, real-time translation, and intelligent rephrasing - all designed to process locally on the user's device. The app already offers voice recording, progress tracking, streak monitoring, and works completely offline as a installable PWA.

How we built it Frontend: Pure vanilla JavaScript (ES6+) with no frameworks for maximum performance

Styling: Tailwind CSS with custom glassmorphism design system

Storage: localStorage for complete offline functionality

AI Architecture: Complete integration points for Chrome's Built-in AI APIs (Prompt, Translator, Rewriter, Proofreader)

PWA Features: Service workers, manifest.json, and installability

Audio: Web Audio API for voice recording and playback

Responsive Design: Mobile-first approach works on all devices

Challenges we ran into Regional API Limitations: Chrome's AI APIs aren't yet available in South Africa, requiring sophisticated demo mode simulation

PWA Caching: Ensuring users always get the latest version without manual updates

Offline Complexity: Building a full-featured app that works completely without internet

Audio Storage: Efficiently managing voice recordings within browser storage limits

Cross-browser Compatibility: Maintaining consistent experience across different browsers while using cutting-edge web APIs

Accomplishments that we're proud of Built a production-ready app with complete AI architecture before the APIs are widely available

Created a privacy-first design where no user data ever leaves their device

Achieved seamless offline functionality with full feature set

Developed a sophisticated demo system that accurately simulates AI interactions

Built everything with vanilla JavaScript, demonstrating deep understanding of web fundamentals

What we learned The importance of future-proof architecture when working with emerging technologies

How to build sophisticated state management without frameworks

Progressive Web App capabilities and limitations

Privacy-by-design principles for user trust

The challenges of regional technology rollouts and graceful feature degradation

What's next for MantraOS Immediate Enhancements (Post-Hackathon):

  • Study & Focus Mode: Integration of Pomodoro-style focus timers with mantra intervals for students and professionals
  • Learning Affirmations: Specialized mantras for exam preparation, skill development, and academic confidence
  • Educational Partnerships: Collaborate with universities and mental health organizations

Technical Roadmap:

  • Real-time AI Activation: Automatic feature enablement as Chrome AI APIs roll out to new regions
  • Advanced Analytics: Deeper insights into user engagement and habit formation patterns
  • Therapist Dashboard: Tools for mental health professionals to customize mantra plans for clients

Community Growth:

  • Mantra Sharing: Opt-in community features for users to share and discover powerful affirmations
  • Corporate Wellness: Team features for workplace mental health programs
  • Multilingual Expansion: Support for additional languages as translation capabilities grow

Built With

  • css3
  • github
  • html5
  • javascript-(es6+)
  • lucide
  • mediarecorder-api
  • netlify
  • pwa
  • tailwind
  • vanilla
  • vibration
  • web-audio-api
Share this project:

Updates