フロントエンド技術を学ぼう 2-8.ユーザーインターフェース/インタラクションデザインについて学ぶ

Front-end Developer Handbook 2017を教科書にフロントエンド周りの技術を習得する連載。

www.mojage.club

第18回はPart II: Learning Front-End Devから、
8項のLearn User Interface/Interaction Designを紹介します。

ユーザーインターフェース/インタラクションデザインについて学ぶの説明です。

Sponsored Link

ユーザーインターフェース/インタラクションデザインについて学ぶ

ユーザーインターフェースデザイン

ユーザーインターフェイスデザイン(UI)またはユーザーインターフェイスエンジニアリングは、コンピューター、家電、モバイルデバイス、およびその他の電子デバイスなどの機械とソフトウェアのユーザーインターフェイスを設計し、ユーザーエクスペリエンスを最大限に高めることに重点を置いています。
ユーザインタフェースの設計の目標は、ユーザの目的(ユーザ中心の設計)を達成する観点から、ユーザとインターフェース間の体験を可能な限り簡単かつ効率的にすることです。

参照元:英語版Wikipedia

インタラクションデザインパターン

インタラクションデザインパターンとは、一般的なデザインの問題に対する解決策をドキュメント化する、正規の方法です。
このアイデアは、建築家のクリストファー・アレクサンダー(Christopher Alexander)が都市計画や建築で使用するために導入されたもので、教授法、開発組織とプロセス、ソフトウェアアーキテクチャーやデザインなど、さまざまな分野に適用されています。

参照元:英語版Wikipedia

ユーザーエクスペリエンスデザイン

ユーザーエクスペリエンスデザイン(UXDまたはUEDまたはXD)は、ユーザーと製品の間のやりとりで提供される使いやすさ、アクセシビリティ、および楽しさを向上させることによって、ユーザー満足度を向上させるプロセスです。
ユーザーエクスペリエンスデザインには、従来のヒューマン・コンピュータ・インタラクション(HCI)デザインが含まれ、ユーザーが認識している製品やサービスのすべての側面に対応することで拡張されています。

参照元:英語版Wikipedia

ヒューマン - コンピュータ インタラクション

ヒューマンコンピュータインタラクション(HCI)は、特に人(ユーザ)とコンピュータとの間のインタフェースに焦点を当てて、デザインを研究し、コンピュータ技術を駆使します。 HCIの分野の研究者は、人間がコンピュータと新しいやり方で交流できるよう、人間とコンピュータ、人間とデザイン、両方の相互作用について観察しています。

参照元:英語版Wikipedia

ユーザインターフェースの教科書

最低限以下にリストアップしているテキストを読むことで、必要に応じたユーザインターフェースを構築できる様にしておくことをお勧めします。

Design for Non-Designers(デザイナーではない人の為のデザイン)

Design for Hackers: Reverse Engineering Beauty
(ハッカーのためのデザイン:リバースエンジニアリングビューティー)

Don’t Make Me Think, Revisited: A Common Sense Approach to Web Usability
(考えさせないで)

About Face 3 インタラクションデザインの極意

デザイニング・インターフェース 第2版 ―パターンによる実践的インタラクションデザイン

デザイニング・ウェブインターフェース ―リッチなウェブアプリケーションを実現する原則とパターン