Breakdown: Code Builder → Mobile

Back to: [AI Code Builder — Project README](Research: AI Code Builder)
Legenda: Legenda Prioritas, Estimasi & Cycle

EPIC M1: AI Core Engine (Mobile)

Tujuan Epic: Membangun kemampuan AI mengenali screen/feature mobile dari screenshot, termasuk gaya platform (Android/iOS).
Research Question: Apakah classifier yang sama (shared dari Backend/Frontend) bisa di-reuse untuk mobile, atau butuh model terpisah karena perbedaan visual density UI mobile?

Chapter M1.1 — Feature Detection

Task M1.1.1 — Classifier screen/feature mobile

Description: Membangun model untuk mengenali jenis screen (Login, Dashboard, dll) dari screenshot aplikasi mobile.

Sub-task:

• Kumpulkan screenshot UI mobile (Auth, Dashboard, dll) dari berbagai app
• Label dataset per feature & per platform (Android/iOS style)
• Training classifier & evaluasi akurasi

Definition of Done:

• Dataset minimal 100 screenshot berlabel, proporsional Android/iOS
• Classifier F1-score ≥ 0.85 pada test set (lihat [Thresholds](Minimum Score / Threshold))
• Hasil evaluasi terdokumentasi dan direview
• Entry dicatat di [Experiment Log](Experiment Log Template) — termasuk apakah reuse shared classifier berhasil atau perlu model terpisah

Task M1.1.2 — Deteksi platform native vs cross-platform

Description: Menambahkan kemampuan deteksi gaya desain (Material Design vs Human Interface Guidelines).

Sub-task:

• Deteksi apakah UI mengikuti Material Design (Android) atau Human Interface (iOS)
• Tentukan rekomendasi target (Flutter/React Native/Native) berdasarkan hasil deteksi

Definition of Done:

• Sistem bisa memberi label "Android-style" / "iOS-style" / "neutral" dengan akurasi terukur
• Rekomendasi framework muncul sebagai output tambahan, tidak memblokir proses generate utama

Chapter M1.2 — Reference Code & Testing Result

Task M1.2.1 — Dataset reference code mobile

Description: Menyiapkan kumpulan kode Flutter/native untuk screen Login sebagai ground truth pembanding.

Sub-task:

• Kumpulkan contoh kode Login screen (Flutter widget, dll)
• Validasi manual reference code

Definition of Done:

• Minimal 10 reference code Login tervalidasi bisa di-build
• Anotasi lengkap (framework, versi, platform)

Task M1.2.2 — Testing harness mobile

Description: Membangun pipeline otomatis untuk menjalankan hasil generate di emulator/simulator, lalu mengambil screenshot hasil render untuk dibandingkan ke input asli.

Sub-task:

• Build pipeline emulator/simulator untuk run hasil generate
• Screenshot hasil render otomatis untuk dibandingkan ke input asli

Definition of Done:

• Pipeline berhasil menjalankan build di emulator tanpa intervensi manual
• Screenshot otomatis tersimpan dan siap dipakai untuk visual regression test

EPIC M2: UI Module (Mobile)

Tujuan Epic: Menggenerate komponen UI mobile nyata berdasarkan hasil deteksi Epic M1.

Chapter M2.1 — Login Screen

Task M2.1.1 — Generate komponen Login

Description: Menggenerate widget Login (input field, button, validasi dasar, state loading/error) berdasarkan screenshot yang di-drop.

Sub-task:

• Generate widget input field, button, validasi
• Generate state management dasar (loading, error)

Definition of Done:

• Hasil generate berhasil di-build dan tampil sesuai referensi visual (similarity ≥ threshold di [Thresholds](Minimum Score / Threshold))
• State loading & error berfungsi saat disimulasikan manual

Chapter M2.2 — Dashboard Screen

Task M2.2.1 — Generate komponen Dashboard

Description: Menggenerate layout Dashboard mobile (list/grid + navigasi) berdasarkan hasil deteksi struktur dari screenshot.

Sub-task:

• Generate layout list/grid sesuai deteksi
• Generate navigasi (bottom nav/drawer sesuai deteksi)

Definition of Done:

• Layout dan navigasi hasil generate berhasil di-build dan berfungsi

EPIC M3: Testing & Validation (Mobile)

Tujuan Epic: Memastikan hasil generate mobile bisa dibangun di kedua platform dan secara visual sesuai referensi.

Chapter M3.1 — Build/Run Test

Task M3.1.1 — Automated build Android

Description: Menyiapkan CI yang otomatis mem-build APK dari hasil kode generate.

Sub-task:

• Setup CI build APK dari hasil generate
• Capture error/log build gagal

Definition of Done:

• CI berhasil menghasilkan APK dari kode hasil generate tanpa intervensi manual
• Log error tersedia dan bisa ditelusuri jika build gagal

Task M3.1.2 — Automated build iOS

Description: Setara dengan Task M3.1.1 tapi untuk target iOS (simulator).

Sub-task:

• Setup CI build IPA/simulator dari hasil generate
• Capture error/log build gagal

Definition of Done:

• CI berhasil menghasilkan build iOS (simulator) dari kode hasil generate
• Log error tersedia dan bisa ditelusuri jika build gagal

Chapter M3.2 — Visual & Functional Test

Task M3.2.1 — Visual regression test

Description: Membandingkan screenshot hasil app di emulator dengan input asli untuk mengukur seberapa mirip hasil generate secara visual.

Sub-task:

• Screenshot hasil app di emulator vs input asli
• Scoring visual similarity

Definition of Done:

• Skor visual similarity otomatis dihasilkan per test run
• Skor tersimpan dan terhubung ke Dashboard metrik ([Metrics](Success Metrics))