デザイン
更新日: 2023/11/30
UIとは?ユーザビリティを向上させてユーザーから好印象を持たれよう!
イエローちゃんイエローちゃん
ピンクちゃんどうしたのー?
UIってなぁに?
あーUIかぁー
じゃあ今日はUIについて説明していくね!
UIとは?
UIとはUser Interface の略で、主にWebサイトやアプリケーションのデザイン性の高さについて言及するときに使われることが多いよねー
ユーザーっていうのは利用者、インターフェースっていうのは接点って意味だよ
Webサイトやアプリケーションとユーザーをつなぐ接点、つまりサイト上の画像や動画やフォントなど、ユーザーが認識したり操作したりするすべての要素のことを言うんだ
読みづらい文字や聞きづらい音や、どこになにがあるかわからないデザインは、使いづらくて困るよねー
UIを意識したデザイン設計は、Webサイト構築においてすごく重要なんだよ!
UIの重要性ってなに?
ユーザーがそのWebサービスやアプリケーションをまた使いたいって思うのはどんなときだと思う?
そうねぇ・・気に入ったときかしら
そうだよねー好きになったらWebサイトをまた見たいと思うし、そのアプリを使って調べたら遊んだりしたくなるよねー
じゃあどうして好きになると思う?
使いやすかったりわかりやすかったり、かわいかったりするからかしら!
そうだね、つまりユーザーに好印象を持ってもらうことが重要なんだ
ユーザーに好印象を抱かれるために必要なのが、UIを意識してユーザビリティを高めることなんだよ
UIはユーザーとサービスの接点だから、UIを意識することが読みやすさやわかりやすさに繋がるんだよねー
UIとUXの関係性について知ろう!
UIとよく似た物としてUXっていうのがあるんだよねー
Webデザインの話題になると、どちらも必ず登場するキーワードだよ!
この2つはよく似ているけど違っていて、でもどちらもWebサイトに欠かせないものなんだ
UIとUXについて詳しく説明していくね
UIとUXの違いってなに?
UIもUXも、使いやすくわかりやすいWebサイト構築に欠かせないものだよ
UIは色や形や音、配置場所なんかによってユーザーが見やすいための工夫や要素のことなんだよねー
インターフェースっていうのは境目や接点って意味で、Webサービスとユーザーを繋ぐ部分だよ
UXはUser Experience の略で、ユーザーがWebサービスやアプリケーションを通して得る体験のことなんだよねー
エクスペリエンスっていうのはまさに体験って意味で、どう感じたかどんな印象を持ったかなど、ユーザーに残る感覚だよ
UIを改善してUXを高めよう!
UIとUXは違う物なのに、どうしてよく一緒に使われるのかしら?
優れたUIだとユーザー体験(UX)が高まるし、使いにくいUIだとユーザー体験(UX)に悪影響が出るよね
UIとUXにはそういった相関性があるから、UXを改善するためにWebサイトやサービスのUIを常日頃から意識して改善するのが重要なんだよ!
優れたUIを3つご紹介!
最後に、人気のあるUIを3つ紹介するね
優れたUI1.Relux
Web系で優れたUIとして挙げられるのは、Reluxだね
Reluxは高級ホテルのプラットフォームで、スマートフォンのUIが綺麗なことで有名だよ
上画像が実際のReluxのスマートフォンでの表示なんだけど、ホテルの写真を画面いっぱいに使っているUIなんだよ!
他に、こういう画面いっぱいになるまで写真を表示しているサイトは少ないから珍しいUIなんだけど、高級なホテルの一覧だから綺麗な一覧で表示できてるよね!
優れたUI2.iphone
2つ目に紹介する優れたUIは、iphoneだね
iphoneは、みんな知ってるApple社から出ているスティーブ・ジョブズが作ったスマートフォンだよね
UIはUser Interfaceの略で、ユーザーが接する全てのものだから、iphoneのデザインもUIとして考えるべき事例の1つだよ
そんなiphoneのUI開発の逸話を紹介するね
当時のスティーブ・ジョブズはできる限り小さい携帯を求めていたんだって。
で、エンジニアが持ってきたiphoneを水槽に入れて、気泡が出てきたら「気泡が出るっていうことは、まだ小さくできるよね?」ってエンジニアを一蹴して再度、UIを作り直させたっていうのが有名な話があるんだよね
それはエンジニアの心が折れちゃいそうね、、。
優れたUI3.スプラトゥーン
最後に紹介する優れたUIは、スプラトゥーンだよ
任天堂が作る代表的なFPSゲームだね!
スプラトゥーンは、ゲーム内で使用するフォントから自作してて、かなりこだわったUIになってるんだよね〜
デザイナーの開発秘話が語られてる記事があるから、それを読むと「どれだけUIにこだわっているのか」がわかるよ!
まとめ
最後に、UIについてまとめておくね!
まとめ
◆UIとは User Interface の略で、ユーザーとサービスの接点のこと
◆UIを意識してデザイン設計することが重要
◆よく似ていてUIに大きく影響するUXも意識すべき
UIについて少し理解が深まったかな?
ユーザーの視点に立ってUIを意識してみるわ!
イエローちゃんありがとう
またなんでも聞いてね!
イエロー
インフルエンサーマーケティングやSNSマーケティングな女の子。まだまだ勉強中なので、これから他のマーケティング手法も頑張って勉強中。
最新の記事一覧
AISCEASとは?現代社会に即した消費者行動モデルを解説!
マーケティング
BANT情報とは?成約に必要な情報を効率よく集め、適切に把握しよう
マーケティング
マネジメントとは?意味・求められるスキルまで徹底解説!
ビジネス
ギグエコノミーとは?4つの成長要因、事例、今後の課題を解説!
ビジネス
イグジットとは?5つの具体的方法と事例を交えて解説!
経営・会計
ランチで許せる徒歩距離は徒歩5分が9割?!データから見る飲食店の出店計画!
アンケート・調査結果
アジリティが必要な理由とは?業界トップの企業を参考に解説します!
ビジネス
エビングハウスの忘却曲線とは?図と具体例でわかりやすく解説!
ビジネス
PEST分析とは?自社を取り巻く環境を分析しよう
マーケティング
メールマーケティングとは?得られる効果や主な手法を詳しく解説!
マーケティング
コミュニケーションデザインとは?重要な理由や取り組み方を紹介!
デザイン
プラットフォームとは?メリットやビジネスの成功事例を3つ解説
ビジネス
スクイーズアウトとは?具体的手法や目的を事例を添えて徹底解説!
経営・会計
キャリアデザインとは?思い描く未来を実現させよう!
ビジネス
アドボカシーとは?活動の具体例を添えて注意点も解説!
ビジネス
アクセシビリティとは?事例やWebサイトの改善ポイントを紹介!
デザイン
PMFとは?検証方法・具体的な実施内容についても解説!
ビジネス
デューデリジェンスとは?目的・種類を徹底解説!
経営・会計
コンジョイント分析とは?3ステップの分析手順も解説!
マーケティング
定量分析とは?メリット・デメリットについても徹底解説!
マーケティング
最新の記事一覧
AISCEASとは?現代社会に即した消費者行動モデルを解説!
マーケティング
BANT情報とは?成約に必要な情報を効率よく集め、適切に把握しよう
マーケティング
マネジメントとは?意味・求められるスキルまで徹底解説!
ビジネス
ギグエコノミーとは?4つの成長要因、事例、今後の課題を解説!
ビジネス
イグジットとは?5つの具体的方法と事例を交えて解説!
経営・会計
ランチで許せる徒歩距離は徒歩5分が9割?!データから見る飲食店の出店計画!
アンケート・調査結果
アジリティが必要な理由とは?業界トップの企業を参考に解説します!
ビジネス
エビングハウスの忘却曲線とは?図と具体例でわかりやすく解説!
ビジネス
PEST分析とは?自社を取り巻く環境を分析しよう
マーケティング
メールマーケティングとは?得られる効果や主な手法を詳しく解説!
マーケティング
コミュニケーションデザインとは?重要な理由や取り組み方を紹介!
デザイン
プラットフォームとは?メリットやビジネスの成功事例を3つ解説
ビジネス
スクイーズアウトとは?具体的手法や目的を事例を添えて徹底解説!
経営・会計
キャリアデザインとは?思い描く未来を実現させよう!
ビジネス
アドボカシーとは?活動の具体例を添えて注意点も解説!
ビジネス
アクセシビリティとは?事例やWebサイトの改善ポイントを紹介!
デザイン
PMFとは?検証方法・具体的な実施内容についても解説!
ビジネス
デューデリジェンスとは?目的・種類を徹底解説!
経営・会計
コンジョイント分析とは?3ステップの分析手順も解説!
マーケティング
定量分析とは?メリット・デメリットについても徹底解説!
マーケティング