跪拜 Guibai
← All articles
AI Coding · Client

App Atlas Maps Every Screen and Business Flow in a Mobile App Using AI Agents

By innepeace ·
Read original on juejin.cn ↗ Google Translate ↗ Alt translation

AI coding tools create a paradox: they accelerate feature delivery while eroding a team's mental model of the codebase. A static, AI-generated map that persists across sessions cuts token waste on repeated code scans and gives non-developers a self-service way to verify flows, reducing the interrupt burden on engineers.

Summary

Mobile teams inherit code they didn't write and burn tokens asking AI to re-scan the same files across sessions. App Atlas addresses both problems by having an AI agent read a project's source code once and output a static manifest of every screen: its UI structure, clickable hotspots, navigation targets, and business rules. The result is a browsable map with Mermaid flowcharts, trigger chains, and branch logic that product managers, testers, and new developers can inspect without touching the codebase. The tool runs entirely locally with zero build steps and no cloud upload, making it viable for security-sensitive environments like finance and healthcare. An open-source release ships with a demo simulating an IM app's Chat, Contacts, Discover, and Me modules, and the author reports internal use across 50+ modules and 180+ pages.

Takeaways
An AI agent reads iOS/Android source code once and produces a per-screen manifest (JSON) and business logic document (Markdown) that subsequent AI sessions can consume directly, avoiding repeated token burn.
The generated map shows UI hotspots as clickable regions: blue dashed boxes for single-target navigation, orange boxes for multi-branch interactions.
Each screen includes a Mermaid flowchart, trigger chains, and business rules visible in a side panel.
The tool requires no npm install, no build step, and no cloud upload — it runs as pure ES Modules served by a local Node.js script.
An online demo simulates four modules of an IM app (Chat, Contacts, Discover, Me) with desensitized data.
The author has used it internally to map 50+ modules and 180+ pages of a real production app.
Current limitations: native iOS/Android focus, no Web/Mini Program support, and weak handling of non-page flows like background tasks and push chains.
Conclusions

AI-assisted development creates a documentation debt that compounds with every generated line of code. A tool that extracts structure from source and freezes it as a static artifact is a practical hedge against that amnesia.

The decision to make the output plain JSON and Markdown rather than a database or API is deliberate: it keeps the artifact LLM-friendly and version-control-friendly, fitting into existing workflows without new infrastructure.

Self-serve business-logic maps shift QA and product questions away from developers, which matters more as teams shrink or go async. The map becomes a shared artifact that outlasts any single engineer's tenure on a module.

Concepts & terms
App Atlas
An open-source framework that uses an AI agent to scan a mobile app's source code and produce a static, interactive map of every screen's UI structure, navigation hotspots, and business logic.
Manifest (in App Atlas context)
A structured JSON file per screen that describes UI elements, clickable regions, and navigation targets, designed to be read directly by an LLM to avoid re-scanning source code.
Source: juejin.cn ↗ Google Translate ↗ Backup ↗