The Flutter Agent Kit

The Flutter Agent Kit is the AI-engineering delivery framework I built from 15+ years of mobile architecture and engineering experience in enterprise environments: a library of 100+ interdependent patterns — architecture, components, testing, UX and tooling — each with agent-readable guidance and ready-to-apply code templates, distilled from industry best practice and aligned with Google's official Flutter architecture guidance. Coding agents (Claude Code, Cursor) discover, sequence and apply these patterns autonomously, while I retain design authority and a hard quality gate — human-in-the-loop by design.

Flutter Agent Kit - interactive dependency graph of 100+ patterns across MVVM layers Click to explore the interactive dependency graph

Every node is a pattern; every edge a dependency, laid out across MVVM layers — the optimized index and dependency graph are how agents discover and sequence patterns. Open it, pan and zoom, filter by category, and trace how the architecture composes.

KIX Mobile App

The Challenge

Propellerfish wanted to take the KIX participant experience to the next level: a beautiful, polished and consistent UI, robust and stable, with improved and extended functionality — delivered on a short timeline, while consolidating the aging native iOS and Android apps into a single modern codebase.

The Solution

I delivered the app at pace with the Flutter Agent Kit — a step change in how software is built: the Figma design system and screens translated automatically into a Flutter UI inventory, backend connectivity derived from the agreed service contracts, the application structure scaffolded on the Kit's architecture blueprint, and the intellectual property proven in the existing apps carried over rather than rewritten.

The Impact

A production app in about four months — roughly 2–3× conventional pace — with 90%+ of code authored by AI agents under my architectural review (the most challenging 10% hand-crafted) and 100% business-logic test coverage enforced as a hard quality gate. Pixel-faithful to the design system, maximum reuse of proven intellectual property, and positive client feedback.

Application

KIX is Propellerfish's research participant app: people around the world take part in paid research studies by completing project tasks — answering questions and capturing real-life moments in audio, photo and video. The Flutter app replaces the legacy native iOS and Android apps with a single codebase covering these capabilities:

Adaptive UI across phone and tablet form factors
Friction-light onboarding — identity, permissions and consent
Research project forms — text, poll and multi-select questions
Media questions — audio, photo and video capture
Native bridge for in-app screen recording
Robust resiliency with detailed error feedback
Offline capability with detailed upload progress status
KIX App - Home Screen
KIX App - Project Questions
KIX App - Audio Recording
KIX App - Photo Capture
KIX App - Background Uploads
KIX App - Language Selector

Implementation

The Agent Kit is not a code generator bolted onto delivery — it is the SDLC. Every stage below was executed by agents working from Kit patterns, harnessed through pattern-compliance and anti-pattern checks, under architect supervision.

Comprehend

Legacy iOS and Android apps reverse-engineered into implementation briefs; Figma designs and backend contracts distilled into agent-readable inputs

Scaffold

5-layer monorepo, DI and build tooling generated from the Kit's architecture blueprint

Implement & Test

Agents author features and 100% of unit tests from 100+ patterns and 500+ templates

Quality Gate

Definition of Done on every change: format, zero-warning analysis, full test suite, architect review

Release & Learn

Automated store builds and Sentry monitoring; patterns refined on KIX harvested back into the Kit

Design System

Every screen and component was translated from the Figma design system into a browsable in-app UI inventory — the pixel-fidelity bridge between design and code, and the living reference agents build against.

View UI Inventory UI Inventory - Foundations UI Inventory - Components UI Inventory - Text Fields

Architecture

