Webdesign
The Webdesign skill from Daniel Miessler's LifeOS, a personal agent setup for Claude Code.
スキルの内容
The Webdesign skill from Daniel Miessler's LifeOS, a personal agent setup for Claude Code. It offers two routes: DirectDesign, which designs inside the user's code following an aesthetic guide based on Anthropic's frontend-design approach, and NativeDesign, which uses Claude Design artboards and design-system sync to compare variants before implementing. Both reuse the host app's existing tokens and components unless a redesign is requested. Before anything is shown, the rendered page is captured with LifeOS's Interceptor tool and scored by its ArtDirection critique step, and the skill iterates on the named defects. It depends on other LifeOS components and a context loader, and reads saved user design preferences from a preferences file.
できること
- Design UI directly in an existing codebase using its tokens and components
- Generate artboard variants and sync a design system through Claude Design
- Capture the rendered page and iterate on critique findings before delivery
概要
- 公開元
- Daniel Miessler
- ツール
- フロントエンドデザイン
インストール
プロジェクトのドキュメントに、確認できるインストール手順がありません。 プロジェクトの手順を見る
含まれるファイル
- Context.json
- Intents/DirectDesign.md
- Intents/NativeDesign.md
- LICENSE.txt
- README.md
- References/ClaudeDesignCapabilities.md
- References/CompleteGuide.md
- References/FrontendDesignPhilosophy.md
- References/InputFormats.md
- References/SiteLaunch.md
- Setup.md
- Tools/VerifyDesign.ts
MCPサーバーやスキルは、お使いのコンピューターでコードを実行したり、データを操作したりできます。インストールする前にソースを確認してください。
このスキルには、エージェントが実行する可能性のあるスクリプトが含まれています。
詳細
| 項目 | 内容 | 出典 |
|---|---|---|
| 種類 | スキル | |
| ツール | フロントエンドデザイン | |
| 公開元 | Daniel Miessler | 出典 |
| 公式かどうか | ドキュメントに記載なし | |
| APIキーまたはサインインが必要 | ドキュメントに記載なし | |
| スクリプトを含む | はい | 出典 |
| プラットフォーム | ドキュメントに記載なし | |
| AIクライアント | ドキュメントに記載なし | |
| ライセンス | MIT | 出典 |
| 料金 | ドキュメントに記載なし | |
| 活動状況 | 最終コミット 2026年11月5日GitHubスター 19,824ダウンロード数のデータなし(npm・PyPIで未公開) | 出典 |
| リンク | リポジトリ Webサイト |
Daniel Miesslerのほかの掲載
スキル5件
Daniel Miesslerの掲載5件をすべて見る →こちらにも掲載: フロントエンドデザイン
出典
- スキルファイル(SKILL.md)github.com/danielmiessler/lifeos2026年11月12日
- ライセンスファイル(LICENSE.txt)github.com/danielmiessler/lifeos · 根拠となる項目:ライセンス2026年11月12日
- ライセンスファイル(LICENSE)github.com/danielmiessler/lifeos · 根拠となる項目:公開元2026年11月12日
- リポジトリ内のフォルダ(Webdesign)github.com/danielmiessler/lifeos · 根拠となる項目:スクリプトを含む2026年11月12日
- GitHubリポジトリgithub.com/danielmiessler/lifeos · 根拠となる項目:活動状況, ライセンス2026年11月11日
- スキルファイル(SKILL.md)github.com/danielmiessler/LifeOS2026年11月10日
- リポジトリ内のフォルダ(Webdesign)github.com/danielmiessler/LifeOS · 根拠となる項目:スクリプトを含む2026年11月10日