OneQuery Blog Images

Create OneQuery blog thumbnails and article diagrams that match the existing landing-site image system.

Core Workflow

1. Inspect the target post under apps/landing/src/landing/blog/posts/ and the current image references.
2. Read references/onequery-blog-image-system.md before generating.
3. Use the built-in image_gen flow from the imagegen skill for generation.
4. Inspect the generated image with view_image before copying it into the repo.
5. Copy the selected generated image from $CODEX_HOME/generated_images/... into apps/landing/public/images/blog/.
6. Update the consuming post:
   • Thumbnail/social image: set imageSrc to /images/blog/<file>.png.
   • Section diagram: add imageSrc, imageAlt, imagePlacement, images, or inlineImages on the relevant section.
7. Validate references with rg, verify dimensions with file, and run bunx turbo typecheck --json --filter @onequery/landing after TypeScript changes.

Hard Rules

• Do not leave project-referenced images only under $CODEX_HOME/generated_images.
• Do not overwrite existing image assets unless the user asked to replace them.
• Keep thumbnail diagrams simple and centered with at least 1/5 canvas width empty on every edge.
• Avoid readable text in thumbnails. Use icons, arrows, dots, tiles, and abstract diagram components instead.
• For article diagrams, allow short uppercase module labels only when they improve clarity.
• Use assets/diagram-design-system.png as the visual reference. Do not use the old diagram-system-reference.png name.
• Do not use the filled app icon or OneQuery wordmark inside generated diagrams. Use the simplified line seal icon style when OneQuery is a diagram node.

Naming

• Thumbnail/social share image: <post-slug>-icon.png.
• In-article diagram: <post-slug>-<diagram-topic>.png.
• Keep paths under apps/landing/public/images/blog/.