The entire layering, dependency injection and testing strategy was scaffolded from Agent Kit patterns rather than designed from scratch — proven structure, applied in days instead of weeks. The result is a robust layered architecture (M-V-VM pattern, per Google's official guidance) with strict separation of concerns, ensuring testability, maintainability, and scalability.

1

App Layer

Platform binaries and dependency injection container

kix_app
2

View Layer

UI components, pages, widgets, and graphical assets

view
3

ViewModel Layer

BLoC/Cubit-based state management exposing model to views

view_model
4

Model Layer

Business logic, API integrations, and third-party framework interactions

model
5

Abstracts Layer

Interface definitions connecting all layers through dependency injection

abstracts

Technology Stack

AI Engineering

Flutter Agent Kit Claude Code Cursor Agent Skills MCP Agent Orchestration Context Engineering Custom Linters

Architecture

Flutter Agent Kit Layered MVVM BLoC Pattern Cubit flutter_bloc Dependency Injection (GetIt) Repository Pattern SOLID Clean Code DRY Reactive Streams (Observable) Immutable Entities & DTOs Failure-Based Error Handling Adapter & Factory Patterns Type-Safe Navigation

Design

Figma Figma MCP Import Design Tokens Design System UI Inventory Pixel-Fidelity Review

Build & Tooling

Flutter 3.x Dart VS Code GitHub GitHub Actions Make Scripts build_runner json_serializable Swagger API Codegen intl / ARB

Testing & Monitoring

flutter_test bloc_test mockito UI Tests Integration Tests BDD Driver App Logger Agent Bridge On-Device Screenshots Sentry Google Analytics

Platforms & Release

iOS Android App Store / TestFlight Google Play Automated Store Builds 37-Language Localization

Outcome

Legacy Replacement

Replaced legacy native iOS and Android apps with a unified Flutter codebase at full feature parity

AI-Authored Code

90%+ of production code written by agents under architectural supervision — the most challenging 10% hand-crafted

AI-Authored Tests

100% of unit-test code written by agents — 2,043 tests, every business rule covered

Delivery Velocity

A production app in about four months — roughly 2–3× conventional pace, from first commit to users' hands

Full Automation

Build, code generation, testing and release automated end to end — localized into 37 languages via AI-assisted translation

Compounding Library

Patterns refined on KIX flowed back into the Kit — every engagement makes the next one faster

Code Quality, Measured

A full-codebase quality assessment (June 2026) scored the delivered code 9.5/10 — every in-scope quality axis flawless.

All eight quality axes scored 10/10 — layering, state management, error handling, resources, tests, code quality, DI, logging
Zero cross-layer imports — M-V-VM boundaries proven in code, not just on the diagram
Failures handled by design — the app degrades gracefully instead of crashing
Zero resource leaks — enforced by lint rules, not review vigilance
Business-logic test coverage 98–100% per layer — real scenario tests, none of the 2,043 skipped
No hidden technical debt — every trade-off explicit, documented and priced in

What the Kit Means for Your Project

The Flutter Agent Kit is what the SDLC looks like in 2026: an AI-orchestrated delivery process I bring to every engagement. KIX is the result of applying it to a real product — here is what that means for yours.

Speed That Shows Up as Cost

~One engineer, about four months, ~2–3× conventional velocity — compressed timelines that show up directly as lower delivery cost and earlier time-to-market. With more agents running in parallel, there is headroom to go faster still.

Quality Built In

100% of business logic covered by unit tests as a hard quality gate, with zero-warning static analysis on every change. Fewer defects in production — and far cheaper change later.

Productive From Day One

The Kit applies to any new project from day one: architecture, testing strategy and build tooling exist before the first sprint. You fund its application to your product, not its creation.

No Key-Person Risk

Every pattern is documented and machine-executable. Consistency is enforced by the library, not by memory — any competent team, human or AI, can pick up the codebase.

You Own Everything

You own your application code outright. The Kit is LLM-agnostic (Claude Code, Cursor) and leaves no proprietary runtime dependency in the shipped product — zero lock-in.

Inspectable Methodology

Nothing is a black box: the pattern library is mapped as an interactive dependency graph you can explore — see exactly how your app's architecture composes.

About the Role

As a Software Architect, I directed the technical strategy of the KIX replacement end to end:

  • Creator and maintainer of the Flutter Agent Kit — the pattern library, registry, agent skills and dependency tooling applied throughout this delivery
  • Author of the KIX architecture — the 5-layer M-V-VM monorepo — selecting and sequencing patterns from the Agent Kit library and industry-best patterns and components
  • Supervising and reviewing all agent-authored code, owning the Definition-of-Done quality gate
  • Defining the legacy reverse-engineering approach that drove feature-parity porting
  • Managing delivery and releases with the client's product team

As an AI-Engineer, I orchestrated the agents doing the heavy lifting:

  • Driving Claude Code and Cursor through the Kit's skills — develop, test, build and library workflows
  • Translating the Figma design system into app UI components and a browsable UI inventory, and generating the backend API client layer from the API contract
  • Reverse-engineering the legacy iOS and Android apps into implementation briefs
  • Building the delivery tooling: make targets, code generation and localization pipeline
  • Authoring agent-focused specifications and context engineering throughout the project