docs(readme): add onboarding screenshots preview

- Add 4 screenshots showing interactive onboarding flow
- Collapsible gallery (2x2 grid) under one-liner command
- Images in assets/screenshots/ with descriptive names

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Florian BRUNIAUX 2026-01-15 09:34:31 +01:00
parent e4d00c7772
commit 30cbe57d1e
6 changed files with 18 additions and 2 deletions

View file

@ -38,7 +38,7 @@ tools/ # Interactive utilities
| File | Purpose |
|------|---------|
| `VERSION` | Single source of truth for version (currently 3.6.0) |
| `VERSION` | Single source of truth for version (currently 3.6.1) |
| `guide/ultimate-guide.md` | The main reference (search here first) |
| `guide/cheatsheet.md` | Quick reference for daily use |
| `machine-readable/reference.yaml` | LLM-optimized index with line numbers |

View file

@ -23,11 +23,27 @@
claude "Fetch and follow the onboarding instructions from: https://raw.githubusercontent.com/FlorianBruniaux/claude-code-ultimate-guide/main/tools/onboarding-prompt.md"
```
<details>
<summary>📸 <strong>Preview: Interactive Onboarding Flow</strong></summary>
<table>
<tr>
<td width="50%"><img src="./assets/screenshots/onboarding-01-language.png" alt="Language selection"/><br/><em>1. Choose your language</em></td>
<td width="50%"><img src="./assets/screenshots/onboarding-02-goal.png" alt="Goal selection"/><br/><em>2. Select your goal</em></td>
</tr>
<tr>
<td width="50%"><img src="./assets/screenshots/onboarding-03-level.png" alt="Level selection"/><br/><em>3. Pick your experience level</em></td>
<td width="50%"><img src="./assets/screenshots/onboarding-04-content.png" alt="Time selection"/><br/><em>4. Set available time</em></td>
</tr>
</table>
</details>
**Option B: From cloned repo**
1. Copy the prompt from [tools/onboarding-prompt.md](./tools/onboarding-prompt.md#4-the-prompt)
2. Run `claude` → Paste → Enter
Claude asks 2 questions (goal + level) then guides you through personalized content.
Claude asks 2-4 questions then guides you through personalized content based on your profile.
**Or browse directly:** [Cheat Sheet](./guide/cheatsheet.md) | [Quick Start](./guide/ultimate-guide.md#1-quick-start-day-1) | [Full Guide](./guide/ultimate-guide.md)

Binary file not shown.

After

Width:  |  Height:  |  Size: 76 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 101 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 81 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 94 KiB