taste-design-stitch について
Google Stitchが生成したUIを整えるデザインスキルです。余白、タイポグラフィ、色、視覚的な階層に関する判断を支援し、Google Labs公式のStitchスキル群に属します。
主な機能
- 01余白の選択を調整
- 02タイポグラフィを支援
- 03色の選択を改善
- 04視覚的な階層を強化
活用シーン
- 01Google StitchのUI出力の調整
- 02画一的なインターフェース表現の改善
インストール
コマンドをコピーしてターミナルで実行します。
$
npx skills add https:/ / github.com/ podo/ design-agent-skills --skill taste-design-stitchインストール後、Claude Code で/taste-design-stitchを入力して読み込まれたか確認します。
同梱ファイルstub.yaml
詳細
taste-design-stitch
カタログ用のスタブ — スキルの完全版:google-labs-code/stitch-skills
判断ツリー
-
スキルの完全版はすでにインストールされていますか? この場所にあるスキルに、まだ
das:ブロックがあるか確認します:- グローバル:
grep -q "^das:" ~/.agents/skills/taste-design-stitch/SKILL.md 2>/dev/null && echo "pointer" || echo "installed" - プロジェクト:
grep -q "^das:" .agents/skills/taste-design-stitch/SKILL.md 2>/dev/null && echo "pointer" || echo "installed" das:ブロックがない → スキルの完全版がインストール済みです。これを呼び出して続行しますdas:ブロックがある → ステップ 2 に進みます
- グローバル:
-
スコープを検出してから、インストールします:
スコープを検出するには:
[ -e ~/.agents/skills/taste-design-stitch ] && echo "global" || echo "project"グローバル(
-gを付けてインストール):npx skills add google-labs-code/stitch-skills --skill taste-design-stitch -g -yプロジェクト(
-gを付けずにインストール):npx skills add google-labs-code/stitch-skills --skill taste-design-stitch -yClaude Code: 会話から離れずに実行するには、どちらかのコマンドの先頭に
!を付けてチャットメッセージとして送信します。
インストール後の呼び出し
- スキル名:
taste-design-stitch - トリガーフレーズ:「taste design」、「stitch taste」、「improve stitch UI」、「stitch aesthetics」
機能
Google Stitch の UI 出力に美的判断とデザインセンスを適用します。間隔、タイポグラフィ、色、視覚的階層について独自の判断を加え、生成されたインターフェースをありきたりな AI の初期設定から脱却させ、計算されたものではなく、丁寧に作り込まれた印象に仕上げます。Google Labs 公式の Stitch スキルエコシステムの一部です。
コメント
Markdown 対応