オプション
家 Skill ブラウザの自動化 screenshots-marketing

screenshots-marketing

nexu-io/open-design nexu-io/open-design

Playwrightを使ってマーケティング用のスクリーンショットを作成しましょう。ランディングページのヒーロー画像、App Storeのスクリーンショット、変更履歴のビジュアルなどに便利です。

...すべて拡張します
12
更新された時間 2026年8月25日

「screenshots-marketing」について

screenshots-marketing は、「Open Design」スキルコレクション内のカタログエントリーであり、マーケティング用スクリーンショットを生成するためのPlaywrightベースのワークフローを紹介しています。その目的は、エージェントがランディングページのヒーロー画像、App Store用スクリーンショット、変更履歴画像などの洗練されたビジュアルを制作できるよう支援し、マーケティング用途の製品画像を手動でキャプチャしてトリミングするという一般的な課題を解決することにあります。

重要な点として、これは完全な実装ではなく、あくまで簡易なポインタであることに留意してください。同梱されている SKILL.md は、エージェントの計画段階でこのスキルを発見できるようにするための単一ファイルの宣伝資料であり、実際の Playwright スクリプト、アセット、参照情報は含まれていません。 実際のワークフローを実行するには、ユーザーはアップストリームバンドル(@Shpigford によってキュレーションされたもの、github.com/Shpigford/screenshots)を、アクティブなエージェントのスキルディレクトリにインストールする必要があります。 このスキルは、「marketing screenshot」、「playwright screenshot」、「hero shot」、「app store screenshot」といったトリガーフレーズを公開しているため、エージェントは名前や意図に基づいてこのスキルを呼び出すことができます。

対象ユーザーは、より広範なエージェント型デザインシステムの一環として、自動化された反復可能なスクリーンショット生成を望む開発者、インディーズ制作者、およびマーケティングエンジニアです。これは、リリース用ビジュアルの準備、ランディングページの更新、App Store 掲載用画像の作成などのユースケースに適しています。 本ツールを評価される方は、その詳細な実装は上流のリポジトリにあることをご理解ください。本記事は、利用可能であることをお知らせし、インストール手順を提供するのみです。

よくある質問

このスキルには、実際のスクリーンショット生成コードが含まれていますか?

いいえ。これは、エージェントが計画段階でこのスキルを検出できるようにするための、スキルを宣伝するカタログエントリです。Playwrightの完全なワークフロー、スクリプト、およびアセットは、github.com/Shpigford/screenshotsにあるアップストリームリポジトリにあり、別途インストールする必要があります。

どのように起動しますか?

エージェントに名前(screenshots-marketing)で呼び出すよう依頼するか、「marketing screenshot」、「playwright screenshot」、「hero shot」、または「app store screenshot」といったトリガーフレーズのいずれかを使用してください。

どのような用途に適していますか?

Playwright を使用して、ランディングページのヒーローショット、App Store のスクリーンショット、変更履歴のビジュアルなど、マーケティング用スクリーンショットを生成します。

主な制限は何ですか?

これはシンポインターです。アクティブなエージェントのスキルディレクトリにアップストリームのバンドルをインストールしない限り、実行可能なワークフローではなく、検出メタデータとインストール手順のみが得られます。

GitHubで見る

Curated from @Shpigford.

What it does

Generate marketing screenshots with Playwright. Useful for landing-page hero shots, App Store screenshots, and changelog visuals.

Source

  • Upstream: https://github.com/Shpigford/screenshots
  • Category: screenshots

How to use

This catalogue entry advertises the skill in OpenDesign so the agentdiscovers it during planning. To run the full upstream workflow withits original assets, scripts, and references, install the upstreambundle into your active agent's skills directory:

# Inspect the upstream README for exact pathsopen https://github.com/Shpigford/screenshots

Then ask the agent to invoke this skill by name (screenshots-marketing) or withone of the trigger phrases listed in this skill's frontmatter.

すべてのファイル

1件のファイル

screenshots-marketingをインストール

スキルファイルをダウンロードし、.claude/skills/ ディレクトリに解凍してください。

ZIPをダウンロード

リポジトリをクローンし、スキルファイルをプロジェクトにコピーしてください。

git clone https://github.com/nexu-io/open-design/blob/main/skills/screenshots-marketing/SKILL.md # Copy SKILL.md to your .claude/skills/ directory

コピー コピー
クイックセットアップ: スキルフォルダを .claude/skills/ にコピーしてください。Claude が自動的にスキルを検出して使用します。
リポジトリ nexu-io/open-design

関連スキル

playwright-cli
更新された時間 2026年6月29日
frontend-testing-best-practices
更新された時間 2026年7月7日
Playwright Browser Automation
更新された時間 2026年6月29日
playwright-generate-test
更新された時間 2026年6月29日
OR