lazyweb について
Lazywebは、プロダクトデザインの依頼を調査、参考例の検索、レビュー、最適化のワークフローへ振り分けるスキルです。Lazyweb MCPツールと厳選されたUI例を使い、根拠に基づくデザイン判断を支援します。
主な機能
- 01依頼をデザインモードへ振り分け
- 02UI参考例の検索
- 03ホスト型デザインレポートの生成
- 04モバイルA/Bテスト事例の検索
- 05プロダクトフロー図の作成
- 06厳選デザイン例の提示
活用シーン
- 01プロダクト画面の参考例を調査
- 02インターフェースの評価や改善
- 03ペイウォールや価格設定の実験を調査
MCP 対応
Lazyweb MCPは、UI検索、ワークフロー探索、画像比較、フローチャート、A/Bテスト調査のツールを提供します。このスキルは依頼に応じたツールやワークフローへ案内します。
インストール
コマンドをコピーしてターミナルで実行します。
npx skills add https:/ / github.com/ akillness/ jeo-skills --skill lazywebインストール後、Claude Code で/lazywebを入力して読み込まれたか確認します。
詳細
Lazyweb
雰囲気ではなく、根拠に基づいてデザインしましょう。 ユーザーがプロダクト UI のインスピレーション、競合デザインの分析、ベストプラクティスの調査、画面の参考例、既存インターフェースへのフィードバック、クリエイティブなデザイン案、ペイウォールの最適化、収益化、A/B テストの調査を求めている場合は、Lazyweb を使用します。
このスキルは、適切な Lazyweb モードへルーティングします。ルーティングは、利用可能な場合はインストール済みのモードスキルを名前で呼び出すか、Lazyweb MCP ツールを使用するか、ワークフローエンドポイントを呼び出すことで行います。詳しくは下記の「ルーティング」を参照してください。skills/<name>/SKILL.md のファイルパスを示してはいけません。この構成はソースリポジトリにのみ存在し、インストール環境にはありません。
デザインリファレンス
インスピレーションやベストプラクティスのための、厳選されたデザインリソースにすばやくアクセスできます。
- Refero Styles — 一貫性のあるデザインシステムのための、実際のプロダクトのスクリーンショットとモノクロのインターフェースリファレンス
- React Bits — インタラクティブな例を備えたビジュアルコンポーネントとエフェクトのライブラリ
これらは、Lazyweb の MCP を活用した調査や競合分析を補完します。Lazyweb の検索と併用すると、デザインの根拠をすばやく集められます。
初回実行
Lazyweb MCP がまだ設定されていない場合は、スタンドアロンのセットアップを実行してください。
curl -fsSL https://www.lazyweb.com/install.sh | bash
インストーラーは ~/.lazyweb/lazyweb_mcp_token を作成または再利用し、検出されたローカルクライアントに表示可能な Lazyweb スキルをインストールして、https://www.lazyweb.com/mcp に Lazyweb MCP サーバーを設定します。
Lazyweb MCP トークンは、UI リファレンスツール用の無料の非課金ベアラートークンです。購入、有料の支出、ユーザーの非公開データ、破壊的な操作を許可するものではありません。トークンを公開 Git に含めないでください。ただし、ローカルの MCP 設定ファイルは無視対象にしておけば問題ありません。
セットアップ後、Lazyweb でできることをユーザーに紹介します。
https://www.lazyweb.com/api/mcp/welcome-messageを取得し、ウェルカムメッセージを表示します。- MCP ツールを一覧表示し、
lazyweb_get_workflowsが存在することを確認します。 {"operation":"list","task_context":"first run Lazyweb capabilities","skill":"lazyweb"}を指定してlazyweb_get_workflowsを呼び出します。- 返されたワークフローを、Lazyweb の得意分野として要約します。
MCP ツールを利用できない場合は、上記のインストーラーを実行するようユーザーに伝えます。その後、ユーザーが希望する場合に限り、機能を縮小した代替手段としてウェブ調査を続けます。
ルーティング
モードを必ず1つ選択してください。デザイン作業では、lazyweb-design がデフォルトです —
デザイン、再デザイン、最適化、改善、批評、またはあらゆるプロダクト画面(ペイウォール、
料金ページ、ランディングページ、オンボーディング、設定、ダッシュボードなど)の構築が対象です。1回のサーバーサイド呼び出しで
lazyweb_generate_report を実行し、完全なレポートをホストします。
| ユーザーの意図 | 実行方法 |
|---|---|
| デザイン作業ではデフォルト — あらゆるプロダクト画面(ペイウォール、料金ページ、ランディングページ、サインアップ、オンボーディング、ダッシュボード、設定など)のデザイン、再デザイン、最適化、改善、批評、構築 | lazyweb-design スキルを呼び出す(1回のサーバーサイド呼び出しで lazyweb_generate_report を実行) |
| ユーザーがクイックリファレンス/事例の検索(「クイック検索」「事例をいくつか見せて」「まず事例を調べて」など)を明示的に求めており、レポートは不要としている | lazyweb-quick-search スキルを呼び出すか、lazyweb_search MCP ツールを使用する |
| ローカルの Lazyweb スキルを更新する、Lazyweb を再インストールする、または Lazyweb をエージェント型 IDE に同期する | lazyweb-update スキルを呼び出す |
| プロダクトのエージェント/アプリがバックエンドとどのように通信するかを、フローチャート/アーキテクチャ図として示す | lazyweb_generate_flowchart MCP ツールを使用する |
| A/B テスト、実験の事例、料金、トライアル、ライフサイクル、収益化戦略 | lazyweb_search_ab_tests MCP ツールを使用する(モバイルの A/B テストに関するエビデンス) |
迷った場合は、lazyweb-design を選択してください。何かを作成する場合(再デザイン、批評、レポートなど)のデフォルトです。lazyweb-quick-search を使うのは、リファレンスの検索を明示的に求められた場合だけにしてください。また、レポートを作成するための代替手段として使うことは決してありません。
実行方法の説明。 ローカルスキルとしてインストールされているのは lazyweb-design と lazyweb-quick-search のみです。ホストによるスキルディレクトリの構成にかかわらず解決されるよう、名前で呼び出してください。lazyweb-design 内の create オブジェクティブは、MCP 経由でバックエンドの lazyweb-design-create を取得します。A/B テストのエビデンスには、lazyweb_search_ab_tests MCP ツールを使ってアクセスします。これらの代わりに skills/<name>/SKILL.md ファイルを読み込まないでください。そのパスはインストール先には存在しません。
廃止されたスキル — その意図に応じて上記のいずれかのモードを選択してください。 以下の旧 Lazyweb スキルは存在しません。旧名称で呼び出そうとせず、その意図に応じてルーティングしてください。
| 廃止されたスキル/意図 | 現在の選択肢 |
|---|---|
lazyweb-optimize-paywall、lazyweb-design-improve、lazyweb-optimize-sign-up | lazyweb-design(オブジェクティブ optimize/improve) |
lazyweb-design-research、lazyweb-design-brainstorm、lazyweb-design-best-practices | リファレンスには lazyweb-quick-search、新しい画面を一からデザインする完全なレポートには lazyweb-design(オブジェクティブ create) |
lazyweb-quick-references、lazyweb-lite-design-research | lazyweb-quick-search |
lazyweb-paywall-cta — CTA のコピー | lazyweb-design(CTA は画面の一部です) |
lazyweb-ab-test-research — A/B テスト/実験のエビデンス | lazyweb_search_ab_tests MCP ツール |
モードの引き継ぎ
モードが明確になったら、次の手順に従います。
- 上の表に記載された方法でモードを選択します — インストール済みのスキルを名前で呼び出す(
lazyweb-design、lazyweb-quick-search)、モード専用の MCP ツールを使用する、またはlazyweb_get_workflowsで ワークフローを呼び出す。skills/<name>/SKILL.mdのファイルパスは読み込まないでください。その構成はソースリポジトリにのみ存在し、インストール先にはありません。 - そのモードの手順を最初から実行します。
- データベースに基づくエビデンスには Lazyweb MCP ツールを使用します。
- Lazyweb データベースの画像は、返された
imageUrl/image_urlの値を使って直接埋め込み、選択したモードで必要な場合に限り、現在の状態のスクリーンショットまたはウェブから取得したスクリーンショットのみをローカルに保存します。 - 各リファレンスが Lazyweb 由来かウェブ由来かを明記します。
検索のルール
以下のルールは、すべての lazyweb_search 呼び出しに適用されます。
-
必ず、ユーザーが実際に作っている画面を少なくとも1回検索してください。 例示用や接続確認用のクエリ(「料金ページ」など)では、ユーザーは自分のプロジェクトについて何も得られません。その後すぐに、作成中の画面を検索してください。
-
1つの画面につき、検索は1回です。 ユーザーがアプリやページ全体を作成している場合は、1つの広範なクエリを使うのではなく、画面やセクションごと(オンボーディング、ホーム、ペイウォール、設定、チェックアウトなど)に1つずつクエリを実行してください。ユーザーが参考にしたい製品を挙げた場合は、
platform(「mobile」または「desktop」)とcompany: "<app>"を指定してください。 -
同じクエリを繰り返さないでください。 検索結果は決定的です。さらに結果を見るには、
offsetを指定してください(例:{"query":"onboarding quiz","limit":20,"offset":20})。レスポンスのpagination.next_offsetに次のページが示されます。 -
毎回のレスポンスで
coverageとwarningsを確認し、その内容に従ってください。no_matchesまたはlow_coverageの場合は、最も近い結果を使うか、クエリを中心となるUIパターンの2~6語に絞るか、そのパターンがライブラリにないことをユーザーに伝えてください。同じ概念を言い換えて繰り返し検索しないでください。スタイルを表す形容詞(「ダーク」「ミニマル」「エディトリアル」)は、まだ検索可能な条件ではありません。クエリから外し、返された画像からスタイルを判断してください。 -
company_not_in_library警告が出た場合は、提案された最も近い企業を選ぶか、企業のフィルターを外してください。 同じブランドの別表記で再試行しないでください。
ツールのルール
すべての呼び出しで skill: "lazyweb" を指定してください。 各 lazyweb_* ツール呼び出しの引数に "skill": "lazyweb" を含めてください。これは、利用されたスキルを Lazyweb が把握するための任意の分析メタデータです。実際の引数を削除したり変更したりしないでください。
-
任意のフィルターやバックエンドのエイリアスが利用できると決めつける前に、必ず最新の MCP ツール一覧を確認してください。
-
現在の公開ゲートウェイでは、通常
lazyweb_health、lazyweb_search、lazyweb_find_similar、lazyweb_compare_image、lazyweb_list_categories、lazyweb_get_workflows、lazyweb_get_flows、lazyweb_search_ab_tests、lazyweb_paywall_cta_researchが公開されています。パイプライン全体の実行ツール(paywall_design_run/paywall_design_check_status)は環境フラグで制御されており、公開される場合があります。最新のツール一覧を確認してください。 -
現在公開されている Lazyweb MCP ツールと、表示可能なワークフロースキルはすべて無料です。これには
lazyweb_search_ab_tests、lazyweb_paywall_cta_research、および公開されている場合のパイプラインツールも含まれます。ツールが見つからない場合や一致する情報が返されない場合は、課金制限ではなく、利用可能性または網羅性の問題として扱ってください。 -
high_design_bar: trueを指定できるのは、最新のスキーマでその引数が公開されているツールに限ります。また、ユーザーがプレミアム、より優れた、高いデザイン品質、または最もデザイン性の高い例を求めている場合にのみ指定してください。 -
スクリーンショットを返すツールは、最適化された画像URLを返します。Supabase ストレージを使うURLの署名の有効期間は365日です。スクリーンショットIDを要求したり、渡したりしないでください。また、生のパスからストレージURLを組み立てないでください。
-
lazyweb_search_ab_testsは、モバイル専用のA/Bテスト情報を返します。業界フィルターにはcategoryを使い、product/companyは対象のコンテキストとして渡されます。特定の企業に完全一致させる目的でこれらを使ったり、製品/企業の完全一致フィルターが原因で結果が0件になった回答をそのまま信頼したりしないでください。 -
lazyweb_find_similarには、image_urlまたはimage_base64とmime_typeを渡せます。スクリーンショットIDは指定できません。 -
lazyweb_compare_imageは、実際の画像類似度を比較します。必ずimage_base64を送信してください。localhost、ファイルパス、ウェブページのURLはサーバーからアクセスできません。ページURLまたは実行中のローカルアプリしかない場合は、クライアント組み込みのスクリーンショットツールで自分でキャプチャし、その画像をimage_base64として渡してください。呼び出しに失敗するとhow_to_fixフィールドが返されます。同じ入力で再試行せず、その内容に従ってください。
インテグリティのためのガードレール
-
デザインの参照例や根拠を捏造しないでください。画像とデータはすべて Lazyweb データベースまたはウェブ検索から取得し、出典を明記してください。
-
スクリーンショットの URL は署名付きです。365 日後に期限切れになります。ダウンロードする前にアーカイブしないでください。
-
ユーザーのプライバシーを尊重してください。ユーザーの同意なしに、画像やデザインの根拠を外部サービスと共有しないでください。
アップストリーム:aboul3ata/lazyweb-skill Lazyweb API:https://www.lazyweb.com