本文へ移動
cccskills
無料GitHub で公開日本語紹介

open-design-site-audit

公開中のWebサイトを、見やすさやアクセシビリティ、スマートフォン表示などの観点で確認し、問題箇所を示した画像付きの簡潔な報告をまとめます。

原文原文の説明を見る

Audit a live website with Open Design's own checks — contrast, tap targets, phone layout, larger text, broken images, page weight and template looks — and get a short, plain-language report of the biggest problems with marked screenshots — use whenever the user wants a website audited, checked or reviewed for design, accessibility or mobile problems ("audit this site", "what's wrong with our website", "find problems on example.com", "why does our site look bad on phones"), or wants talking points before pitching a redesign, even if they don't mention Open Design

feimacode/open-design-agent-kitスター 1,019(GitHub 1,019 + cccskills 0)

実行スコア 未検証

インストール方法を見る

こんなときに便利

  • サイトのスマホ表示を点検したいとき
  • アクセシビリティ上の問題を探したいとき
  • リニューアル提案の根拠を集めたいとき

日本語での紹介

できること

公開中のWebサイトを確認し、文字や背景のコントラスト、タップしやすいボタンの大きさ、スマートフォンでのレイアウト、大きな文字での表示、壊れた画像、ページのデータ量、既製テンプレートのような見た目を調べます。見つかった主な問題を、ページ上の場所や訪問者への影響、修正の方向とともに、画像付きの簡潔な報告にまとめます。複数ページを指定した場合も、同じサイト内で最大3ページを追加して確認できます。

こんなときに便利

自社サイトのスマートフォン表示や読みやすさを点検したいときや、リニューアルを提案する前に具体的な話題を整理したいときに向いています。サイトの所有者でない場合も、確認結果を会話の材料として使えます。

使い方の例

  • 「このサイトをデザイン面から確認して」
  • 「example.comのスマートフォン表示で問題を探して」
  • 「トップページと問い合わせページを監査して」

注意点

公開ページのURLが必要です。会員限定ページやボット対策などで確認できない場合があります。ブラウザーがインストールされていない環境では監査できません。

この紹介文は、公開されている SKILL.md をもとに AI(OpenAI Codex)が作成しました。正確な仕様は下の原文を確認してください。

含まれるファイル(1)

  • SKILL.md4.8 KB

SKILL.md(原文)

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

レビュー

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

コメント

ログインなしで書き込めます。使ってみた感想、質問、動かなかった環境などを気軽にどうぞ。

まだコメントはありません。最初のコメントを書いてみませんか。

送信するとすぐに公開されます。メールアドレスや電話番号などの個人情報は書かないでください。URL は 2 つまでです。

0 / 1000 文字

このフォームは reCAPTCHA で保護されており、Google のプライバシーポリシーと利用規約が適用されます。

同じリポジトリのスキル

3d-object

無料概要あり

設計トークンの色を使い、回転台に載せたスピーカーの3Dプロダクト画像を生成します。旋盤加工のような断面形状から組み立て、スタジオ照明で見せます。

  • スピーカーの商品画像を3Dで作りたいとき
  • 回転台に載せたプロダクトを見せたいとき
  • デザイントークンの色で3D画像を作りたいとき
feimacode/open-design-agent-kit1,0232026年10月31日 更新

3d-object

無料概要あり

形状やロゴから3Dオブジェクトを作り、スタジオ風の光で見せます。静止画、背景透過画像、回転動画として書き出せます。

  • 商品紹介用の3D画像を作りたいとき
  • ロゴを立体的に見せたいとき
  • 3Dモデルを回転動画にしたいとき
feimacode/open-design-agent-kit1,0232026年10月31日 更新

3d-object-glb

無料概要あり

`.glb`形式の3Dモデルを読み込み、中央に配置して見やすい大きさに整え、柔らかな地面の影を添えた商品画像として描画します。

  • `.glb`モデルから商品画像風の表示を作りたいとき
  • ボトルの3Dモデルを見やすくプレビューしたいとき
  • モデルを中央配置し、柔らかな影を加えたいとき
feimacode/open-design-agent-kit1,0232026年10月31日 更新

3d-object-logo

無料概要あり

ブランドのSVGロゴを金属の立体表現に仕上げ、ブラッシュドゴールドと面取りを施してゆっくり回転する映像にするスキルです。

  • SVGロゴを立体化したいとき
  • 金色の回転ロゴを作りたいとき
  • ブランドマークを映像で見せたいとき
feimacode/open-design-agent-kit1,0232026年10月31日 更新

3d-scene

無料概要あり

部屋や中庭など複数の物体がある小さな3D空間を計画して制作します。空の光と無料のCC0素材で仕上げ、静止画やカメラの移動動画として見せられます。

  • 小さな部屋や中庭を3Dで作りたいとき
  • ミニチュア風のビジュアルを作りたいとき
  • 3D空間の静止画や移動動画を作りたいとき
feimacode/open-design-agent-kit1,0232026年10月31日 更新

3d-scene

無料概要あり

夕暮れの石造りの中庭を、空や石畳、壁、真鍮のランタン、木製プランターと10秒のカメラ移動で表現した3Dシーンの作例です。

  • 夕暮れの中庭の3D作例を見たいとき
  • 石造りの空間表現を参考にしたいとき
  • カメラ移動の短い映像を確認したいとき
feimacode/open-design-agent-kit1,0232026年10月31日 更新

feimacode のスキルをすべて見る

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