Mindful Messenger

Mindful Messenger

Chat App with Matrix Protocol & AI Chatbot

Frontend Mobile Engineer (Flutter) · Internship Project

Aug 2023 - Dec 2023

An AI-powered instant messaging app built with Flutter using Clean Architecture and BLoC state management. Features direct Matrix REST API integration without third-party SDKs for maximum protocol control, real-time personal and group chats, AI chatbot integration using Google Gemini REST API, and a custom push notification gateway powered by Node.js and Firebase Cloud Messaging (FCM).

FlutterFlutter
Dart
Clean Architecture
BLoC
Offline-First
Android
iOS
REST API
Matrix Protocol
Firebase Cloud Messaging (FCM)

Vendor & Client

Logo PT Simbolik Impera Dunia

PT Simbolik Impera Dunia

Vendor

Technology, Information and Media

Yogyakarta, Indonesia

Deep Dives

Covering technical aspects, such as architecture, design decisions, and implementation details.

What am I doing?

  • Architected an offline-first messaging MVP using Flutter, BLoC, GetIt, and Clean Architecture, storing local chat history with Hive for offline access.
  • Engineered 1-on-1 and Group Chat features using Matrix REST API, implementing an in-app offline queue to auto-deliver pending messages upon connection recovery.
  • Built rich messaging capabilities including message selection, multi-chat forwarding, dynamic presence (online/last seen), typing indicators, read receipts, and support for voice notes, images, videos, documents, and emojis.
  • Built a custom push notification gateway using Node.js and Firebase Cloud Messaging (FCM) to trigger background message alerts.
  • Integrated real-time AI Chatbot services over WebSockets, later migrating the client-side integration to Google Gemini REST API to ensure continuous service availability and high response reliability.

Project Overview

Mindful Messenger is an AI-enhanced instant messaging application designed to foster knowledge-sharing alongside standard communication. Built with Flutter, the app combines real-time chat infrastructure with an AI chatbot assistant to deliver a seamless, intelligent user experience.

The Challenge

  • Strict Architectural Control: Standard SDKs often limit customization for complex state synchronization and custom network protocols.
  • Complex Messaging Protocols: Implementing the Matrix protocol from scratch using raw REST APIs required precise handling of request flows, authentication, and chat synchronization.
  • Real-time AI Integration & Push Services: The app needed to handle persistent WebSocket connections for live AI chatbot responses alongside a reliable background push notification pipeline.

Technical Strategy & Architecture

  • Clean Architecture & BLoC: Separated core business logic, domain models, and data layers to ensure maintainability, scalability, and testability.
  • Custom Matrix REST API Client: Bypassed the default Matrix SDK to build a lightweight, direct HTTP client tailored specifically to the project's data needs, enhancing performance and architectural flexibility.
  • Real-Time Communication: Utilized WebSockets for responsive interaction with the company's proprietary AI service.
  • Notification Gateway: Designed and deployed a custom Node.js middleware server acting as a bridge between internal chat events and Firebase Cloud Messaging (FCM).

Key Features Delivered

  • Messaging & Sync: Personal and group chat creation, real-time message synchronization, and chat history management.
  • AI Knowledge Assistant: Interactive chatbot integration allowing users to query information directly within the messaging interface.
  • Polished UX: High-fidelity UI slicing from Figma with micro-interactions, responsive chat mechanics, and custom UI animations.
  • Multi-Platform Push Notifications: Reliable background event delivery via the Node.js/FCM gateway.

Impact & Key Takeaways

  • Delivered MVP Status: Fully met company functional criteria and shipped a production-ready messaging foundation.
  • Deep Protocol Mastery: Gained hands-on experience in low-level REST API integration, state management, and real-time socket connection cycles.

Feature Screenshots

Mindful Messenger - Chat Details
Mindful Messenger - Chat Details
Mindful Messenger - Send Document, Camera, Gallery, or Audio
Mindful Messenger - Send Document, Camera, Gallery, or Audio
Mindful Messenger - Send Voice Note, Emoji, Reply, or Forward Message
Mindful Messenger - Send Voice Note, Emoji, Reply, or Forward Message
Mindful Messenger - AI Chatbot Details
Mindful Messenger - AI Chatbot Details
Mindful Messenger - Profile, Group, and Settings
Mindful Messenger - Profile, Group, and Settings

Profile Avatar

Sahid Anwar

Software Engineer

Let's connect! Feel free to reach out for collaborations, inquiries, or just to say hi!