|
1 | | -# ISAC — Intelligent Site Analysis & Cloning CLI |
| 1 | +# ISAC — Intelligent Site Analysis & Cloning |
2 | 2 |
|
3 | | -ISAC captures screenshots from a URL, extracts the design system, detects animations, plans the page structure, implements a pixel-perfect Next.js replica, and visually verifies the result — all powered by Claude Code. |
| 3 | +ISAC captures screenshots from a URL, extracts the design system, detects animations, plans the page structure, implements a pixel-perfect replica, and visually verifies the result — all powered by Claude Code. |
| 4 | + |
| 5 | +## Packages |
| 6 | + |
| 7 | +| Package | Version | Description | |
| 8 | +|---|---|---| |
| 9 | +| [`@guataiba/isac-cli`](https://www.npmjs.com/package/@guataiba/isac-cli) | [](https://www.npmjs.com/package/@guataiba/isac-cli) | CLI tool (`isac capture <url>`) | |
| 10 | +| [`@guataiba/isac-core`](https://www.npmjs.com/package/@guataiba/isac-core) | [](https://www.npmjs.com/package/@guataiba/isac-core) | Framework-agnostic pipeline engine | |
| 11 | +| [`@guataiba/isac-nextjs`](https://www.npmjs.com/package/@guataiba/isac-nextjs) | [](https://www.npmjs.com/package/@guataiba/isac-nextjs) | Next.js (App Router) adapter | |
4 | 12 |
|
5 | 13 | ## Prerequisites |
6 | 14 |
|
@@ -57,15 +65,26 @@ isac capture <url> |
57 | 65 | 6. **Phase 3** — Implementation |
58 | 66 | 7. **Phase 4** — Visual verification (with correction loop) |
59 | 67 |
|
| 68 | +## Architecture |
| 69 | + |
| 70 | +``` |
| 71 | +packages/ |
| 72 | + core/ → Pipeline engine, prompts, templates (framework-agnostic) |
| 73 | + nextjs/ → Next.js App Router adapter (prompts, templates, file structure) |
| 74 | + cli/ → CLI entry point, bundles core + nextjs |
| 75 | +examples/ |
| 76 | + claude-on-mars/ → Complete capture example |
| 77 | +``` |
| 78 | + |
60 | 79 | ## Example output |
61 | 80 |
|
62 | | -See `examples/claude-on-mars/` for a complete capture example. |
| 81 | +See [`examples/claude-on-mars/`](examples/claude-on-mars/) for a complete capture example. |
63 | 82 |
|
64 | 83 | ## Roadmap |
65 | 84 |
|
66 | | -- **Multipackage architecture** — Modular rendering engine based on `json-render`, enabling support for multiple frameworks beyond Next.js |
67 | | -- **Copy HEX on design system page** — Add a click-to-copy button for hex color codes on the generated design system page |
| 85 | +- **Copy HEX on design system page** — Click-to-copy for hex color codes on the generated design system page |
68 | 86 | - **Brand logo extraction** — Automatically detect and download the brand's logo from the target URL |
| 87 | +- **More framework adapters** — Astro, Remix, SvelteKit, and others |
69 | 88 | - **CLI command evolution** — Evolve CLI commands (e.g. `brand-detector`, framework-specific generators) as the tool matures |
70 | 89 |
|
71 | 90 | ## License |
|
0 commit comments