FlowPoint - IoT Energy & Environmental Monitoring

Enterprise IoT Monitoring Platform for Energy Management and Environmental Analysis

A comprehensive Flutter application for real-time energy consumption monitoring, power quality analysis, and environmental condition tracking

Overview

FlowPoint is a professional-grade IoT monitoring application built with Flutter, designed for real-time energy management and environmental analysis. The application connects to IoT sensor networks via Blynk server infrastructure to provide detailed insights into electrical parameters, energy consumption patterns, and environmental conditions.

Key Features

Real-time Monitoring Dashboard

Live data monitoring with configurable update intervals
Comprehensive system summary with total energy, temperature, and humidity metrics
Connection status monitoring with precise timestamp tracking
Responsive design optimized for mobile and tablet devices

Power System Analysis

Voltage and current monitoring with real-time electrical parameters
Active power consumption tracking in Watts
Apparent power measurement in Volt-Amps
Power factor analysis for energy efficiency assessment
Grid frequency monitoring in Hertz

Power Quality Assessment

Reactive power consumption tracking in VAR
Cumulative energy consumption in Watt-hours
Comprehensive power quality metrics and analytics

Environmental Monitoring

Real-time temperature tracking in Celsius
Environmental humidity level monitoring
Sensor connectivity status and health monitoring

Advanced Data Visualization

Interactive multi-sensor data visualization using FL Chart
Multiple chart types including temperature trends, power consumption analysis, and voltage monitoring
Configurable time-range selection with 1-hour, 3-hour, and 24-hour viewing options
Touch-enabled tooltips for detailed data point inspection

Intelligent Analytics

Fuzzy Sugeno inference system for smart recommendations
Historical data analysis with statistical summaries
Adaptive threshold monitoring and alerting
Performance trend analysis and forecasting

User Interface

Material Design 3 implementation with adaptive theming
System-aware dark and light theme switching
Gradient-based card designs for modern visual appeal
Phosphor icon system for consistent iconography
Responsive layout system for all screen sizes

Technical Architecture

Technology Stack

Framework: Flutter 3.19
Programming Language: Dart 3.3
State Management: Provider pattern
Data Visualization: FL Chart library
HTTP Communication: Dart http package
Typography: Google Fonts (Lato)
Iconography: Phosphor Icons

System Architecture

graph TB
    %% IoT Hardware Layer
    subgraph IoT ["IoT Hardware Layer"]
        ESP32[ESP32 Microcontroller]
        Sensors[Sensor Array<br/>Temperature, Humidity,<br/>Voltage, Current]
    end

    %% Cloud Infrastructure
    subgraph Cloud ["Cloud Infrastructure"]
        Blynk[Blynk IoT Server<br/>iot.serangkota.go.id:8080]
        API[Blynk HTTP API<br/>Virtual Pins V0-V9]
    end

    %% Application Layer
    subgraph App ["FlowPoint Application"]
        subgraph Providers ["State Management"]
            SensorProvider[Sensor Provider<br/>Data Fetching & Processing]
            SettingsProvider[Settings Provider<br/>User Preferences]
            ThemeProvider[Theme Provider<br/>UI Theming]
            DashboardProvider[Dashboard Provider<br/>Layout Configuration]
        end

        subgraph UI ["User Interface Layer"]
            Dashboard[Dashboard Screen<br/>Real-time Monitoring]
            Charts[Chart Screen<br/>Data Visualization]
            Settings[Settings Screen<br/>Configuration]
            About[About Screen<br/>Application Info]
        end

        subgraph Widgets ["UI Components"]
            SummaryCard[Summary Card<br/>Key Metrics]
            PowerMetrics[Power Metrics Section<br/>Electrical Parameters]
            Environment[Environment Section<br/>Temperature/Humidity]
            ChartWidgets[Chart Widgets<br/>FL Chart Integration]
        end
    end

    %% Data Flow
    Sensors --> ESP32
    ESP32 --> Blynk
    Blynk --> API
    API --> SensorProvider
    
    SensorProvider --> Dashboard
    SensorProvider --> Charts
    
    SettingsProvider --> UI
    ThemeProvider --> UI
    DashboardProvider --> Widgets
    
    Dashboard --> Widgets
    Charts --> ChartWidgets

Data Processing Flow

