Volkano AI

Volkano AI is a sophisticated B2B SaaS platform that revolutionizes competitive advertising analysis for marketing teams and agencies. Built entirely in FlutterFlow, this enterprise-grade application transforms how businesses understand market dynamics by providing AI-powered insights into competitor ad strategies across Meta's Ad Library.

Year

2025

Service

App Development

Category

Advertisement

Tool

FlutterFlow, Flutter

Client Testimonial

Enterprise Ad Intelligence Platform | Meta Ad Library Analysis

An AI-powered competitor research platform that transforms hours of manual ad analysis into automated insights across 50+ dimensions. Built for marketing teams and agencies to make data-driven creative decisions at scale.

Competitor research- Overview- Summary- Desktop.png

The Challenge

Marketing teams were drowning in competitor research. Analyzing ads manually meant:

  • Hours spent reviewing competitor ads across multiple platforms

  • Missed patterns in winning creative elements and audience targeting

  • Scattered insights with no centralized system for tracking performance

  • Guesswork decisions without granular data on what actually works

  • No scalability when monitoring dozens of competitors simultaneously

Teams needed a way to transform Meta's vast Ad Library into actionable intelligence—automatically.

The Solution

Core Functionality

Competitor Research Dashboard (7 Analytical Modules)

Ad angle analysis in card view mode showing different advertising angles like "Boosts Immunity", "On-the-Go Snacking", "Shape & Color Fun" with categories and average days active metrics

Ad angle analysis in card view mode showing different advertising angles like "Boosts Immunity", "On-the-Go Snacking", "Shape & Color Fun" with categories and average days active metrics

User research dashboard showing personality assessment, ethnicity distribution, age range demographics, gender breakdown (60k total audience - 30% male, 70% female), profession categories, and emotion analysis

User research dashboard showing personality assessment, ethnicity distribution, age range demographics, gender breakdown (60k total audience - 30% male, 70% female), profession categories, and emotion analysis

Overview Section

  • Real-time summary dashboard with trend analysis

  • Audience insights: personality types, demographics, ethnicity, age, and gender

  • Ad angle categorization with combination analysis

  • Market sophistication tracking

  • Campaign theme identification

Ads Database

  • Infinite scroll through thousands of competitor ads

  • Advanced filtering: sophistication level, theme, media type, status, audio, speech, production style

  • Natural language search: "show me all ads using green screen"

  • Period-over-period comparison metrics

  • Viewport-optimized loading for smooth performance

Competitor research- Ad angle- ad list - Desktop.png

Video Analysis

  • Engagement duration metrics with peak period identification

  • Production style breakdown (graphics, selfie, professional, etc.)

  • Audio and script pattern analysis

  • Brand vs. competitor performance benchmarking

Hooks Analysis

  • Script template extraction for copy hooks

  • Visual hook identification (what drives retention)

  • Performance metrics by hook type

  • Engagement view counts

Image Intelligence

  • Text extraction and analysis from creative

  • Color gradient and palette identification

  • Visual category classification

  • Color performance correlation

Ad Copy Breakdown

  • Primary text template patterns

  • Headline structure analysis

  • Call-to-action categorization

  • Template taxonomy (features, benefits, testimonials, social proof)

Creative Audit

  • 90-day head-to-head brand comparison

  • Actionable recommendations: what to model vs. avoid

  • Performance insights: winning strategies vs. failing tactics

  • Competitive benchmarking

Competitor research- Ad angle category- Combination- Table mode - Desktop.png

Team Collaboration

  • Multi-workspace support for agencies managing multiple clients

  • Role-based access: Owner, Super Admin, Admin, Guest

  • Email invitations and onboarding flows

  • Subscription management via Charge Bee integration

Technical Architecture

Stack

  • Frontend: FlutterFlow (Flutter Web)

  • Database: Supabase

  • AI Engine: Gemini AI

  • Local Storage: Hive (IndexedDB-based NoSQL)

  • Payments: Charge Bee

  • Cloud Functions: Google Cloud Functions

AI-Powered Processing Pipeline

  1. Data Collection → Fetch ads from Meta Ad Library for selected brands and competitors

  2. AI Analysis → Gemini analyzes each creative across 50+ dimensions:

    • Visual elements, color schemes, text extraction

    • Video production styles, audio patterns, speech types

    • Hooks, engagement triggers, audience signals

    • Demographics and psychographic indicators

  3. Structured Storage → Comprehensive metrics stored in Supabase

  4. Local Caching → Partitioned data cached in Hive for instant browsing

Performance Optimizations

Memory-Efficient Infinite Scroll

