Web Design

書評「だからそのデザインはダメなんだ」で適切なUIデザインを考える


みなさんこんにちは、mayukouです。
最近では、webデザイナーというくくりが、
「フロントエンドエンジニア」や、「UIデザイナー」などさまざまな表現に分かれてきているようです。
これまで私のスタンスは、「webデザイナー」だったのですが、
今回のデザインの本を読んだら、UIデザインを真剣に考えなければ!
と感じるようになりました。
それぞれのデザインやレイアウトには、ちゃんと理由がある必要があるのですが、
頭でわかっていても…感覚的にデザインを済ませてしまうことがあります。
でもwebサイトを見る人にとって、わかりやすく伝えることが
できるのが、UIデザイナーだと思いました。

今回は、そんなUIデザインを学べる本をご紹介します。

スポンサードリンク

そもそもUIデザインとは?

UIの略は、「User Interface(ユーザーインターフェース)」です。
Interfaceとは、「接点、接触面」という意味で、
ユーザーの目に触れる部分で使用する部分は全てUIと見なされます。

UIデザインとwebデザイン

UIデザインが見やすさや操作性を作るのに対し、
webデザインは、色味などの視覚的なデザインを作るようです。

今回購入した本のタイトルは、
「だから、そのデザインはダメなんだ」

ちょっと挑発的でネガティブなタイトルですが、
中身は、UIに関して真面目に学べることがたくさんあります。

53-dakara
この本が書店でふと目に止まりパラパラと開いてみたら、
図解でわかりやすく結構目からウロコな内容だったので、
買うことに決めました。
見開き2ページで、デザインの悪い例と、改善した良い例が紹介され、
なぜそのデザインに改善されたかの説明があります。
その説明が、説得力のある書き方で、
今後のモバイルやタブレットにも対応できるwebサイトデザインに活かせる内容になっています。

事例として、コーポレートサイトやメディアサイト、ECサイト向けのデザインが多い印象を受けますが、
どのwebデザインにも当てはめてデザインを活用することができそうです。

私の場合、会社の運営しているネットショップや
ブログのリニューアルに参考にできそうだと感じました。

とくに便利だと思った事例をご紹介します。

ブログをなどメディアサイトに最適な見やすいデザイン

54-dakara-blog

見出しを種類別に色分けして、どんな内容かがわかりやすくなりますね。

ネットショップ会員登録などのデザイン

55-form

登録のステップがわかることで、登録の先がどうなるかという不安がかき消されますね。

 

ファーストビューのデザイン

56-scroll

ファーストビューに、スクロールボタンがあることで、次にどういうステップをとったらいいかがわかりますね。

 

こんな感じで、事例がたくさん紹介されます。
レイアウトやコンテンツデザイン、ユーザビリティなど色々と考えさせられます。

最後に

いかがでしたか?UIデザインについて考えさせられる本でした。

これを読めば、より適切なUIを作れる気がします。

気になる方は、ぜひチェックしてみてください。

投稿者プロフィール

mayukou
mayukou
Webデザイナー修行中のmayukouです。webデザインのお仕事を始めてなんとか約6年が経ちました。とにかく技術を高めようと思っています。仕事で得た知識やお役立ち情報をご紹介いたします。宜しくお願いします。水彩画を勉強中です。趣味は音楽鑑賞(洋楽)、料理、読書、ブログです。
詳しくはこちら

Twitterをフォローしていただくと、最新情報を見逃しません♫

関連記事

  1. CSS

    レスポンシブ対応!CSSで二重線のボーダーボックスを作る方法

    みなさんこんにちは、mayukouです。先日、ホームページを作る際に…

  2. jQuery

    カードレイアウトにもオススメ!Masonryプラグインの使い方

    みなさんこんにちは、mayukouです。今回は、今流行りのカードレイ…

  3. CSS

    一手間でおしゃれに。CSSでマテリアルデザイン風のボタンを作る方法

    みなさんこんにちは、mayukouです。ランディングページやネットシ…

  4. jQuery

    横幅いっぱいに表示可能なスライダーのjQueryプラグイン 「Skippr」が便利!

    みなさんこんにちは。11月に入り寒くなりましたね。今年もあと2ヶ月と…

  5. 書評

    超クール!webマーケティングが学べる「沈黙のwebマーケティング」を読みました

    みなさんこんにちは、mayukouです。物を買いたいと思ってgoo…

  6. Web Design

    ブログ作りの参考に♬ジャンル別オススメwordpressテーマを考察してみました

    皆さんは、wordpressのブログを持っていますか?ブログを持ってい…

コメント

  • コメント (0)

  • トラックバックは利用できません。

  1. この記事へのコメントはありません。

CAPTCHA


メルマガを購読する

Web Design Cafeの メルマガを購読する

更新情報や、お知らせ、お得情報をゆる〜く配信(月1程度)。


最近の記事

instagramもやっています

facebook更新中!

スポンサー

こんなサイトも作ってます。

  1. Photoshop

    画像からフォントを探してくれる!Photoshopのマッチフォントが素敵。
  2. 日記

    2015年の振り返りと今年の抱負
  3. Web Design

    メニューアイコンに最適!webフォント、Font Awesomeの簡単な使い方
  4. Tutorial

    簡単!photoshopでスタンプ風のかすれた表現をする方法
  5. Web Design

    カフェのサイトをwordpressでリニューアル制作しました。その時の覚書
PAGE TOP