こんにちは。
ARCHETYP代表の齋藤です。
今回のテーマは、UIデザインとWebデザインの違いです。
※UIとUXの違いの記事などは見かけるので。
今更何をと思われるかもしれないのですが、
業界ならまだしも、UIという言葉はまだまだ一般的にはメジャーな言葉ではないかと思います。
そこで、UIデザインが何を指すか、そしてWebデザインとの違いは何なのかについて、考えてみたいと思います。
UI=ユーザインタフェース
ユーザとの接点になる部分ですね。
ユーザインタフェース (英:User Interface, UI) は、機械、特にコンピュータとその機械の利用者（通常は人間）の間での情報をやりとりするためのインタフェースである。ユーザインターフェース/ユーザインタ(ー)フェイス/ユーザーインターフェ(イ/ー)スなどの表記ゆれが見られるが、本記事では「ユーザインタフェース」で統一する。ユーザインタフェースは以下の手段を提供する。
- 入力 – ユーザーがシステムを操作する手段
- 出力 – ユーザーが操作した結果システムが生成したものを提示する手段
wikipedia先生によると、こんな感じです。
簡単に言うと機械と人間の接点でしょうか。
パソコン、スマホ、ゲーム、銀行のATM、エレベーターのボタン、電卓や、オーディオ機器などなど。
今現在も多くのコンピュータとの接点がありますが、今後も増えて行くことになるでしょう。
そのユーザーインターフェースをデザインすることがUIデザインです。
よってWebデザインとの大きな違いは、パソコンやスマートフォンなど「インターネットにつながっているデバイス」ではなくとも発生するということでしょうか。
一般的に、ボタンなどの機能する部分をUIと呼ぶことが多い気がします。
具体的には、エレメント等の
- ・位置をどうする？
- ・色をどうする？
- ・形をどうする？
- ・大きさをどうする？
- ・動き（インタラクション）をどうする？
などなど、多角的に「どうする？」を検討し、デザインに落とし込んでいく作業になるかと思います。
機械と人間をつなぐ役目ですから、当然、様々な接点を考慮しなければなりません。
操作を間違いにくい場所や大きさにしてほしいし、押したら押した反応がほしい。
このような「機械側は認識できているものの人間側がわからない」ことをデザインによって解決、
もしくはスムーズに使えるよう設計することが、UIデザインだと思います。
見た目のデザインも重要ですが
特に重要になってくるのがインタラクションだと思っています。
例えば、押されたボタンが光る、音がする、形や色が変わるなど。
操作に反応することにより、人間は操作が間違っていないことに気づきやすくなります。
ATMや、エレベーターなんかもそうですね。
反応が複雑であっても混乱を招きますし、簡素過ぎてしまうとわかりづらい。
ここを突き詰めることが、よりスマートなUIデザイン実現につながるのではないかと思います。
一方、WebデザインはUIだけではなく、グラフィックのデザイン要素や情報設計なども含まれてきます。
現時点でデバイス等の制限はありますが、 UIデザインとは違った意味で、デザインの含む領域は広いです。
Webデザインで必要な要素については、様々な文献があるのでここでは割愛しますが、
弊社でのデザイナーの領域としては、
- ・デザインリサーチ
- ・情報設計
- ・UX設計
- ・UI設計
- ・色彩設計
- ・タイポグラフィ
- ・デザインコンセプト策定
- ・ビジュアルデザイン
- ・フォトディレクション
- ・デザインガイドライン作成
あたりでしょうか。
マークアップやJSのコーディングなんかもWebデザインの領域としている会社さんも多いですね。
簡単にまとめると
- UIデザインは、コンピュータの世界だけにとどまらない。
- Webデザインは、UIデザインがほぼ発生する。
という感じなので、Webの世界とは切っても切り離せない関係といえます。
個人的には、みなさんの考察もお聞きしたいので、ここでもFacebookでもコメントもらえたりしたら嬉しいです！
※リアルでお会いした時に熱く語ってもらっても結構です 笑