メニュー
Explicit helper for UI components, hero sections, forms, feedback, and contact surfaces. Do NOT load for: authentication, backend implementation, database work, or business logic.
デフォルトでは、最初にソースを確認する Prompt が選択されています。直接コマンドに切り替えるか、ローカルコピーをダウンロードすることもできます。
インストールを決める前に、SKILL.md と SkillsMP に表示されている付属ファイルをお読みください。
Codex または Claude でインストール この Prompt をコピーして Codex、Claude、または他のアシスタントに貼り付けると、Skill ページを確認してインストールできます。
直接コマンドでは確認用 Prompt が省略されます。実行前にソースを確認してください。
npx skills add https://github.com/whyzsm/tiny-agents --skill uiコマンドは1行のまま表示されます。コピー前に横へスクロールして全体を確認してください。
ローカルで確認しますか？SkillsMP が現在取得できるファイルをダウンロードできます。
Single-Agent T-MAX Java backend architecture and engineering rule package. Use when Codex must design, implement, review, or diagnose T-MAX backend services involving Java 8, Spring Boot, Kylin, MyBatis XML, TiDB/MySQL, Apollo/Nacos, Feign, AnePageHelper, ResponseResult/DataGridResult, UEP export, Redis, RabbitMQ, or Maven multi-module repositories. Routes one Agent through repository intake, architecture decisions, API/data contracts, implementation diagnosis, quality/security review, and bounded evidence loops while keeping builds, tests, live calls, commits, and pushes as separate authority boundaries.
Create polished consulting-style single-file HTML research reports from messy business notes, screenshots, metrics, and iterative user feedback. Use this skill whenever the user asks for a 咨询风/艾瑞咨询风/研究报告/汇报报告/HTML报告, wants business or AI landing-practice material turned into a management-facing report, asks to add charts/diagrams, or asks to update report metrics and keep the whole HTML report consistent.
Audit HarmonyOS applications for AppGallery/AGC release readiness, including Huawei UX/HMI controls, system-feature integrations, and performance gates for multi-input interaction, latency, frame rate, content display, memory, and CPU. Use when users ask for 鸿蒙上架自检、应用市场审核、AGC发布前检查、控件/系统特性/人机交互/签名/隐私/权限/截图/性能核对或 release 包门禁, especially for Stage-model projects with module.json5, build-profile.json5, hvigorw, and local-first data constraints.
SOC 職業分類に基づく
SKILL.md を表示中
| name | ui |
| description | Explicit helper for UI components, hero sections, forms, feedback, and contact surfaces. Do NOT load for: authentication, backend implementation, database work, or business logic. |
| description-en | Explicit helper for UI components, hero sections, forms, feedback, and contact surfaces. Do NOT load for: authentication, backend implementation, database work, or business logic. |
| description-ja | UIコンポーネント、ヒーロー、フォーム、フィードバック、問い合わせ面の明示補助スキル。認証、バックエンド実装、データベース作業、ビジネスロジックには使わない。 |
| allowed-tools | ["Read","Write","Edit","Bash"] |
| user-invocable | false |
| disable-model-invocation | true |
UIコンポーネントとフォームの生成を担当するスキル群です。
${CLAUDE_SKILL_DIR}/references/ui-skills.md の制約を最優先で適用する。${CLAUDE_SKILL_DIR}/references/frontend-design.md は「尖った/独自/表現強め/ブランド強化」などが明示された場合のみ適用する。| 機能 | 詳細 |
|---|---|
| 制約セット | See references/ui-skills.md / references/frontend-design.md |
| コンポーネント生成 | See references/component-generation.md |
| フィードバックフォーム | See references/feedback-forms.md |
UI コンポーネント生成時は、アクセシビリティを確保:
♿ アクセシビリティチェックリスト
生成する UI は以下を満たすことを推奨：
### 必須項目
- [ ] 画像に alt 属性を設定
- [ ] フォーム要素に label を関連付け
- [ ] キーボード操作可能（Tab でフォーカス移動）
- [ ] フォーカス状態が視覚的に分かる
### 推奨項目
- [ ] 色だけに依存しない情報伝達
- [ ] コントラスト比 4.5:1 以上（テキスト）
- [ ] aria-label / aria-describedby の適切な使用
- [ ] 見出し構造（h1 → h2 → h3）が論理的
### インタラクティブ要素
- [ ] ボタンに適切なラベル（「詳細」ではなく「製品詳細を見る」）
- [ ] モーダル/ダイアログのフォーカストラップ
- [ ] エラーメッセージがスクリーンリーダーで読まれる
♿ 誰でも使えるデザインにするために
1. **画像には説明をつける**
- 「商品画像」ではなく「赤いスニーカー、正面から」
2. **クリックできる場所はキーボードでも操作可能に**
- Tab キーで移動、Enter で決定
3. **色だけで判断させない**
- 赤=エラー だけでなく、アイコン+テキストも