本文へ移動
cccskills
無料GitHub で公開

tutorial-generator

スクリーンショットからGemini Vision APIで操作チュートリアルを自動生成する。「操作マニュアルを作って」「スクショから手順書を生成」「使い方ガイドを作成」等で発動。

インストール方法を見る

含まれるファイル(5)

  • SKILL.md1.8 KB
  • agents/openai.yaml152 B
  • scripts/generate_tutorial.py6.5 KB
  • SKILL.en.md1.8 KB
  • SKILL.es.md2.0 KB

SKILL.md(原文)

インストールする前に、エージェントに与えられる指示の中身を確認できます。

Tutorial Generator

Analyze screenshots and generate step-by-step operation instructions.

Workflow

  1. Provide screenshot of the UI/screen
  2. Gemini Vision analyzes visible elements (buttons, forms, menus)
  3. Generates structured tutorial with actionable steps
  4. Outputs HTML tutorial with embedded image

Usage

python scripts/generate_tutorial.py "{screenshot_path}" --output "{output_path}"

Parameters

ParameterRequiredDefaultDescription
screenshot_pathYes-Path to screenshot
--outputNoautoOutput HTML path
--contextNo-Additional context about the screen

Output Format

Generated HTML includes:

  • Screen overview (what this screen is for)
  • Original screenshot
  • Numbered operation steps
  • Element locations and descriptions
  • Tips and warnings

Example

# Basic usage
python scripts/generate_tutorial.py "login_screen.png"

# With context
python scripts/generate_tutorial.py "settings.png" --context "User settings page for changing password"

# Specify output
python scripts/generate_tutorial.py "dashboard.png" --output "docs/tutorials/dashboard_guide.html"

Requirements

  • GEMINI_API_KEY or GOOGLE_API_KEY in environment
  • Python packages: google-genai, Pillow, python-dotenv

レビュー

まだレビューはありません。使ってみた感想をお寄せください。

同じリポジトリのスキル

概要と使いどころ

ab-test-setup

無料日本語概要

A/Bテストや実験の設計・実装を支援するスキル。 「A/Bテストを設計して」「スプリットテストしたい」「仮説を立ててテストしたい」「バリアントを比較」等のリクエストで発動。 トラッキング実装は analytics-tracking を参照。

minicoohei/ai-agent-camp3472026年10月7日 更新

agent-designer

無料日本語概要

マルチエージェントシステムのアーキテクチャ設計ツールキット。 「エージェントを設計して」「マルチエージェント構成」「エージェントのアーキテクチャ」「オーケストレーション設計」等のリクエストで発動。

minicoohei/ai-agent-camp3472026年10月7日 更新

aiagent-check-setup

無料日本語概要

ai-agent-campのローカル環境セットアップを確認するスキル。 「セットアップ確認」「環境チェック」「初期設定できてる?」「インストール確認」「依存関係チェック」等のリクエストで発動。

minicoohei/ai-agent-camp3472026年10月7日 更新

aiagent-command-router

無料日本語概要

ai-agent-campのスラッシュコマンドをCodexでルーティングするスキル。 「/start-0-1を実行」「スラッシュコマンドを使いたい」「コマンドルーティング」「Cursorのコマンドを使いたい」等のリクエストで発動。

minicoohei/ai-agent-camp3472026年10月7日 更新

aiagent-env-manager

無料日本語概要

ai-agent-campの環境変数・認証情報を安全に管理するスキル。 「APIキーを設定」「.envを管理」「環境変数の設定」「credential managerを使いたい」「秘密情報の管理」等のリクエストで発動。

minicoohei/ai-agent-camp3472026年10月7日 更新

aiagent-guide

無料日本語概要

ai-agent-campリポジトリの案内・オリエンテーションスキル。 「リポジトリ案内」「次のレッスンは?」「どこから始める」「ツールの違い」「aiagent概要」等のリクエストで発動。

minicoohei/ai-agent-camp3472026年10月7日 更新

minicoohei のスキルをすべて見る

このスキルの問題を報告する