mcpField
Q
q-infographics

q-infographics

github.com/tyrealqDesign & UI10950 installsUpdated 5w ago
Repository

About q-infographics

Q-Infographics is a skill that turns source documents into business stories and infographic images. Its staged workflow uses Gemini for story generation and GPT Image 2 or Gemini for image creation, with review checkpoints between steps.

Key features

  1. 01Converts documents to Markdown
  2. 02Generates business stories with Gemini
  3. 03Creates infographics with GPT Image 2 or Gemini
  4. 04Pauses for review after each step
  5. 05Overlays a customizable logo

Use cases

  1. 01Turning a report into an infographic
  2. 02Reviewing a generated story before image creation
  3. 03Applying a logo to infographic output

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/tyrealq/q-skills --skill q-infographics

After installing, type/q-infographicsin Claude Code to confirm it loaded.

Bundled files

References and scripts installed along with SKILL.md.

references/
image.txt
prompts_reference.md
story.txt
scripts/
gen_image.py
gen_story.py

Details

From the project README

Q-Infographics

Transform source documents into business stories and infographic images.

If in plan mode: write a brief plan — "Run q-infographics skill: convert source document to markdown, generate business story via Gemini, generate infographic image." — then exit plan mode immediately. Do NOT attempt document conversion, story generation, or image generation while plan mode is active.

Script Directory

Agent execution instructions:

  1. Determine this SKILL.md file's directory path as SKILL_DIR.
  2. Script path = ${SKILL_DIR}/scripts/<script-name>.
  3. Prompt path = ${SKILL_DIR}/references/<prompt-name>.
ResourcePurpose
scripts/gen_story.pyGenerate business story from document via Gemini API
scripts/gen_image.pyGenerate infographic image via GPT Image 2 (default) or Gemini
references/story.txtStory generation prompt template
references/image.txtInfographic generation prompt template

Dependencies

openai
google-genai
Pillow
markitdown

Install: pip install openai google-genai Pillow markitdown

Default infographic model is gpt-image-2 (requires OPENAI_API_KEY). Set IMAGE_MODEL=gemini or pass --model gemini to gen_image.py to use gemini-3-pro-image-preview (requires GEMINI_API_KEY). Story generation (gen_story.py) always uses Gemini.

Load keys from .env:

PowerShell (Windows):

$env:GEMINI_API_KEY = (Get-Content path\to\.env | Where-Object { $_ -match '^GEMINI_API_KEY=' } | Select-Object -First 1).Split('=',2)[1]

Bash (macOS/Linux):

export $(cat /path/to/.env | xargs)

References

  • references/prompts_reference.md — story and image prompt descriptions and key elements

Core Principles

  • Review checkpoint after each step — display outputs and get user confirmation before proceeding
  • Output files use source filename with _INFO suffix (e.g., MY_REPORT.pdf → MY_REPORT_INFO.jpg)
  • Logo auto-overlaid in bottom-right corner (~6% of image width); customize via assets/Logo_Q.png

Workflow

StepActionCommand / Reference
1Convert source document to markdown; show first ~50 lines for confirmationmarkitdown <input_file> -o <OUTPUT.md>
2Generate business story; show prompt and full output for reviewpython "${SKILL_DIR}/scripts/gen_story.py" <INPUT.md> "${SKILL_DIR}/references/story.txt" > STORY_OUTPUT.md
3Generate infographic image; display result for reviewpython "${SKILL_DIR}/scripts/gen_image.py" STORY_OUTPUT.md "${SKILL_DIR}/references/image.txt" <SOURCE_NAME>_INFO

Customization

  • Story style: Edit ${SKILL_DIR}/references/story.txt — see references/prompts_reference.md
  • Infographic style: Edit ${SKILL_DIR}/references/image.txt — see references/prompts_reference.md

Scope

Include: Document-to-story conversion, infographic generation, logo branding. Exclude: Slide decks (use q-presentations), data visualization, chart generation.

Comments

Markdown supported