I
interaction-design
by @Owl-Listenerv
4.4(210)
マイクロアニメーション、状態遷移、ユーザーフローを含む意味のあるユーザーインタラクションの設計に特化し、直感的で楽しく効率的なデジタル体験を創造します。
インストール方法
npx skills add Owl-Listener/designer-skills --skill interaction-designcompare_arrows
Before / After 効果比較
1 组使用前
製品インターフェースには生き生きとしたインタラクティブなフィードバックが不足しており、ユーザーは操作時に単調さを感じ、システムの状態を理解するのが困難でした。その結果、ユーザーエクスペリエンスは悪く、ユーザーの定着率も低かったです。
使用後
綿密に設計されたマイクロアニメーションとステータスメカニズムを通じて、製品に生命を吹き込み、ユーザーの操作の楽しさと理解度を高め、ユーザーエクスペリエンスと製品の魅力を大幅に向上させます。
description SKILL.md
interaction-design
Design meaningful interactions with micro-animations, state machines, gestures, error handling, and feedback patterns.
Skills (7)
- micro-interaction-spec — Specify micro-interactions with trigger, rules, feedback, and loop/mode definitions.
- animation-principles — Apply animation principles to UI motion for purposeful, polished interactions.
- state-machine — Model complex UI behavior as finite state machines with states and transitions.
- gesture-patterns — Design gesture-based interactions for touch and pointer devices.
- error-handling-ux — Design error prevention, detection, and recovery experiences.
- loading-states — Design loading, skeleton, and progressive content reveal patterns.
- feedback-patterns — Design system feedback for user actions including confirmations and status.
Commands (3)
/design-interaction— Design a complete interaction flow for a feature or component./map-states— Model the states and transitions for a complex UI component./error-flow— Design a complete error handling flow for a feature.
forumユーザーレビュー (0)
レビューを書く
効果
使いやすさ
ドキュメント
互換性
レビューなし
統計データ
インストール数4.1K
評価4.4 / 5.0
バージョン
更新日2026年4月27日
比較事例1 件
ユーザー評価
4.4(210)
5
63%
4
25%
3
8%
2
2%
1
1%
この Skill を評価
0.0
対応プラットフォーム
🔧Claude Code
🔧OpenClaw
🔧OpenCode
🔧Codex
🔧Gemini CLI
🔧GitHub Copilot
🔧Amp
🔧Kimi CLI
タイムライン
作成2026年1月25日
最終更新2026年4月27日