WEB制作関連

WEBサイト心理学|アフォーダンス理論

アフォーダンスとは、もともと知覚用語だったものをドナルド・ノーマンがインターフェイスの用語として利用したことで定着した言葉です。 どういうことかというと例えば人は目の前にドアノブのついたドアがあれば押すか引いて開けようとするし、指を引っ掛けるくぼみがあればスライドさせて開けようとしますよね。

このように過去の体験などにもとづいて行動が結び付けれられることを「アフォーダンス理論」といいます。これをWEBサイト上に置き換えてみるとどうでしょう。

例えばテキストに下線が引かれている、ボタンに立体感があることでユーザーは過去の経験によりそこにリンクやアクションがあると認識します。

なのでECサイ トやサービスサイトなどユーザビリティが重要なサイトの動作や仕様を決める際にはYahoo!・Google・Amazonなどといった多くの人が利用す るサイトを参考に設計するといいと思います。

多くの人を魅了する手品にもアフォーダンス理論は取り入れられています。 例えば帽子からたくさんの鳩がでてきたら驚くのはみなさんが今までの体験で帽子にそんなにたくさんの鳩が入るわけないとわかっているからで、これが中の見えない穴ぐらからたくさんの鳩が出てきても驚きませんよね。

このようにアフォーダンス理論を逆手にとって新しい体験を与えることで驚きや感動を与えることもできます。Flashを用いたプロモーションやエンタメのサイトであればこういったことを利用してみるのもいいでしょう。

余談ですがapple社のUIの考え方は自分たちがつくりあげたものがスタンダードになるという信念でつくられていると聞いたことがあります。だからiPhoneやiPadといった新製品はユーザに驚きと感動を与えられるんですかね。

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

  • このエントリーをはてなブックマークに追加
  • follow us in feedly

関連記事

  1. WEB制作関連

    フリーで使える高品質な紙のテスクチャー40個まとめ

    くしゃくしゃにしたものや古びた感じ、方眼、ノート罫など紙のテクスチャを…

  2. WEB制作関連

    どこまでも横に展開していきそうな25個のWEBサイト

    横スクロールで展開するWEBサイトのまとめです。…

  3. WEB制作関連

    思わず買いたくなるECサイトのデザイン30選

    ECサイトのデザインの際に参考にしたいWEBサイトのまとめです。…

  4. WEB制作関連

    テクスチャ使いが秀逸な35個のWEBサイト

    効果的なテクスチャの使い方で世界観をつくりだしているWEBサイトのまと…

  5. WEB制作関連

    レトロなデザインのWEBサイトまとめ

    レトロな雰囲気を持ったデザインのWEBサイトのまとめです。 (…

  6. WEBディレクターズマニュアル

    WEBディレクターの為のEXCEL術(3)作業が捗る小技10選

    WEBサイトを制作していると通常のワークフローの他にも原稿の作成やデー…

  1. 話題・トレンド

    Google…etc 2012年エイプリルフールネタのまとめ。
  2. WEB制作関連

    EVERNOTEの新機能「Site Memory」実装編
  3. Design Items

    自然にマッチしたチェーンロック
  4. 話題・トレンド

    Photoshopでクッキーをつくる。
  5. 話題・トレンド

    これがアップル20年の進化だ。
PAGE TOP
Top