sequenceDiagram
    participant S as Sensors
    participant E as ESP32
    participant B as Blynk Server
    participant SP as Sensor Provider
    participant UI as User Interface
    participant DB as Local Storage

    Note over S,B: Data Collection Phase
    loop Every 3 Seconds
        S->>E: Read Sensor Data
        E->>B: Push to Virtual Pins
    end

    Note over SP,UI: Data Retrieval Phase
    loop Every 3 Seconds
        SP->>B: Fetch All Virtual Pins (V0-V9)
        B->>SP: Return Sensor Values
        SP->>SP: Parse & Validate Data
        SP->>DB: Cache Historical Data
        SP->>UI: Update UI State
        UI->>UI: Rebuild Widgets
    end

    Note over UI,DB: User Interaction
    UI->>UI: Display Real-time Dashboard
    UI->>UI: Render Interactive Charts
    UI->>UI: Show Notifications
    UI->>DB: Store User Preferences

Component Interaction

flowchart TD
    Start[App Launch] --> Init[Initialize Providers]
    
    Init --> SP_Init[Initialize Sensor Provider]
    Init --> Theme_Init[Initialize Theme Provider]
    Init --> Settings_Init[Initialize Settings Provider]
    
    SP_Init --> Config[Load Blynk Configuration]
    Config --> StartPolling[Start Data Polling]
    
    StartPolling --> FetchData[Fetch Data from Blynk]
    FetchData --> ProcessData[Process Sensor Data]
    
    ProcessData --> UpdateUI[Update UI Components]
    UpdateUI --> Dashboard[Dashboard Display]
    UpdateUI --> Charts[Chart Visualization]
    
    Dashboard --> Summary[Summary Card]
    Dashboard --> Power[Power Metrics]
    Dashboard --> Environment[Environment Section]
    
    Charts --> TimeRange[Time Range Selection]
    Charts --> ChartType[Chart Type Selection]
    Charts --> Stats[Statistical Analysis]
    
    Settings_Init --> LoadPrefs[Load User Preferences]
    Theme_Init --> ApplyTheme[Apply Theme Settings]
    
    LoadPrefs --> Notifications[Configure Notifications]
    LoadPrefs --> DashboardConfig[Dashboard Layout]
    
    Notifications --> Thresholds[Set Alert Thresholds]
    DashboardConfig --> SectionVisibility[Section Visibility]

Sensor Data Model

class SensorData {
  double voltage;          // V0 - Electrical voltage in volts
  double current;          // V1 - Electrical current in amperes
  double power;            // V2 - Active power consumption in watts
  double powerFactor;      // V3 - Power factor measurement (0.0-1.0)
  double apparentPower;    // V4 - Apparent power in VA
  double energy;           // V5 - Cumulative energy in watt-hours
  double frequency;        // V6 - Electrical frequency in Hz
  double reactivePower;    // V7 - Reactive power in VAR
  double temperature;      // V8 - Environmental temperature in Celsius
  double humidity;         // V9 - Environmental humidity percentage
  DateTime timestamp;      // Data collection timestamp
  bool isOnline;           // System connectivity status
}

Installation and Setup

Prerequisites

Flutter SDK version 3.19.0 or higher
Dart SDK version 3.3 or higher
Android SDK 21+ or iOS 13.0+
Network connectivity for real-time data synchronization

Installation Steps

Clone Repository

git clone https://github.com/dankehidayat/flowpoint.git
cd flowpoint

Install Dependencies

flutter pub get

Launch Application

flutter run

Project Structure

lib/
├── main.dart                          # Application entry point
├── models/
│   └── sensor_data.dart              # Data model definitions
├── providers/
│   ├── sensor_provider.dart          # Sensor data management
│   ├── settings_provider.dart        # Application configuration
│   ├── theme_provider.dart           # Theme management
│   └── dashboard.dart                # Dashboard state management
├── utils/                            # Utility classes and helpers
└── view/
    ├── screens/
    │   ├── about_screen.dart         # Application information
    │   ├── appearance_screen.dart    # Theme customization
    │   ├── chart_screen.dart         # Data visualization
    │   ├── dashboard_customization_screen.dart # Layout configuration
    │   ├── dashboard_screen.dart     # Main dashboard interface
    │   ├── settings_screen.dart      # Application settings
    │   └── notification.dart         # Alert configuration
    └── widgets/
        ├── chart/                    # Visualization components
        │   ├── chart_container.dart
        │   ├── chart_data_helper.dart
        │   ├── chart_legend.dart
        │   ├── chart_type_selector.dart
        │   ├── stats_summary.dart
        │   └── time_range_selector.dart
        └── dashboard/                # Dashboard components
            ├── environment_card.dart
            ├── environment_section.dart
            ├── gauge_environment_card.dart
            ├── last_updated_widget.dart
            ├── power_metrics_section.dart
            ├── power_quality_section.dart
            ├── sensor_card.dart
            ├── status_card.dart
            └── summary_card.dart

