jpskill.com
💬 コミュニケーション コミュニティ 🟢 非エンジニアでもOK 👤 管理職・人事・カスタマー対応

💬 Uxui Principles

uxui-principles

Uxui Principles の原則を解説するSkill。メール・Slack等のやりとりをする人向け。

⚡ ⏱ お礼メール定型化 5分/通 → 30秒/通

📺 まず動画で見る(YouTube)

▶ 【最新版】Claude(クロード)完全解説!20以上の便利機能をこの動画1本で全て解説 ↗

※ jpskill.com 編集部が参考用に選んだ動画です。動画の内容と Skill の挙動は厳密には一致しないことがあります。

📜 元の英語説明(参考)

Evaluate interfaces against 168 research-backed UX/UI principles, detect antipatterns, and inject UX context into AI coding sessions.

🇯🇵 日本人クリエイター向け解説

一言でいうと

Uxui Principles の原則を解説するSkill。メール・Slack等のやりとりをする人向け。

※ jpskill.com 編集部が日本のビジネス現場向けに補足した解説です。Skill本体の挙動とは独立した参考情報です。

⚡ おすすめ: コマンド1行でインストール(60秒)

下記のコマンドをコピーしてターミナル(Mac/Linux)または PowerShell(Windows)に貼り付けてください。 ダウンロード → 解凍 → 配置まで全自動。

🍎 Mac / 🐧 Linux 
mkdir -p ~/.claude/skills && cd ~/.claude/skills && curl -L -o uxui-principles.zip https://jpskill.com/download/3664.zip && unzip -o uxui-principles.zip && rm uxui-principles.zip
🪟 Windows (PowerShell) 
$d = "$env:USERPROFILE\.claude\skills"; ni -Force -ItemType Directory $d | Out-Null; iwr https://jpskill.com/download/3664.zip -OutFile "$d\uxui-principles.zip"; Expand-Archive "$d\uxui-principles.zip" -DestinationPath $d -Force; ri "$d\uxui-principles.zip"

完了後、Claude Code を再起動 → 普通に「動画プロンプト作って」のように話しかけるだけで自動発動します。

💾 手動でダウンロードしたい(コマンドが難しい人向け)
  1. 1. 下の青いボタンを押して uxui-principles.zip をダウンロード
  2. 2. ZIPファイルをダブルクリックで解凍 → uxui-principles フォルダができる
  3. 3. そのフォルダを C:\Users\あなたの名前\.claude\skills\(Win)または ~/.claude/skills/(Mac)へ移動
  4. 4. Claude Code を再起動
⬇ .zip でダウンロード(推奨) ⬇ .skill 形式(上級者用) 元のソース ↗

⚠️ ダウンロード・利用は自己責任でお願いします。当サイトは内容・動作・安全性について責任を負いません。

🎯 このSkillでできること

下記の説明文を読むと、このSkillがあなたに何をしてくれるかが分かります。Claudeにこの分野の依頼をすると、自動で発動します。

📦 インストール方法 (3ステップ)

  1. 1. 上の「ダウンロード」ボタンを押して .skill ファイルを取得
  2. 2. ファイル名の拡張子を .skill から .zip に変えて展開(macは自動展開可)
  3. 3. 展開してできたフォルダを、ホームフォルダの .claude/skills/ に置く
    • · macOS / Linux: ~/.claude/skills/
    • · Windows: %USERPROFILE%\.claude\skills\

Claude Code を再起動すれば完了。「このSkillを使って…」と話しかけなくても、関連する依頼で自動的に呼び出されます。

詳しい使い方ガイドを見る →
最終更新
2026-05-17
取得日時
2026-05-17
同梱ファイル
1

💬 こう話しかけるだけ — サンプルプロンプト

  • › Uxui Principles で、お客様への返信文を作って
  • › Uxui Principles を使って、社内向けアナウンスを書いて
  • › Uxui Principles で、メールテンプレートを整備して

これをClaude Code に貼るだけで、このSkillが自動発動します。

📖 Claude が読む原文 SKILL.md(中身を展開)

この本文は AI(Claude)が読むための原文(英語または中国語)です。日本語訳は順次追加中。

UX/UI Principles

A collection of 5 agent skills for evaluating interfaces against 168 research-backed UX/UI principles, detecting antipatterns, and injecting UX context into AI-assisted design and coding sessions.

Source: https://github.com/uxuiprinciples/agent-skills

Skills

Skill Purpose
uxui-evaluator Evaluate interface descriptions against 168 research-backed principles
interface-auditor Detect UX antipatterns using the uxuiprinciples smell taxonomy
ai-interface-reviewer Audit AI-powered interfaces against 44 AI-era UX principles
flow-checker Check user flows against decision, error, and feedback principles
vibe-coding-advisor Inject UX context into vibe coding sessions before implementation

When to Use

  • Auditing an existing interface for UX issues
  • Checking if a UI follows research-backed best practices
  • Detecting antipatterns and UX smells in designs
  • Reviewing AI-powered interfaces for trust, transparency, and safety
  • Getting UX guidance before or during implementation

How It Works

  1. Install any skill from the collection
  2. Describe the interface, screen, or flow you want to evaluate
  3. The skill evaluates against the relevant principles and returns structured findings with severity levels and remediation steps
  4. Optionally connect to the uxuiprinciples.com API for enriched output with full citations

Install

npx skills add uxuiprinciples/agent-skills

Limitations

  • Use this skill only when the task clearly matches the scope described above.
  • Do not treat the output as a substitute for environment-specific validation, testing, or expert review.
  • Stop and ask for clarification if required inputs, permissions, safety boundaries, or success criteria are missing.