まず Skill とは何か
Skill は SKILL.md として書かれた作業指示書で、Claude Code、Codex、Cursor がどれも読めます。AI がその手順と仕様に従って進めるので、その場で打った指示より結果が安定します。詳しくはAI Skill とはをご覧ください。
第一類：デザインの指針
この種類の Skill はサイトを丸ごと作るのではなく、AI にデザインの進め方を教えます。書体の選び方、配色、版面の方向を決め、どこでも見かける既製品のような見た目を避けます。Anthropic が GitHub で公開している frontend-design はこの種類で、説明には、個性があり意図のある視覚デザインの指針で、美意識の方向と書体を扱うと書かれています。
Sketchry の UNSLOP UI もここに入ります。AI 臭さの判定、三つのデザイン方向、作品ボードのテンプレートを渡すもので、素材パックは付きません。
合う場面：自分のやり方はもうあって、仕上がりのデザインの質だけ上げたいとき。
第二類：素材が付いたサイト一式
この種類はひとそろいを渡します。デザイン仕様、手順、そして展示用の素材パックです。AI がそれに従って、そのまま直せるサイトを丸ごと作ります。Sketchry のサイト Skillはこの種類で、レストラン、不動産、ブランド、旅館、写真の作品集、デザイン事務所などを扱い、どれも仕上がりを先に見られます。
合う場面：サイト一式を早く手に入れて、自分のブランドや文章、写真に差し替えたいとき。あるいは受託で顧客向けに作るとき。
第三類：ファイル一枚で渡すプレゼン
この種類が作るのはスライドです。できあがるのは deck.html 一枚で、ダブルクリックすれば再生でき、サーバーもインストールも要りません。ブラウザのなかで文字を打ち直せて、直した内容は残ります。文字も表もグラフも編集できる PPTX と、1 枚 1 ページの 16:9 PDF に書き出せます。Sketchry のプレゼンのテンプレートはこの種類で、無料の PITCHFOLD と FIELDNOTE をまず試せます。
合う場面：資金調達の説明、提案、四半期の振り返り、授業のスライドが要るけれど、白紙から組み始めたくないとき。
第四類：コードで動画を描く
動画を作る Skill もあります。AI がコードで 1 フレームずつ描いて MP4、サムネイル、絵コンテを書き出し、文字のカード、データのグラフ、アプリの操作案内、イベントのカウントダウンまで作れます。Sketchry のマーケティング動画 Skillはこの種類で、無料の INKFRAME をまず試せます。
合う場面：商品紹介やイベントの宣伝、SNS の短い動画が要るけれど、自分で編集はしたくないとき。
選び方
- まずサイト、プレゼン、動画のどれを作るか決めます。
- サイトなら：質を上げたいならデザインの指針、仕上がりをそのまま手に入れたいなら素材付きのサイト Skill。
- プレゼンなら：用途で選びます。資金調達、提案、データの振り返り、授業にそれぞれの型があります。
- Skill の見本を開いて、求めている雰囲気か確かめ、商用利用が明記されているかを見ます。
- 対応する AI ツールを確かめます。Sketchry の Skill は Claude Code、Codex、Cursor に対応します。
- 仕上げたら、スマートフォンの幅でもう一度版面を見ます。
使い方
いちばん手軽なのは、Skill をコピーして Claude Code や Codex、Cursor に貼り、聞かれたらブランド名と素材を渡すやり方です。SKILL.md として保存し、ツールの skills フォルダに置いて、あとから名前で呼び出すこともできます。各ツールのフォルダの場所は使い方にあります。
よくある質問
複数の Skill を同時に使えますか？
使えますが、一度に主な流れはひとつに絞るほうが安心です。たとえばサイト一式の Skill で作ってから、デザインの指針で細部を整えると、二つの指示がぶつかりません。
Claude Code 以外のツールでも使えますか？
SKILL.md は共通の形式で、Claude Code、Codex、Cursor がどれも読めます。Sketchry の Skill はこの三つに向けて書かれています。
Skill で作ったものを顧客に渡せますか？
Skill ごとのライセンス次第です。Sketchry の Skill で作ったものは、自分または顧客の商用の案件に使えて、出典の表示は要りません。
試すにはお金が必要ですか？
必ずしも要りません。Anthropic が公開している frontend-design は誰でも手に入れられますし、Sketchry にもサイト、プレゼン、動画の無料の Skill があります。OFFSET STUDIO、PITCHFOLD、INKFRAME などです。