Moon/App templates/AI app builder projects screen

AI app builder projects screen template

A projects screen for AI app builders on iOS and Android, with counts for all, live, drafts, and shared, then project cards carrying a thumbnail, address, and edit time. Use it for vibe coding tools, AI website builders, and developer dashboards. Build it with Bolt, Lovable, or Replit.

About this app template

Once someone has built a few things the list becomes the product, so this screen leads with counts that double as filters and gives each project a thumbnail of its own front page. Live and draft are separated because they are answered differently, one is a thing to share and the other is a thing to finish, and the edit time runs under each card because the most likely project to open is the one touched last. The address appears only on projects that have one, which is what makes live mean something. Paste it into Bolt, Lovable, or Replit and read your project list into it.

Build a full mobile app with this template design

A mobile app is many screens a user moves between quickly, which makes any inconsistency obvious, so one screen can set the standard for every screen after it. Copy the template, paste it into Claude Code, Replit, Lovable, ChatGPT Codex, Bolt, or Cursor, and send this alongside it.

Paste into Claude Code, Replit, Lovable, Bolt, or Cursor

Common questions about this template

How should builder projects be sorted?

By last edited. The project someone is coming back to is nearly always the one they just left.

Why separate live projects from drafts?

Because they lead to different actions. A live project gets shared, a draft gets finished, and mixing them makes both lists harder to scan.

Should project cards show a thumbnail?

Yes, of the project's own first screen. Names blur together after a handful of builds and the picture is what people actually recognize.

How do I connect this to real projects?

Paste it into Bolt, Lovable, or Replit and ask your AI to read your project records, count them by status, and render a thumbnail from each deployment.

Use this template for

  • ·Project lists in AI builder apps
  • ·Live and draft filtering
  • ·Developer project dashboards
  • ·Any tool managing several builds

Works with every vibe coding tool