Configuration

API Integration

Base URL: http://iot.serangkota.go.id:8080
Data Synchronization Interval: 3 seconds
Virtual Pin Range: V0 to V9 for comprehensive sensor data

Platform Configuration

Android Permissions

<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.VIBRATE" />
<uses-permission android:name="android.permission.RECEIVE_BOOT_COMPLETED"/>

Network Security Includes network security configuration for Android 9+ compatibility with cleartext traffic allowance for Blynk server communication.

IoT Integration

Virtual Pin Configuration

Virtual Pin	Measurement	Unit	Description
V0	Voltage	V	Electrical potential measurement
V1	Current	A	Electrical current flow
V2	Active Power	W	Real power consumption
V3	Power Factor	-	Energy efficiency coefficient
V4	Apparent Power	VA	Total power consumption
V5	Energy	Wh	Cumulative energy usage
V6	Frequency	Hz	Electrical grid frequency
V7	Reactive Power	VAR	Non-working power component
V8	Temperature	°C	Environmental temperature
V9	Humidity	%	Environmental humidity level

Data Acquisition Strategy

Future<void> fetchDataFromBlynk() async {
  final List<Future<http.Response>> requests = [];
  for (int i = 0; i <= 9; i++) {
    final url = Uri.http('$_blynkServer:$_blynkPort', '/$_authToken/get/V$i');
    requests.add(http.get(url));
  }
  final responses = await Future.wait(requests);
  // Data processing and state updates
}

Build and Deployment

Production Build Commands

Android Application Package

flutter build apk --release

Android App Bundle

flutter build appbundle --release

iOS Archive (Requires macOS and Xcode)

flutter build ipa --release

Build Specifications

Minimum SDK: Android 6.0 (API level 23)
Target SDK: Latest Android version
ProGuard Optimization: Enabled for release builds
Package Identifier: com.dankehidayat.flowpoint

Notification System

Alert Configuration

Configurable temperature threshold monitoring
Energy consumption limit alerts
Real-time notification delivery for critical events
User-configurable alert preferences and thresholds

Smart Recommendations

Fuzzy inference system for intelligent system suggestions
Context-aware monitoring recommendations
Adaptive threshold adjustment based on usage patterns

Contributing

We welcome contributions from the developer community. Please review our contribution guidelines before submitting changes.

Development Process

Fork the repository
Create a feature branch (git checkout -b feature/feature-name)
Commit your changes (git commit -m 'Add feature description')
Push to the branch (git push origin feature/feature-name)
Open a Pull Request for review

License

This project is licensed under the MIT License. Refer to the LICENSE file for complete terms and conditions.

Acknowledgments

Blynk IoT Platform - IoT infrastructure and sensor integration
Flutter Framework - Cross-platform application development
FL Chart Library - Data visualization components
Material Design - User interface design guidelines
Phosphor Icons - Iconography system

Future Development

Advanced data export and reporting capabilities
Predictive analytics and machine learning integration
Multi-device and multi-location monitoring support
Enhanced custom alert and notification system
Comprehensive historical data analysis tools
Energy cost calculation and optimization features

Developed by Danke Hidayat

Advanced IoT monitoring solutions for energy efficiency and environmental management

Name		Name	Last commit message	Last commit date
android		android
assets		assets
ios		ios
lib		lib
linux		linux
macos		macos
web		web
windows		windows
.gitignore		.gitignore
LICENSE		LICENSE
README.md		README.md
analysis_options.yaml		analysis_options.yaml
pubspec.lock		pubspec.lock
pubspec.yaml		pubspec.yaml

Latest commit

History

Folders and files

Repository files navigation