Why AI Starts Breaking Your App: The "Overcrowded Drawing" Trap
"Good morning Malaysia & Vietnam, and good afternoon to our colleagues in Australia! Welcome back Cohort 2 to Bi-Weekly Sync #2!
In Sync #1 two weeks ago (21 October), we drove our first Test Pile using the 3-Peg Blueprint. Since then, many of you got your first prototype working—and then asked Antigravity for 'just one more button or filter'... and suddenly half your table vanished or the buttons stopped clicking!
You didn't break it, and the AI isn't broken. You hit the Overcrowded Drawing Trap. When your HTML layout, CSS styling, JavaScript logic, and data sit inside a single 600-line file, it's like printing architectural layout, high-voltage cables, water pipes, and HVAC ducts onto a single A4 sheet. Today, you step up as the AI Construction Foreman so your app grows without collapsing."
Context Overcrowding + Blind Overwrite: To edit 3 lines in a 600-line file, the AI tries to reprint the whole file and truncates or overwrites working functions.
"Type a 1 in the Google Meet chat if your AI accidentally deleted or broke an existing button when you asked it to add a new feature over the last two weeks!"
"How does Gamuda Digital IBS solve overcrowded site drawings? By separating prefab pods in the factory. Let's look at Slide 2."
The Gamuda IBS Prefab Method: Separate Look, Brains & Data
"At Gamuda IBS, we don't cast bathroom plumbing, living room walls, and electrical switchboards in one messy pile. We prefabricate separate pods.
Do the exact same thing with your app by splitting it into 3 clean zones:
• Pod 1 — The Look (index.html + styles.css): Buttons, cards, tables, and colors.
• Pod 2 — The Brains (app.js): Calculations, filtering, and AI API calls.
• Pod 3 — The Records (data.json / Storage): Sample rows, rate tables, and saved checklists.
When you want to change a button color, the AI only opens Pod 1—it physically cannot break your math in Pod 2!"
Refactor my single-file prototype into 3 clean IBS modules without changing any current features or visual styling: 1. index.html (UI layout & Tailwind classes only) 2. app.js (all functions, event listeners, and AI calls) 3. sample-data.js (all sample test rows and lookup rates) Verify all buttons still work identically after splitting.
Issuing a "Site Work Permit" (PTW) Before AI Edits Code
"On any Gamuda tunnel, rail, or township site, no subcontractor is allowed to hack a wall without a signed Permit to Work (PTW) that states the exact work zone and what must be barricaded.
Never tell Antigravity: 'Add a CSV export button and make the page look nicer.' That's giving a contractor a sledgehammer with no barricades!
Always issue a 3-Line Site Work Permit Prompt:
1️⃣ AUTHORIZED WORK ZONE: Name the exact function or section the AI is allowed to touch.
2️⃣ NO-GO BARRICADE (DO NOT TOUCH): Explicitly name the working functions and layout that must remain 100% untouched.
3️⃣ INSPECTION TEST: Tell the AI what must work when it finishes."
[PERMIT TO WORK — SCOPED EDIT] 1. AUTHORIZED WORK ZONE: Only add a "Export to CSV" button inside the #resultsHeader div and create a new exportResultsToCSV() function. 2. NO-GO BARRICADE (DO NOT TOUCH): Do NOT modify, rename, or remove analyzeClaim(), loadSampleData(), or any existing table columns and styles. 3. HANDOVER CHECK: Confirm all existing buttons still work and the exported CSV includes all 5 columns.
When the Screen Goes Blank: The 3-Step F12 Console Triage
"What happens when you click a button and nothing happens? If you tell the AI 'The button is not working, please fix it', the AI has its eyes closed—it will guess wildly and rewrite random code!
Instead, use the 15-Second F12 Console Triage:
1️⃣ Press F12 (or Right-Click → Inspect) in Chrome/Edge and click the Console tab.
2️⃣ Copy the exact red error line (which includes the exact line number, like app.js:142 Uncaught ReferenceError).
3️⃣ Paste that single red line to Antigravity and say: 'Fix only this error at line 142 without touching any other function.' It fixes it in 1 shot!"
Floor-by-Floor Handover: Save Working Checkpoints
"In high-rise construction, we inspect and sign off Floor 1 before pouring concrete for Floor 2.
Follow the Floor-by-Floor Handover Rhythm:
• Floor 1 (Core Input → Output): Get your 1 table or scorecard working → Save a backup copy (v1-working or Git commit).
• Floor 2 (Summary KPI Bar): Issue 1 PTW prompt to add top KPI counters → Test → Save checkpoint (v2-working).
• Floor 3 (CSV / PDF Export): Issue 1 PTW prompt for export → Test → Save checkpoint (v3-working).
If Floor 3 ever goes sideways, you never lose your building—you revert to Floor 2 in 5 seconds!"
3-Minute Peer Inspections & Action Before Sync #3 (Wed, 18 Nov)
"Let's open the floor for our 3-Minute Live Foreman Clinic! Who in Cohort 2 wants to share screen or paste a bug / feature request so we can issue a live Permit-to-Work prompt together?
Your Week 4 Action Item before Sync #3 on Wednesday, 18 November 2026 (09:00 – 10:00 MYT):
1️⃣ Use the Site Work Permit (PTW) Prompt to add 1 safe upgrade (like a CSV export button or KPI counter card) without breaking your core table.
2️⃣ Claim one of the 5 Peer Inspection Slots for Sync #3 (The 80% Trap & Edge-Case Testing) right on the DevForge portal!"