agentic-flutter-vertex

🌟 VoiceFlow Diary

Flutter Firebase Vertex AI

**An intelligent diary app powered by voice AI** 🎙️✨ Transform your thoughts into beautiful diary entries using the power of Google's Gemini AI with real-time voice conversation capabilities. [Documentation / Documentación (Docusaurus)](/agentic-flutter-vertex/documentation/) • [Features](#-features) • [Demo](#-demo)

📖 Overview

VoiceFlow Diary is a next-generation journaling application that combines traditional diary keeping with cutting-edge AI voice technology. Built with Flutter and powered by Firebase Vertex AI (Gemini), it offers multiple ways to capture your daily moments—from traditional typing to hands-free voice conversations.

🎯 What Makes It Special?

✨ Features

🎙️ Voice Interaction Modes

VoiceFlow Diary offers three distinct voice interaction modes for maximum flexibility:

1. 🔮 Gemini Live Assistant (Real-Time Conversation)

2. 🎤 Traditional Voice Assistant

3. 🎙️ Voice Note Creation

🤖 AI Capabilities

Content Analysis

Image Generation

Conversational AI

💾 Data Management

🎨 User Interface

🎬 Demo

Voice Interaction Comparison

Feature Gemini Live Traditional Voice Note
Latency <1 second 3-5 seconds 2-4 seconds
Interaction Continuous Start/Stop Single shot
Response Type Voice Text Processed entry
Best For Natural chat Deliberate commands Quick capture
Network Usage Higher Medium Medium

Screenshots

┌─────────────────────────────────────────────────────────┐
│                    📱 VoiceFlow Diary                   │
├─────────────────────────────────────────────────────────┤
│                                                         │
│  🔮  Live Voice Assistant (Large Purple Button)        │
│      → Real-time conversation with Gemini              │
│                                                         │
│  🎤  Traditional Assistant (Deep Purple)               │
│      → Record → Process → Respond                      │
│                                                         │
│  🎙️  Voice Command (Teal)                              │
│      → Quick diary entry creation                      │
│                                                         │
│  ✏️  Manual Entry (Primary Color)                      │
│      → Traditional typing                              │
│                                                         │
└─────────────────────────────────────────────────────────┘

🚀 Installation

Prerequisites

Setup Steps

  1. Clone the repository 
    git clone https://github.com/weincoder/agentic-flutter-vertex.git
cd agentic-flutter-vertex/example
  2. Install dependencies 
    flutter pub get
  3. Configure Firebase 
    # Install FlutterFire CLI
dart pub global activate flutterfire_cli
   
# Configure Firebase for your project
flutterfire configure
  4. Set up Vertex AI
    • Enable Vertex AI API in Google Cloud Console
    • Enable the following models:
      • gemini-1.5-flash (Chat)
      • gemini-2.0-flash-live-preview-04-09 (Live)
      • imagen-3.0-generate-002 (Images)

  5. Configure permissions

    iOS (ios/Runner/Info.plist):

    <key>NSMicrophoneUsageDescription</key>
<string>VoiceFlow Diary needs microphone access to record voice notes</string>
<key>NSSpeechRecognitionUsageDescription</key>
<string>VoiceFlow Diary uses speech recognition to transcribe your voice</string>

    Android (android/app/src/main/AndroidManifest.xml):

    <uses-permission android:name="android.permission.RECORD_AUDIO"/>
<uses-permission android:name="android.permission.INTERNET"/>
  6. Run the app 
    # iOS
flutter run -d ios
   
# Android
flutter run -d android
   
# Web
flutter run -d chrome
   
# Desktop
flutter run -d macos  # or windows, linux

🏗️ Architecture

Project Structure

lib/
├── main.dart                          # App entry point
├── config/
│   ├── app/
│   │   └── app.dart                   # Root app widget with Provider
│   ├── data/
│   │   ├── database_helper.dart       # SQLite database setup
│   │   └── diary_repository.dart      # Data access layer
│   ├── firebase/
│   │   └── firebase_options.dart      # Firebase configuration
│   ├── ia/
│   │   ├── app_agents/
│   │   │   ├── diary_agent.dart       # Diary entry AI agent
│   │   │   ├── image_generator.dart   # Imagen 3.0 integration
│   │   │   └── voice_assistant_agent.dart  # Voice command processor
│   │   └── models/
│   │       └── ia_models.dart         # AI model configurations
│   ├── models/
│   │   └── diary_entry.dart           # Data models
│   └── state/
│       └── app_state.dart             # Global app state (Provider)
└── ui/
    ├── pages/
    │   ├── diary_home_page.dart       # Main screen
    │   └── new_entry_page.dart        # Entry editor
    └── widgets/
        ├── entry_card.dart            # Entry display card
        ├── image_viewer.dart          # Full-screen image viewer
        ├── live_voice_assistant.dart  # Gemini Live integration
        ├── voice_assistant_button.dart # Traditional voice assistant
        ├── voice_command_button.dart  # Voice note creation
        └── voice_commands_help_dialog.dart # Help dialog

Tech Stack

Core Framework

Firebase & AI

Audio Processing

State Management

Data Persistence

UI & Utilities

Data Flow

┌─────────────────────────────────────────────────────────────┐
│                         User Input                          │
│            (Voice / Text / Traditional Commands)            │
└────────────────────────┬────────────────────────────────────┘
                         │
                         ▼
┌─────────────────────────────────────────────────────────────┐
│                     Voice Processing                         │
│  ┌──────────────┐  ┌──────────────┐  ┌──────────────┐      │
│  │  Gemini Live │  │ Traditional  │  │  Voice Note  │      │
│  │  (Streaming) │  │  (Recording) │  │  (Capture)   │      │
│  └──────────────┘  └──────────────┘  └──────────────┘      │
└────────────────────────┬────────────────────────────────────┘
                         │
                         ▼
