Compare commits

...
Author SHA1 Message Date
Amruth Pillai e74711e012 docs: add UI capture atlas and design brief 2026-09-24 23:05:24 +02:00
209 changed files with 338 additions and 0 deletions
@@ -0,0 +1,17 @@
# Claude Design prompt
You are redesigning Reactive Resume from first principles. Your goal is to create a coherent design system and rethink the entire application flow so that creating, improving, managing, and sharing a resume feels simple and natural.
Start with the [screenshot atlas](README.md). Read its descriptions and inspect its linked screenshots. Treat the current UI as evidence of product capabilities and user tasks, not as a design reference. Assume no design system or component library exists. You have complete creative freedom to replace the visual language, navigation, information architecture, screen boundaries, and interaction patterns. Preserve useful capabilities, but challenge every step a user must take.
Make decisions from the end user's point of view. Prioritize a clean, comfortable interface; clear hierarchy; minimal cognitive load; predictable behavior; excellent interaction design; and smooth, purposeful animation. Use progressive disclosure where it simplifies complex workflows. Design for accessibility, keyboard use, reduced motion, and desktop, tablet, and mobile.
Work in this order:
1. **Rethink the product flow.** Identify the main user goals and map the simplest path through each: creating or importing a resume, editing content, choosing a template, previewing/exporting/sharing, checking ATS readability, writing cover letters, tracking applications, using AI assistance, and managing settings. Propose a new information architecture and explain the few consequential decisions and tradeoffs. Identify capabilities or steps that should be combined, moved, or removed.
2. **Build the foundation.** Create one opinionated visual direction and a reviewable design system: typography, color, spacing, layout, surfaces, iconography, light and dark modes, responsive rules, accessibility standards, and motion principles. Build a component library covering navigation, forms, rich-text editing, cards, tables, dialogs, menus, feedback states, document previews, and other patterns the new flows require. Show component variants and interaction states, including empty, loading, error, and success states. Make this a usable design artifact or prototype, not only a written specification.
3. **Build screens one at a time.** First give me the proposed screen order. For each screen, create a reviewable design showing its purpose, primary action, desktop and mobile layouts (tablet where behavior differs), important interactions, transitions, and relevant states. Briefly explain how it improves the user's task and how it uses the new system. Then stop and wait for my approval or revisions before starting the next screen. Carry approved decisions forward consistently.
Do not reproduce the existing UI merely because it appears in the screenshots. Do not add decoration or animation without a user benefit. Choose a clear direction rather than presenting a collection of unrelated concepts. If the screenshot atlas is inaccessible, ask me for the files before drawing conclusions about current functionality.
Begin with the user-goal map, proposed information architecture, and your design direction. Then develop the design system and component library for review before building the first screen.
+321
View File
@@ -0,0 +1,321 @@
# Reactive Resume UI screenshot atlas
Captured 24 September 2026 from [rxresu.me](https://rxresu.me/) in logged-in browser. Most captures use dark theme; representative light-theme views are marked in filenames. Desktop viewport 1345 × 1044; tablet 768 × 1024; mobile 390 × 844. Some full-page images extend vertically.
**206 screenshots.** Each linked path below is relative to this README. Images are JPEG; file extensions match actual encoding.
Design handoff: [Claude Design prompt](CLAUDE_DESIGN_PROMPT.md).
## Table of contents
- [Landing · desktop](#landing-desktop)
- [Landing · tablet](#landing-tablet)
- [Landing · mobile](#landing-mobile)
- [Application · desktop](#application-desktop)
- [Application · tablet](#application-tablet)
- [Application · mobile](#application-mobile)
- [Builder · desktop content](#builder-desktop-content)
- [Builder · desktop entry forms](#builder-desktop-entry-forms)
- [Builder · desktop design settings](#builder-desktop-design-settings)
- [Builder · desktop other states](#builder-desktop-other-states)
- [Builder · tablet](#builder-tablet)
- [Builder · mobile](#builder-mobile)
- [Capture notes and limits](#capture-notes-and-limits)
<a id="landing-desktop"></a>
## Landing · desktop
| Screenshot path | What it shows |
| --- | --- |
| [landing/desktop/all-languages.jpg](landing/desktop/all-languages.jpg) | Expanded language selector and translation choices. |
| [landing/desktop/ats-sample-read.jpg](landing/desktop/ats-sample-read.jpg) | Landing ATS demonstration after sample resume text has been read. |
| [landing/desktop/export-json.jpg](landing/desktop/export-json.jpg) | Landing export demo with JSON format selected and its preview. |
| [landing/desktop/export-markdown.jpg](landing/desktop/export-markdown.jpg) | Landing export demo with Markdown format selected and its preview. |
| [landing/desktop/export-pdf.jpg](landing/desktop/export-pdf.jpg) | Landing export demo with PDF format selected and its preview. |
| [landing/desktop/export-word.jpg](landing/desktop/export-word.jpg) | Landing export demo with Word format selected and its preview. |
| [landing/desktop/feature-ai-writing.jpg](landing/desktop/feature-ai-writing.jpg) | Landing feature showcase for AI writing. |
| [landing/desktop/feature-api-mcp.jpg](landing/desktop/feature-api-mcp.jpg) | Landing feature showcase for API and MCP. |
| [landing/desktop/feature-applications.jpg](landing/desktop/feature-applications.jpg) | Landing feature showcase for applications. |
| [landing/desktop/feature-sharing.jpg](landing/desktop/feature-sharing.jpg) | Landing feature showcase for sharing. |
| [landing/desktop/full-page.jpg](landing/desktop/full-page.jpg) | Entire landing page, from hero through feature sections and footer. |
| [landing/desktop/hero-azurill-template.jpg](landing/desktop/hero-azurill-template.jpg) | Hero carousel with Azurill resume template selected. |
| [landing/desktop/hero-spread-pages.jpg](landing/desktop/hero-spread-pages.jpg) | Hero carousel showing multi-page resume spread. |
| [landing/desktop/templates/azurill.jpg](landing/desktop/templates/azurill.jpg) | Landing template gallery with Azurill selected and live resume preview. |
| [landing/desktop/templates/bronzor.jpg](landing/desktop/templates/bronzor.jpg) | Landing template gallery with Bronzor selected and live resume preview. |
| [landing/desktop/templates/chikorita.jpg](landing/desktop/templates/chikorita.jpg) | Landing template gallery with Chikorita selected and live resume preview. |
| [landing/desktop/templates/ditgar.jpg](landing/desktop/templates/ditgar.jpg) | Landing template gallery with Ditgar selected and live resume preview. |
| [landing/desktop/templates/ditto.jpg](landing/desktop/templates/ditto.jpg) | Landing template gallery with Ditto selected and live resume preview. |
| [landing/desktop/templates/gengar.jpg](landing/desktop/templates/gengar.jpg) | Landing template gallery with Gengar selected and live resume preview. |
| [landing/desktop/templates/glalie.jpg](landing/desktop/templates/glalie.jpg) | Landing template gallery with Glalie selected and live resume preview. |
| [landing/desktop/templates/kakuna.jpg](landing/desktop/templates/kakuna.jpg) | Landing template gallery with Kakuna selected and live resume preview. |
| [landing/desktop/templates/lapras.jpg](landing/desktop/templates/lapras.jpg) | Landing template gallery with Lapras selected and live resume preview. |
| [landing/desktop/templates/leafish.jpg](landing/desktop/templates/leafish.jpg) | Landing template gallery with Leafish selected and live resume preview. |
| [landing/desktop/templates/meowth.jpg](landing/desktop/templates/meowth.jpg) | Landing template gallery with Meowth selected and live resume preview. |
| [landing/desktop/templates/onyx.jpg](landing/desktop/templates/onyx.jpg) | Landing template gallery with Onyx selected and live resume preview. |
| [landing/desktop/templates/pikachu.jpg](landing/desktop/templates/pikachu.jpg) | Landing template gallery with Pikachu selected and live resume preview. |
| [landing/desktop/templates/rhyhorn.jpg](landing/desktop/templates/rhyhorn.jpg) | Landing template gallery with Rhyhorn selected and live resume preview. |
| [landing/desktop/templates/scizor.jpg](landing/desktop/templates/scizor.jpg) | Landing template gallery with Scizor selected and live resume preview. |
<a id="landing-tablet"></a>
## Landing · tablet
| Screenshot path | What it shows |
| --- | --- |
| [landing/tablet/full-page.jpg](landing/tablet/full-page.jpg) | Entire landing page, from hero through feature sections and footer. |
<a id="landing-mobile"></a>
## Landing · mobile
| Screenshot path | What it shows |
| --- | --- |
| [landing/mobile/full-page.jpg](landing/mobile/full-page.jpg) | Entire landing page, from hero through feature sections and footer. |
<a id="application-desktop"></a>
## Application · desktop
| Screenshot path | What it shows |
| --- | --- |
| [app/desktop/agent-chat-response.jpg](app/desktop/agent-chat-response.jpg) | Agent reply listing resume section names. |
| [app/desktop/agent-chat-wide.jpg](app/desktop/agent-chat-wide.jpg) | Agent conversation after hiding resume preview. |
| [app/desktop/agent-model-menu.jpg](app/desktop/agent-model-menu.jpg) | Agent model choices. |
| [app/desktop/agent-new-thread.jpg](app/desktop/agent-new-thread.jpg) | New agent thread setup with model and resume selectors. |
| [app/desktop/agent-resume-menu.jpg](app/desktop/agent-resume-menu.jpg) | Agent resume choices. |
| [app/desktop/agent-thread-empty.jpg](app/desktop/agent-thread-empty.jpg) | Agent conversation before first message, suggested prompts, and resume preview. |
| [app/desktop/agents.jpg](app/desktop/agents.jpg) | Agent workspace and existing-thread list. |
| [app/desktop/api-key-create-dialog.jpg](app/desktop/api-key-create-dialog.jpg) | New API-key form. |
| [app/desktop/api-key-expiry-menu.jpg](app/desktop/api-key-expiry-menu.jpg) | API-key expiration choices. |
| [app/desktop/application-add-contact-dialog.jpg](app/desktop/application-add-contact-dialog.jpg) | Add-contact form inside application detail. |
| [app/desktop/application-add-dialog.jpg](app/desktop/application-add-dialog.jpg) | New job application form. |
| [app/desktop/application-add-job-description.jpg](app/desktop/application-add-job-description.jpg) | Job-description field in new application form. |
| [app/desktop/application-detail-lower.jpg](app/desktop/application-detail-lower.jpg) | Lower application detail fields and activity. |
| [app/desktop/application-detail.jpg](app/desktop/application-detail.jpg) | Application details, status, notes, and related records. |
| [app/desktop/application-stage-menu.jpg](app/desktop/application-stage-menu.jpg) | Pipeline stage selector for an application. |
| [app/desktop/applications-board-left.jpg](app/desktop/applications-board-left.jpg) | Kanban pipeline, left stages and their application cards. |
| [app/desktop/applications-board-right.jpg](app/desktop/applications-board-right.jpg) | Kanban pipeline, right stages and their application cards. |
| [app/desktop/applications-board-light.jpg](app/desktop/applications-board-light.jpg) | Application Kanban board in light theme. |
| [app/desktop/applications-insights.jpg](app/desktop/applications-insights.jpg) | Application pipeline insights and charts. |
| [app/desktop/applications-table.jpg](app/desktop/applications-table.jpg) | Application tracker table with rows and columns. |
| [app/desktop/ats-checker-ai-review.jpg](app/desktop/ats-checker-ai-review.jpg) | AI writing review of public sample PDF with suggestions and strengths. |
| [app/desktop/ats-checker-contact-details.jpg](app/desktop/ats-checker-contact-details.jpg) | Expanded ATS contact-detail checks. |
| [app/desktop/ats-checker-dates.jpg](app/desktop/ats-checker-dates.jpg) | Expanded ATS date checks. |
| [app/desktop/ats-checker-job-match.jpg](app/desktop/ats-checker-job-match.jpg) | Job-posting term match, missing terms, and covered terms. |
| [app/desktop/ats-checker-layout.jpg](app/desktop/ats-checker-layout.jpg) | Expanded ATS layout check details. |
| [app/desktop/ats-checker-readability.jpg](app/desktop/ats-checker-readability.jpg) | Expanded ATS readability check details. |
| [app/desktop/ats-checker-result-overview.jpg](app/desktop/ats-checker-result-overview.jpg) | ATS mechanical score summary for public Scizor PDF. |
| [app/desktop/ats-checker-result-light.jpg](app/desktop/ats-checker-result-light.jpg) | Public sample PDF ATS score in light theme. |
| [app/desktop/ats-checker-sections.jpg](app/desktop/ats-checker-sections.jpg) | Expanded ATS section-recognition details. |
| [app/desktop/ats-checker-writing.jpg](app/desktop/ats-checker-writing.jpg) | Expanded ATS writing panel and AI review entry point. |
| [app/desktop/ats-checker.jpg](app/desktop/ats-checker.jpg) | ATS checker before selecting PDF, including instructions and upload control. |
| [app/desktop/ats-checker-light.jpg](app/desktop/ats-checker-light.jpg) | ATS checker upload screen in light theme. |
| [app/desktop/authentication-update-password-dialog.jpg](app/desktop/authentication-update-password-dialog.jpg) | Password update form. |
| [app/desktop/cover-letter-application-menu.jpg](app/desktop/cover-letter-application-menu.jpg) | Application choices for attaching cover-letter PDF. |
| [app/desktop/cover-letter-create-form.jpg](app/desktop/cover-letter-create-form.jpg) | Inline form for naming and creating a cover letter. |
| [app/desktop/cover-letter-delete-confirmation.jpg](app/desktop/cover-letter-delete-confirmation.jpg) | Cover-letter deletion confirmation; canceled afterward. |
| [app/desktop/cover-letter-editor-empty.jpg](app/desktop/cover-letter-editor-empty.jpg) | Cover-letter editor with empty recipient/content rich-text fields. |
| [app/desktop/cover-letter-editor-filled.jpg](app/desktop/cover-letter-editor-filled.jpg) | Cover-letter editor populated with generic sample text. |
| [app/desktop/cover-letter-pdf-preview-page.jpg](app/desktop/cover-letter-pdf-preview-page.jpg) | Rendered sample cover-letter PDF page. |
| [app/desktop/cover-letter-pdf-preview.jpg](app/desktop/cover-letter-pdf-preview.jpg) | Editor with PDF preview open below editing controls. |
| [app/desktop/cover-letter-sender-menu.jpg](app/desktop/cover-letter-sender-menu.jpg) | Resume choices for copying sender details. |
| [app/desktop/cover-letter-template-menu.jpg](app/desktop/cover-letter-template-menu.jpg) | Template choices for cover-letter PDF. |
| [app/desktop/cover-letters-with-letter.jpg](app/desktop/cover-letters-with-letter.jpg) | Library after temporary sample cover letter was created. |
| [app/desktop/cover-letters.jpg](app/desktop/cover-letters.jpg) | Cover-letter library empty state. |
| [app/desktop/integration-advanced-options.jpg](app/desktop/integration-advanced-options.jpg) | Advanced provider configuration fields. |
| [app/desktop/integration-edit-model-dialog.jpg](app/desktop/integration-edit-model-dialog.jpg) | Connected-provider model editing form. |
| [app/desktop/integration-provider-menu.jpg](app/desktop/integration-provider-menu.jpg) | AI provider selection menu. |
| [app/desktop/preferences-language-menu.jpg](app/desktop/preferences-language-menu.jpg) | Language selection menu. |
| [app/desktop/preferences-theme-menu.jpg](app/desktop/preferences-theme-menu.jpg) | Theme selection menu. |
| [app/desktop/resume-card-context-menu.jpg](app/desktop/resume-card-context-menu.jpg) | Actions available from a resume card. |
| [app/desktop/resume-create-dialog.jpg](app/desktop/resume-create-dialog.jpg) | New resume dialog with name and starting-point controls. |
| [app/desktop/resume-create-options.jpg](app/desktop/resume-create-options.jpg) | Creation choices for starting new resume. |
| [app/desktop/resume-create-unsaved-confirmation.jpg](app/desktop/resume-create-unsaved-confirmation.jpg) | Confirmation when closing unfinished resume creation. |
| [app/desktop/resume-delete-confirmation.jpg](app/desktop/resume-delete-confirmation.jpg) | Confirmation before deleting a resume; no deletion performed. |
| [app/desktop/resume-edit-details-dialog.jpg](app/desktop/resume-edit-details-dialog.jpg) | Edit resume name/details form. |
| [app/desktop/resume-import-dialog.jpg](app/desktop/resume-import-dialog.jpg) | Import resume form and supported import sources. |
| [app/desktop/resumes-compact.jpg](app/desktop/resumes-compact.jpg) | Resume library compact card layout. |
| [app/desktop/resumes-filter-menu.jpg](app/desktop/resumes-filter-menu.jpg) | Available resume filters. |
| [app/desktop/resumes-grid.jpg](app/desktop/resumes-grid.jpg) | Resume library grid with cards and document thumbnails. |
| [app/desktop/resumes-grid-light.jpg](app/desktop/resumes-grid-light.jpg) | Resume library grid and thumbnail cards in light theme. |
| [app/desktop/resumes-list.jpg](app/desktop/resumes-list.jpg) | Resume library list layout. |
| [app/desktop/resumes-sort-menu.jpg](app/desktop/resumes-sort-menu.jpg) | Available resume sort orders. |
| [app/desktop/settings-account.jpg](app/desktop/settings-account.jpg) | Account management and account deletion controls. |
| [app/desktop/settings-api-keys.jpg](app/desktop/settings-api-keys.jpg) | API-key list and management actions. |
| [app/desktop/settings-authentication.jpg](app/desktop/settings-authentication.jpg) | Password and authentication security settings. |
| [app/desktop/settings-integrations.jpg](app/desktop/settings-integrations.jpg) | AI provider setup and connected-provider status. |
| [app/desktop/settings-preferences.jpg](app/desktop/settings-preferences.jpg) | Appearance, language, and app preferences. |
| [app/desktop/settings-preferences-light.jpg](app/desktop/settings-preferences-light.jpg) | Preferences after switching to light theme. |
| [app/desktop/settings-profile.jpg](app/desktop/settings-profile.jpg) | Profile settings and identity fields. |
<a id="application-tablet"></a>
## Application · tablet
| Screenshot path | What it shows |
| --- | --- |
| [app/tablet/agent-chat-response.jpg](app/tablet/agent-chat-response.jpg) | Agent reply listing resume section names. |
| [app/tablet/agent-new-thread.jpg](app/tablet/agent-new-thread.jpg) | New agent thread setup with model and resume selectors. |
| [app/tablet/applications-board.jpg](app/tablet/applications-board.jpg) | Kanban pipeline at this viewport. |
| [app/tablet/ats-checker-result.jpg](app/tablet/ats-checker-result.jpg) | ATS score summary for public Scizor PDF at this viewport. |
| [app/tablet/ats-checker.jpg](app/tablet/ats-checker.jpg) | ATS checker before selecting PDF, including instructions and upload control. |
| [app/tablet/cover-letter-editor.jpg](app/tablet/cover-letter-editor.jpg) | Cover-letter editor with sample recipient/body text. |
| [app/tablet/cover-letters-with-letter.jpg](app/tablet/cover-letters-with-letter.jpg) | Library after temporary sample cover letter was created. |
| [app/tablet/cover-letters.jpg](app/tablet/cover-letters.jpg) | Cover-letter library empty state. |
| [app/tablet/resumes-grid.jpg](app/tablet/resumes-grid.jpg) | Resume library grid with cards and document thumbnails. |
| [app/tablet/settings-account.jpg](app/tablet/settings-account.jpg) | Account management and account deletion controls. |
| [app/tablet/settings-api-keys.jpg](app/tablet/settings-api-keys.jpg) | API-key list and management actions. |
| [app/tablet/settings-authentication.jpg](app/tablet/settings-authentication.jpg) | Password and authentication security settings. |
| [app/tablet/settings-integrations.jpg](app/tablet/settings-integrations.jpg) | AI provider setup and connected-provider status. |
| [app/tablet/settings-preferences.jpg](app/tablet/settings-preferences.jpg) | Appearance, language, and app preferences. |
| [app/tablet/settings-profile.jpg](app/tablet/settings-profile.jpg) | Profile settings and identity fields. |
<a id="application-mobile"></a>
## Application · mobile
| Screenshot path | What it shows |
| --- | --- |
| [app/mobile/agent-chat-response.jpg](app/mobile/agent-chat-response.jpg) | Agent reply listing resume section names. |
| [app/mobile/agent-new-thread.jpg](app/mobile/agent-new-thread.jpg) | New agent thread setup with model and resume selectors. |
| [app/mobile/agent-resume-preview.jpg](app/mobile/agent-resume-preview.jpg) | Mobile Resume tab for agent conversation. |
| [app/mobile/agent-thread-list.jpg](app/mobile/agent-thread-list.jpg) | Mobile Threads tab listing saved conversation. |
| [app/mobile/application-add-dialog-lower.jpg](app/mobile/application-add-dialog-lower.jpg) | Lower fields/actions of new application form. |
| [app/mobile/application-add-dialog-top.jpg](app/mobile/application-add-dialog-top.jpg) | Upper fields of new application form. |
| [app/mobile/application-detail-lower.jpg](app/mobile/application-detail-lower.jpg) | Lower application detail fields and activity. |
| [app/mobile/application-detail-top.jpg](app/mobile/application-detail-top.jpg) | Upper application detail fields. |
| [app/mobile/applications-board.jpg](app/mobile/applications-board.jpg) | Kanban pipeline at this viewport. |
| [app/mobile/applications-insights.jpg](app/mobile/applications-insights.jpg) | Application pipeline insights and charts. |
| [app/mobile/applications-table.jpg](app/mobile/applications-table.jpg) | Application tracker table with rows and columns. |
| [app/mobile/ats-checker-result.jpg](app/mobile/ats-checker-result.jpg) | ATS score summary for public Scizor PDF at this viewport. |
| [app/mobile/ats-checker.jpg](app/mobile/ats-checker.jpg) | ATS checker before selecting PDF, including instructions and upload control. |
| [app/mobile/cover-letter-create-form.jpg](app/mobile/cover-letter-create-form.jpg) | Inline form for naming and creating a cover letter. |
| [app/mobile/cover-letter-editor-actions-preview.jpg](app/mobile/cover-letter-editor-actions-preview.jpg) | Mobile lower editor: preview, export, template, sender, and application controls. |
| [app/mobile/cover-letter-editor.jpg](app/mobile/cover-letter-editor.jpg) | Cover-letter editor with sample recipient/body text. |
| [app/mobile/cover-letters-with-letter.jpg](app/mobile/cover-letters-with-letter.jpg) | Library after temporary sample cover letter was created. |
| [app/mobile/cover-letters.jpg](app/mobile/cover-letters.jpg) | Cover-letter library empty state. |
| [app/mobile/navigation-drawer.jpg](app/mobile/navigation-drawer.jpg) | Mobile dashboard navigation drawer and settings links. |
| [app/mobile/resume-create-dialog.jpg](app/mobile/resume-create-dialog.jpg) | New resume dialog with name and starting-point controls. |
| [app/mobile/resumes-grid.jpg](app/mobile/resumes-grid.jpg) | Resume library grid with cards and document thumbnails. |
| [app/mobile/resumes-grid-light.jpg](app/mobile/resumes-grid-light.jpg) | Mobile resume grid in light theme. |
| [app/mobile/settings-account.jpg](app/mobile/settings-account.jpg) | Account management and account deletion controls. |
| [app/mobile/settings-api-keys.jpg](app/mobile/settings-api-keys.jpg) | API-key list and management actions. |
| [app/mobile/settings-authentication.jpg](app/mobile/settings-authentication.jpg) | Password and authentication security settings. |
| [app/mobile/settings-integrations.jpg](app/mobile/settings-integrations.jpg) | AI provider setup and connected-provider status. |
| [app/mobile/settings-preferences.jpg](app/mobile/settings-preferences.jpg) | Appearance, language, and app preferences. |
| [app/mobile/settings-profile.jpg](app/mobile/settings-profile.jpg) | Profile settings and identity fields. |
<a id="builder-desktop-content"></a>
## Builder · desktop content
| Screenshot path | What it shows |
| --- | --- |
| [builder/desktop/content/awards.jpg](builder/desktop/content/awards.jpg) | Awards content section with existing data and editing controls. |
| [builder/desktop/content/basics.jpg](builder/desktop/content/basics.jpg) | Basics content section with existing data and editing controls. |
| [builder/desktop/content/certifications.jpg](builder/desktop/content/certifications.jpg) | Certifications content section with existing data and editing controls. |
| [builder/desktop/content/custom-sections.jpg](builder/desktop/content/custom-sections.jpg) | Custom Sections content section with existing data and editing controls. |
| [builder/desktop/content/education.jpg](builder/desktop/content/education.jpg) | Education content section with existing data and editing controls. |
| [builder/desktop/content/experience.jpg](builder/desktop/content/experience.jpg) | Experience content section with existing data and editing controls. |
| [builder/desktop/content/interests.jpg](builder/desktop/content/interests.jpg) | Interests content section with existing data and editing controls. |
| [builder/desktop/content/languages.jpg](builder/desktop/content/languages.jpg) | Languages content section with existing data and editing controls. |
| [builder/desktop/content/picture.jpg](builder/desktop/content/picture.jpg) | Picture content section with existing data and editing controls. |
| [builder/desktop/content/profiles.jpg](builder/desktop/content/profiles.jpg) | Profiles content section with existing data and editing controls. |
| [builder/desktop/content/projects.jpg](builder/desktop/content/projects.jpg) | Projects content section with existing data and editing controls. |
| [builder/desktop/content/publications.jpg](builder/desktop/content/publications.jpg) | Publications content section with existing data and editing controls. |
| [builder/desktop/content/references.jpg](builder/desktop/content/references.jpg) | References content section with existing data and editing controls. |
| [builder/desktop/content/skills.jpg](builder/desktop/content/skills.jpg) | Skills content section with existing data and editing controls. |
| [builder/desktop/content/summary.jpg](builder/desktop/content/summary.jpg) | Summary content section with existing data and editing controls. |
| [builder/desktop/content/volunteer.jpg](builder/desktop/content/volunteer.jpg) | Volunteer content section with existing data and editing controls. |
<a id="builder-desktop-entry-forms"></a>
## Builder · desktop entry forms
| Screenshot path | What it shows |
| --- | --- |
| [builder/desktop/forms/add-award.jpg](builder/desktop/forms/add-award.jpg) | Add Award dialog with fields for a new resume entry. |
| [builder/desktop/forms/add-certification.jpg](builder/desktop/forms/add-certification.jpg) | Add Certification dialog with fields for a new resume entry. |
| [builder/desktop/forms/add-custom-section.jpg](builder/desktop/forms/add-custom-section.jpg) | Add Custom Section dialog with fields for a new resume entry. |
| [builder/desktop/forms/add-education.jpg](builder/desktop/forms/add-education.jpg) | Add Education dialog with fields for a new resume entry. |
| [builder/desktop/forms/add-experience-role-progression.jpg](builder/desktop/forms/add-experience-role-progression.jpg) | Add Experience Role Progression dialog with fields for a new resume entry. |
| [builder/desktop/forms/add-experience.jpg](builder/desktop/forms/add-experience.jpg) | Add Experience dialog with fields for a new resume entry. |
| [builder/desktop/forms/add-interest.jpg](builder/desktop/forms/add-interest.jpg) | Add Interest dialog with fields for a new resume entry. |
| [builder/desktop/forms/add-language.jpg](builder/desktop/forms/add-language.jpg) | Add Language dialog with fields for a new resume entry. |
| [builder/desktop/forms/add-profile.jpg](builder/desktop/forms/add-profile.jpg) | Add Profile dialog with fields for a new resume entry. |
| [builder/desktop/forms/add-project.jpg](builder/desktop/forms/add-project.jpg) | Add Project dialog with fields for a new resume entry. |
| [builder/desktop/forms/add-publication.jpg](builder/desktop/forms/add-publication.jpg) | Add Publication dialog with fields for a new resume entry. |
| [builder/desktop/forms/add-reference.jpg](builder/desktop/forms/add-reference.jpg) | Add Reference dialog with fields for a new resume entry. |
| [builder/desktop/forms/add-skill.jpg](builder/desktop/forms/add-skill.jpg) | Add Skill dialog with fields for a new resume entry. |
| [builder/desktop/forms/add-volunteer-experience.jpg](builder/desktop/forms/add-volunteer-experience.jpg) | Add Volunteer Experience dialog with fields for a new resume entry. |
<a id="builder-desktop-design-settings"></a>
## Builder · desktop design settings
| Screenshot path | What it shows |
| --- | --- |
| [builder/desktop/settings/ats-check.jpg](builder/desktop/settings/ats-check.jpg) | Ats Check design/settings section and its controls. |
| [builder/desktop/settings/custom-styles.jpg](builder/desktop/settings/custom-styles.jpg) | Custom Styles design/settings section and its controls. |
| [builder/desktop/settings/design.jpg](builder/desktop/settings/design.jpg) | Design design/settings section and its controls. |
| [builder/desktop/settings/export.jpg](builder/desktop/settings/export.jpg) | Export design/settings section and its controls. |
| [builder/desktop/settings/information.jpg](builder/desktop/settings/information.jpg) | Information design/settings section and its controls. |
| [builder/desktop/settings/layout.jpg](builder/desktop/settings/layout.jpg) | Layout design/settings section and its controls. |
| [builder/desktop/settings/notes.jpg](builder/desktop/settings/notes.jpg) | Notes design/settings section and its controls. |
| [builder/desktop/settings/page.jpg](builder/desktop/settings/page.jpg) | Page design/settings section and its controls. |
| [builder/desktop/settings/sharing.jpg](builder/desktop/settings/sharing.jpg) | Sharing design/settings section and its controls. |
| [builder/desktop/settings/statistics.jpg](builder/desktop/settings/statistics.jpg) | Statistics design/settings section and its controls. |
| [builder/desktop/settings/template.jpg](builder/desktop/settings/template.jpg) | Template design/settings section and its controls. |
| [builder/desktop/settings/typography.jpg](builder/desktop/settings/typography.jpg) | Typography design/settings section and its controls. |
<a id="builder-desktop-other-states"></a>
## Builder · desktop other states
| Screenshot path | What it shows |
| --- | --- |
| [builder/desktop/ai-assistant.jpg](builder/desktop/ai-assistant.jpg) | Resume builder AI assistant pane. |
| [builder/desktop/ats-deep-check.jpg](builder/desktop/ats-deep-check.jpg) | Builder ATS section after deeper check. |
| [builder/desktop/command-palette.jpg](builder/desktop/command-palette.jpg) | Searchable builder command palette. |
| [builder/desktop/menus/ai-thread-actions.jpg](builder/desktop/menus/ai-thread-actions.jpg) | AI conversation actions in builder. |
| [builder/desktop/menus/download-options.jpg](builder/desktop/menus/download-options.jpg) | Builder download/export format choices. |
| [builder/desktop/menus/layout-move-section.jpg](builder/desktop/menus/layout-move-section.jpg) | Layout-section action menu. |
| [builder/desktop/menus/layout-move-to.jpg](builder/desktop/menus/layout-move-to.jpg) | Destination choices for moving layout section. |
| [builder/desktop/menus/resume-options.jpg](builder/desktop/menus/resume-options.jpg) | Builder resume options. |
| [builder/desktop/menus/typography-font-family.jpg](builder/desktop/menus/typography-font-family.jpg) | Font-family choices in typography settings. |
| [builder/desktop/menus/version-history.jpg](builder/desktop/menus/version-history.jpg) | Builder version history and restore controls. |
| [builder/desktop/overview.jpg](builder/desktop/overview.jpg) | Builder shell and live resume preview. |
| [builder/desktop/overview-light.jpg](builder/desktop/overview-light.jpg) | Desktop builder with editing panel and preview in light theme. |
| [builder/desktop/template-picker-lower.jpg](builder/desktop/template-picker-lower.jpg) | Lower portion of resume template picker. |
| [builder/desktop/template-picker.jpg](builder/desktop/template-picker.jpg) | Upper portion of resume template picker. |
<a id="builder-tablet"></a>
## Builder · tablet
| Screenshot path | What it shows |
| --- | --- |
| [builder/tablet/content-preview.jpg](builder/tablet/content-preview.jpg) | Tablet builder with content sidebar and document preview. |
| [builder/tablet/content-sidebar.jpg](builder/tablet/content-sidebar.jpg) | Tablet builder with content and design sidebars open. |
| [builder/tablet/design.jpg](builder/tablet/design.jpg) | Builder design panel with template and layout controls. |
<a id="builder-mobile"></a>
## Builder · mobile
| Screenshot path | What it shows |
| --- | --- |
| [builder/mobile/add-experience-form.jpg](builder/mobile/add-experience-form.jpg) | Mobile experience-entry form with fields and actions. |
| [builder/mobile/content-editor.jpg](builder/mobile/content-editor.jpg) | Mobile Edit tab with picture and basics fields. |
| [builder/mobile/edit-light.jpg](builder/mobile/edit-light.jpg) | Mobile builder Edit tab in light theme. |
| [builder/mobile/design.jpg](builder/mobile/design.jpg) | Builder design panel with template and layout controls. |
| [builder/mobile/preview.jpg](builder/mobile/preview.jpg) | Mobile Preview tab with document canvas and zoom controls. |
## Capture notes and limits
- **Private data:** Screenshots contain real account resume, application, profile, and email data. Review before sharing outside trusted agents. Password and API-key values are not shown.
- **Created for capture:** “UI capture (temporary)” cover letter remains in library with generic sample copy. Agent thread asking for resume section names also remains. Existing resumes/applications were not deleted.
- **ATS fixture:** [Public Scizor template PDF](fixtures/scizor-public-template.pdf) was selected in ATS Checker. Score panels, job-description term matching, and AI writing review were captured.
- **Unavailable routes:** Logged-in session redirected login/register screens. Job-search settings route redirected to Integrations. These screens are absent from atlas.
- **Scrolling:** Builder preview and application board contain independently scrollable panes. Related upper/lower and left/right captures document them.
Binary file not shown.

After

Width:  |  Height:  |  Size: 102 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 52 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 30 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 28 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 34 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 90 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 36 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 38 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 49 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 64 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 66 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 46 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 56 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 69 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 71 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 71 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 70 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 75 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 128 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 229 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 78 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 78 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 87 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 78 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 42 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 79 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 63 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 69 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 78 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 104 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 48 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 34 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 83 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 55 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 34 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 58 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 69 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 33 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 73 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 70 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 65 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 40 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 35 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 62 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 63 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 65 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 41 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 31 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 207 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 79 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 78 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 62 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 73 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 84 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 77 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 77 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 205 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 181 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 108 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 31 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 207 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 19 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 37 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 38 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 38 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 10 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 32 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 28 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 32 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 42 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 19 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 27 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 39 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 61 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 25 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 27 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 35 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 27 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 41 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 41 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 23 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 45 KiB

Some files were not shown because too many files have changed in this diff Show More