• ABOUT
  • SERVICE
  • MEMBER
  • INFORMATION
  • BLOG
  • RECRUIT
  • CONTACT
  • ABOUT
  • SERVICE
  • MEMBER
  • INFORMATION
  • BLOG
  • RECRUIT
  • CONTACT
  • HOME
  • ブログ
  • サイト・デザイン
  • インタラクションデザインとは?関係する5つの要素

2019-03-14

サイト・デザイン

インタラクションデザインとは?関係する5つの要素

こんにちは、モンゴロイドのデザイナー(SMB)です。
近年、デザイン分野において、インタラクションデザインという言葉を耳にすることが増えたと思います。
インタラクションデザインは、UI/UXを考える上で、大切な要素のひとつです。
以前に書いた「【B2B】カスタマージャーニーマップ作成に必要な8つのステップ」では、UI/UXの要件段階にあたる「カスタマージャーニーマップ」について触れましたが、今回は構造段階にあたるインタラクションデザインの基本概念についてご紹介します。

同階層の「情報アーキテクチャ」については、「情報アーキテクチャ(IA)の基礎と基本」でご紹介しています。

▼ 目次

  • インタラクションの概要
  • インタラクションデザインとは
  • インタラクションデザインの5つの要素
    • 01.情報
    • 02.視覚的要素
    • 03.ユーザー接点
    • 04.アクション(操作や行動)
    • 05.レスポンス時間
  • まとめ

インタラクションの概要

インタラクションとは英語の「 inter(相互に)」と「action(作用)」を合成したもので、その基本は「人間が何かアクション(操作や行動)をした時、そのアクションが一方通行にならず、相手側のシステムなり機器がそのアクションに対応したリアクションをする」ということです。

引用:https://ferret-plus.com/929

インタラクションデザインとは

インタラクションデザインとは、「 ユーザーに正しく認知されるか」「 ユーザーの感情を害さないか」を、考え、改善することです。

Webサイトやアプリなどの製品においては、ユーザーがストレスなく目的を達成できるものにすることがインタラクションデザインのゴールです。
ユーザーと製品間のインタラクションは、モーション、美しさ、空間、音などのさまざまな要素が関わっています。
ユーザーが製品を使用した際の体験を形作るUXデザインにも、体験の部分にはユーザーと製品間のインタラクションが関係しているので、インタラクションデザインとUXデザインの間には、共通する部分が数多くあります。

インタラクションデザインの5つの要素

インタラクションデザインに関係する要素は、下記の5つに分類することができます。

01.情報

ボタンやラベルなどのインタラクション特有の情報です。
ユーザーにわかりやすく十分な情報を伝える必要がありますが、負担のかかる情報量や配色にならないように注意することが大切です。

02.視覚的要素

情報をユーザーに伝えるために、タイポグラフィ、画像、イラスト、アイコンなどの視覚的要素でユーザーとの関わりを補助します。

03.ユーザー接点

ユーザーと製品間にインタラクションが発生する時に、ユーザーが使用するものを指します。
例えば、マウスやキーボード、ユーザー自身の指とスマートフォンなどです。

04.アクション(操作や行動)

Webサイトやアプリで、ユーザーがどのような行動や操作を行い、目的を達成するのかを考える必要があります。
そのとき、ユーザーと製品間にインタラクションが発生した時に抱く感情も考慮します。

05.レスポンス時間

インタラクションデザインでは、アクションに対しての応答時間を快適にする必要があります。
例えば、ページ遷移した際に、ページの読み込みスピードが遅すぎると、ユーザーはストレスを感じます。
逆に応答時間が速ければ、システムやWebサイトに対して、ユーザーは快適で信頼できると感じます。

まとめ

インタラクションデザインは、ユーザーと製品の接点において「操作感」や「ユーザーのストレス軽減」などを考えるものです。
製品やサービスを通してよりよいユーザー体験を提供するための、非常に重要な要素であると理解しておきましょう。

モンゴロイドはインタラクションデザインも含めた制作をお手伝いいたします。
是非お気軽にお問い合わせくださいませ。

この記事を読んだ人はこんな記事も読んでいます

UIUXの基本と5つの段階について考える

2018-11-06

UI/UXの基本と5つの段階について考える

サイト・デザイン

2018-11-09

UI/UXで考えるワイヤーフレーム

サイト・デザイン

2018-11-22

情報アーキテクチャ(IA)の基礎と基本

サイト・デザイン
SMB

SMB

筆者 : SMB

次の記事へ
記事一覧へ

前の記事へ
SMB

SMB

CATEGORY

  • すべて (155)
  • サイト・デザイン (42)
  • EC (40)
  • 広告 (35)
  • 解析 (29)
  • ビジネス (8)
  • ブランディング (5)

RANKING

2018-09-26

サイト・デザイン

広告バナーの参考になるギャラリーサイトまとめ

通販の領収書発行~決済別・ポイント払いの注意点~

2018-03-02

EC

通販の領収書発行~決済別・ポイント払いの注意点~

2019-04-18

EC

ECモール徹底比較!7つのECモールの特徴・出店コストまとめ【出店を考えている方向け】

2019-12-23

広告

YouTube広告の特徴や出し方を徹底解説|広告効果をあげるポイントはこれだけ

criteo_eye_1

2018-08-03

広告

これであなたもCriteo通。10分でわかる!広告担当者のためのCriteoで知っておきたい10のこと。

RECOMMEND

2019-11-15

EC

【EC事業者向け】本当に売れるのはAmazon?楽天?二大モール徹底比較!

2019-04-18

EC

ECモール徹底比較!7つのECモールの特徴・出店コストまとめ【出店を考えている方向け】

2018-12-07

広告

Indeed(インディード)有料広告のメリット・デメリット

2018-11-01

EC

【Amazon出品者向け】アマゾンで売れる店になる!売上をあげる方法とは?

2018-07-27

サイト・デザイン

どこが違う!? 「独自SSL」と「共有SSL」のメリット・デメリット徹底比較【2018年7月現在】

  • amazon
  • CVR
  • EC
  • ECモール
  • EC運営知識
  • Facebook
  • Googleアナリティクス
  • Googleタグマネージャー
  • Indeed
  • SEO
  • SNS
  • UI/UX
  • Webデザイン
  • wordpress
  • Yahoo!ショッピング
  • YouT
  • YouTube
  • カテゴリ
  • クリエイティブ
  • サイト・デザイン
  • ダイナミックリターゲティング
  • ツール
  • ディスプレイ
  • デザイン素材
  • ノウハウ
  • バナー
  • ビジネス
  • フレームワーク
  • ブランディング
  • メルマガ
  • 事例
  • 効率化
  • 動画広告
  • 売上UP
  • 広告
  • 広告メニュー
  • 広告効果測定
  • 広告運用
  • 楽天
  • 比較
  • 統計データ・調査
  • 解析
  • 資格
  • 集客
  • 集客.動画
CONTACT

お仕事のご相談はこちらから

株式会社モンゴロイド
〒530-0003
大阪市北区堂島 2-2-23 白雲ビルヂング 1F
Tel 06-6147-5147
  • SASAGAWA HAPPY 40th BIRTHDAY 2018.4.26
  • A-SITE

SITE MAP  PRIVACY POLICY

  • CONTACT
  • BLOG
  • INFORMATION
  • MEMBER
  • SERVICE
  • ABOUT
  • SITE MAP
  • PRIVACY POLICY
  • RECRUIT
Copyright © 2017 MONGOROID inc. All Rights Reserved.
PAGE TOP