The platform handles thousands of high-resolution ad creatives without browser crashes through:

  • Hive partitioned storage with indexed NoSQL structure

  • LRU caching (Least Recently Used) prevents memory overflow

  • Dynamic capacity detection adjusts loading based on browser memory

  • Viewport-only rendering loads only visible ads

  • Incremental partition loading for multi-competitor datasets

Intelligent Processing Prioritization

Custom action detects which section the user is viewing and prioritizes that data first, then processes remaining sections in parallel. Creates perception of instant loading while comprehensive analysis runs in background.

Atomic Design Architecture

  • 68 custom data types for strongly-typed hierarchy (no JSON string parsing)

  • 68 custom actions for data processing, filtering, state management

  • 48 custom functions for backend logic and API integrations

  • 20 custom widgets including custom bar graph (built to overcome Syncfusion limitations)

  • Modular component structure (atoms, molecules, organisms) reduces re-renders and improves load times

Architecture Diagram: Visual representation of the tech stack or data flow (FlutterFlow → Supabase → Gemini AI → Hive caching)

Architecture Diagram: Visual representation of the tech stack or data flow (FlutterFlow → Supabase → Gemini AI → Hive caching)

Production-Ready Payment Integration

Forked and modified Charge Bee package from pub.dev to handle web payment edge cases:

  • State management for success, failure, browser refresh, and popup cancellation

  • "Pay Now" recovery flow for failed payments

  • Zero transaction loss architecture

Key Automations

  • Real-time dashboard updates without refresh

  • Email notifications when brand analysis completes

  • Frontend snackbar system for processing status updates

  • Custom preloader for Flutter web initialization

Technical Highlights

Why These Challenges Mattered

AI Analysis at Scale

Gemini AI automates what would require hours of manual frame-by-frame video review, text extraction, and categorization. The platform processes hundreds of ads from multiple competitors simultaneously—delivering comprehensive insights in minutes instead of days.

Browser Memory Constraints

Displaying thousands of high-resolution video and image ads would crash traditional web applications. The custom infinite scroll with Hive partitioning and LRU caching makes it possible to browse 5,000+ ads seamlessly.

Perception vs. Reality

Users don't want to wait for complete data processing. Intelligent prioritization processes visible data first, updates the UI immediately, then handles background processing—making a 5-minute process feel instant.

Flutter Web Performance

Flutter web apps notoriously suffer from slow initial loads. Atomic design principles, custom preloader, and optimized component trees deliver enterprise-grade performance that rivals React applications.

Payment Edge Cases

Third-party payment packages don't account for real-world scenarios like browser refreshes during checkout or popup closures. Custom modifications ensure every transaction is tracked and no revenue is lost.

Results & Impact

Platform Capabilities

  • Analyzes 50+ dimensions per ad automatically

  • Processes thousands of ads from multiple competitors

  • Delivers insights in minutes vs. hours of manual analysis

  • Supports multi-workspace collaboration for agencies

  • Handles enterprise-scale datasets without browser crashes

Technical Achievement

  • 68 custom actions powering sophisticated data operations

  • 48 custom functions for backend logic and integrations

  • 20 custom widgets for specialized UI components

  • Responsive design optimized for desktop and tablet

  • Real-time synchronization across all dashboard modules

User Experience

  • Natural language search makes ad discovery intuitive

  • Infinite scroll loads thousands of ads without lag

  • Multi-dimensional filtering with instant results

  • Period comparison reveals performance trends

  • Granular insights from demographics to color psychology

Business Model

  • Subscription-based (Pro, Partner, Executive, Enterprise tiers)

  • Multi-workspace support for agency clients

  • Role-based access control

  • Automated billing via Charge Bee

Key Takeaways

For Marketing Teams:

  • AI automation delivers deeper insights than manual research while reducing time investment from hours to minutes

  • Granular data across 50+ dimensions enables precise creative optimization

  • Centralized competitor intelligence drives strategic advertising decisions

For Engineers:

  • Memory optimization is critical for web apps handling large media datasets—custom solutions beat generic approaches

  • Intelligent prioritization creates perceived performance improvements even with massive backend processing

  • Atomic design principles in FlutterFlow enable maintainable, enterprise-grade applications

  • Third-party packages may need custom modifications for production edge cases

  • Hive local storage with IndexedDB partitioning solves browser memory limitations at scale

For Product Teams:

  • Real-time feedback systems (snackbars, notifications, status updates) maintain user confidence during complex operations

  • Natural language interfaces lower barriers to advanced filtering and search

  • Multi-workspace architecture is essential for B2B SaaS serving agencies

Project Scope

Timeline: 2 months

Team: Built with FlutterFlow by Alfadesmeta

Client: Volkano AI

This case study demonstrates enterprise-grade development capabilities: AI integration, performance optimization for web constraints, atomic design architecture, and production-ready payment systems.