mcpField
U
ux-researcher

ux-researcher

github.com/dylantarreデザイン・UI132531 回インストール43 週間前に更新
リポジトリ

ux-researcher について

アニメーションが使いやすさ、知覚、行動に与える影響を調べるUXリサーチスキルです。Disneyの12原則に沿った問いと調査方法を示し、動きを減らす設定への配慮も扱います。

主な機能

  1. 0112原則を使った動きの評価
  2. 02アニメーションの研究課題を設定
  3. 03A/Bテストによるデザイン比較
  4. 04注意、記憶、エラーの測定
  5. 05動きを減らす参加者への配慮

活用シーン

  1. 01アニメーションとタスクエラーの関係を調査
  2. 02動きが注意を導くかを検証
  3. 03イージングやトランジションを比較
  4. 04状況ごとの動きの好みを評価

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/dylantarre/animation-principles --skill ux-researcher

インストール後、Claude Code で/ux-researcherを入力して読み込まれたか確認します。

詳細

UX リサーチャー:アニメーションとユーザーエクスペリエンス

動きがユーザビリティ、知覚、行動にどのような影響を与えるかを調査する UX リサーチャーです。ディズニーの 12 の原則を評価の枠組みとして適用します。

UX リサーチにおける 12 の原則

1. スクワッシュ&ストレッチ

リサーチの問い:弾力のあるフィードバックは、応答性の知覚を高めますか? 方法:硬いボタン状態と弾力のあるボタン状態で A/B テストを行います。知覚される速度と満足度スコアを測定します。アニメーションの長さが同じでも、ユーザーは弾力のあるアニメーションを「より速い」と評価することがよくあります。

2. アンティシペーション(予備動作)

リサーチの問い:準備動作はユーザーのエラーを減らしますか? 方法:予備動作の合図あり・なしでタスクの完了状況をテストします。アクション前の合図により、誤クリックが減り、ターゲットの精度が高まります。エラー率とタスク完了時間を測定します。

3. ステージング

リサーチの問い:動きは効果的に注意を誘導しますか? 方法:アニメーションシーケンス中にアイトラッキング調査を行います。ヒートマップで、ユーザーが意図した注目箇所を追っているかを明らかにします。要素を順番に表示する場合と同時に表示する場合を比較します。

4. ストレート・アヘッドとポーズ・トゥ・ポーズ

リサーチの問い:状況によって、どちらの手法がより自然に感じられますか? 方法:流れるような連続した動き(ストレート・アヘッド)と、正確なキーフレームアニメーション(ポーズ・トゥ・ポーズ)のどちらを好むかをテストします。状況が重要です。たとえば、有機的なコンテンツかデータビジュアライゼーションかで異なります。

5. フォロースルーとオーバーラッピング・アクション

リサーチの問い:段階的なアニメーションは、コンテンツの階層構造の理解を高めますか? 方法:コンテンツを同時に表示する場合と順番に表示する場合を比較する想起テストを行います。要素が意味のある順序で表示されると、ユーザーはより多くを記憶します。

6. スローインとスローアウト

リサーチの問い:イージングは、体感時間や品質にどのような影響を与えますか? 方法:異なるイージングカーブを使って時間推定タスクを実施します。リニアな動きは「安っぽく」、実際より長く感じられます。イージングを適用した動きは「洗練されて」いて、実際より短く感じられます。

7. アーク

リサーチの問い:曲線の動きの軌跡は、より自然に感じられますか? 方法:直線的なトランジションと曲線に沿ったトランジションを比較する選好調査を行います。アイトラッキングにより、曲線の軌跡のほうが滑らかな追視運動につながることが明らかになります。

8. セカンダリー・アクション

リサーチの問い:補助的なアニメーションは効果を高めますか、それとも注意をそらしますか? 方法:二重課題テストを実施します。主タスクの完了と副次的なアニメーションを組み合わせ、控えめな動きが集中を助けるか妨げるかを測定します。閾値テストも行います。

9. タイミング

リサーチの問い:アクションごとに、どのくらいの長さが「ちょうどよい」と感じられますか? 方法:アニメーション速度について、弁別閾の調査を行います。範囲を定めます。速すぎる(不安を感じる)、最適(流れるように感じる)、遅すぎる(もたつく)。閾値は状況によって異なります。

10. 誇張

リサーチの問い:漫画的に感じさせずに認知度を高めるには、どの程度の誇張が適切ですか? 方法:スケーリング調査を行い、誇張がブランドや状況にそぐわなくなる閾値を特定します。B2B と消費者向けでは違いがあります。

11. ソリッド・ドローイング

リサーチの問い:空間的な一貫性は、信頼やユーザビリティに影響しますか? 方法:空間的な挙動が一貫しているインターフェースと、一貫していないインターフェースをテストします。方向感覚のエラー、信頼度評価、完了への自信を測定します。

12. アピール

リサーチの問い:アニメーションの品質はブランドの印象に影響しますか? 方法:アニメーションの洗練度と NPS、ブランドへの信頼度スコアを相関させます。ハロー効果により、滑らかなアニメーションは製品全体の印象を高めます。

リサーチ上の考慮事項

  • 常に prefers-reduced-motion を使用するユーザーを対象にテストします
  • 動きに関する調査では前庭障害のスクリーニングを行います
  • 動きの好みには文化的な違いがあります
  • 動きの速度や複雑さへの感受性は年齢によって異なります

コメント