aesthetic
実証済みのデザイン原則に従い、美しいUIを構築できます。UI/UXの設計、インスピレーションサイトのデザイン分析、AI多機能モデルによる画像生成、視覚階層とカラーセオリーの実装、マイクロインタラクションの追加、デザイン資料の作成に対応しています。Chrome DevToolsとAI多機能モデルを使用したインスピレーション画面の取得・分析、美的基準を満たすまでのデザイン画像の反復生成、包括的なデザインシステムガイダンス（美的原則、機能性・アクセシビリティ、マイクロインタラクション、ストーリーテリング段階）を含みます。Chrome DevTools、AI多機能モデル、メディア処理、UIスタイリング、ウェブフレームワークスキルと連携します。
description の原文を見る
Create aesthetically beautiful interfaces following proven design principles. Use when building UI/UX, analyzing designs from inspiration sites, generating design images with ai-multimodal, implementing visual hierarchy and color theory, adding micro-interactions, or creating design documentation. Includes workflows for capturing and analyzing inspiration screenshots with chrome-devtools and ai-multimodal, iterative design image generation until aesthetic standards are met, and comprehensive design system guidance covering BEAUTIFUL (aesthetic principles), RIGHT (functionality/accessibility), SATISFYING (micro-interactions), and PEAK (storytelling) stages. Integrates with chrome-devtools, ai-multimodal, media-processing, ui-styling, and web-frameworks skills.
SKILL.md 本文
Aesthetic
実証済みの設計原則と体系的なワークフローに従って、美学的に優れたインターフェースを作成します。
このスキルを使用するタイミング
以下の場合に使用してください:
- ユーザーインターフェースを構築またはデザインする
- インスピレーションウェブサイト（Dribbble、Mobbin、Behance）からデザインを分析する
- デザイン画像を生成し、美学的な品質を評価する
- 視覚階層、タイポグラフィ、カラーセオリーを実装する
- マイクロインタラクションとアニメーションを追加する
- デザインドキュメンテーションとスタイルガイドを作成する
- アクセシビリティとデザインシステムに関するガイダンスが必要
コアフレームワーク: 4 段階アプローチ
1. BEAUTIFUL: 美学性の理解
既存のデザインを研究し、パターンを特定し、原則を抽出します。AI には美的感覚がないため、高品質な例を分析し、市場の嗜好と一致させることで基準を確立する必要があります。
参考: references/design-principles.md - 視覚階層、タイポグラフィ、カラーセオリー、余白の原則。
2. RIGHT: 機能性の確保
ユーザビリティに欠ける美
...
詳細情報
- 作者
- nordeim
- ライセンス
- 不明
- 最終更新
- 2026/4/14
Source: https://github.com/nordeim/Prompt-Engineering / ライセンス: 未指定