┌─────────────────────────────────────────────────────────────┐
│                    Gemini AI Processing                      │
│  • Transcription  • Analysis  • Classification              │
│  • Content Generation  • Function Calling                   │
└────────────────────────┬────────────────────────────────────┘
                         │
         ┌───────────────┼───────────────┐
         ▼               ▼               ▼
    ┌────────┐     ┌─────────┐    ┌──────────┐
    │ Action │     │  Store  │    │  Image   │
    │ (Theme)│     │  Entry  │    │  Gen     │
    └────────┘     └─────────┘    └──────────┘
         │               │               │
         ▼               ▼               ▼
    ┌──────────────────────────────────────┐
    │         App State / Database         │
    │   (Provider notifies UI updates)     │
    └──────────────────────────────────────┘
                     │
                     ▼
               ┌──────────┐
               │ UI Update│
               └──────────┘

Key Design Patterns

  1. Singleton Pattern: AI agents are instantiated once
  2. Repository Pattern: Data access abstraction
  3. Provider Pattern: Reactive state management
  4. Factory Pattern: Model creation and initialization
  5. Stream Pattern: Real-time audio streaming (Gemini Live)

📚 Documentation

Additional Guides

Located in /example:

Voice Commands Reference

Theme Commands

"Cambia el color a azul"
"Pon la app en rojo"
"Quiero el tema morado"

Query Commands

"¿Qué tiempo hace hoy?"
"¿Cuál es la capital de Francia?"
"Explícame qué es la fotosíntesis"

Diary Commands

"Resume mi semana"
"Muestra un resumen del mes"
"¿Qué escribí hoy?"

Management Commands

"Elimina la última entrada"
"Borra la entrada de ayer"

API Reference

DiaryAgent

class DiaryAgent {
  // Analyze diary content
  Future<Map<String, dynamic>> analyzeContent(String content);
  
  // Generate entry title
  Future<String> generateTitle(String content);
  
  // Extract emotions
  Future<List<String>> detectEmotions(String content);
  
  // Generate tags
  Future<List<String>> generateTags(String content);
}

VoiceAssistantAgent

class VoiceAssistantAgent {
  // Process voice command
  Future<VoiceCommandResult> processCommand(String audioPath);
  
  // Command types
  enum VoiceCommandType {
    colorChange,
    question,
    summary,
    deleteEntry,
    unknown,
  }
}

LiveVoiceAssistant

class LiveVoiceAssistant {
  // Function declarations for Gemini Live
  - setAppColor(color: String)
  - getDiarySummary(timeRange: String)
  - deleteEntry(target: String)
}

🎨 Customization

Theme Colors

The app supports dynamic theming via voice commands. Available colors:

Spanish English Color Code
rojo red Colors.red
azul blue Colors.blue
verde green Colors.green
morado purple Colors.purple
naranja orange Colors.orange
rosa pink Colors.pink
turquesa teal Colors.teal
índigo indigo Colors.indigo
café brown Colors.brown
ámbar amber Colors.amber

Voice Configuration

Edit voice settings in live_voice_assistant.dart:

LiveGenerationConfig(
  speechConfig: SpeechConfig(
    voiceName: 'Achernar', // Change voice
  ),
  responseModalities: [ResponseModalities.audio],
)

Available voices: Check Google Cloud TTS documentation

Audio Settings

Modify audio configuration in voice widgets:

RecordConfig(
  encoder: AudioEncoder.pcm16bits,
  sampleRate: 24000,  // Adjust sample rate
  numChannels: 1,     // Mono/Stereo
  echoCancel: true,   // Echo cancellation
  noiseSuppress: true, // Noise suppression
)

🔧 Configuration

Environment Variables

Create a .env file (if needed for future enhancements):

FIREBASE_PROJECT_ID=your-project-id
VERTEX_AI_LOCATION=us-central1

Firebase Configuration

Edit firebase_options.dart after running flutterfire configure:

static const FirebaseOptions currentPlatform = FirebaseOptions(
  apiKey: 'your-api-key',
  projectId: 'your-project-id',
  messagingSenderId: 'your-sender-id',
  appId: 'your-app-id',
  // ... platform-specific options
);

🧪 Testing

Run Tests

flutter test

Integration Tests

flutter test integration_test/

Analyze Code

flutter analyze

📊 Performance

Benchmarks

Metric Gemini Live Traditional Voice Note
Response Time <1s 3-5s 2-4s
Token Usage 2-3x higher Medium Medium
Network Bandwidth High (streaming) Medium Medium
Battery Impact Higher Medium Low
Accuracy Excellent Excellent Excellent

Optimization Tips

  1. Use Traditional mode for battery-conscious scenarios
  2. Batch operations when creating multiple entries
  3. Cache images locally to reduce API calls
  4. Limit summary queries to reduce token usage

🤝 Contributing

We welcome contributions! Please follow these guidelines:

  1. Fork the repository
  2. Create a feature branch: git checkout -b feature/amazing-feature
  3. Commit changes: git commit -m 'Add amazing feature'
  4. Push to branch: git push origin feature/amazing-feature
  5. Open a Pull Request

Code Style

📝 License

This project is licensed under the MIT License - see the LICENSE file for details.

🙏 Acknowledgments

📞 Support

🗺️ Roadmap

Version 2.0

Version 3.0

### Made with ❤️ using Flutter & Firebase Vertex AI **[⬆ Back to Top](#-voiceflow-diary)**

agentic-flutter-vertex

This site is open source. Improve this page.