Google UX+理論で作るWebデザイン本日発売
1年がかりで発刊しました
本日2017年9月26日に「UX+理論で作るWebデザイン」を刊行することができました。
小さい会社ながらいくつかの案件と開発をしていることもありなかなか予定どおりに刊行できなかったのですが、ようやく発売することができました。
これも、一緒に書籍を記載していただいた川合 俊輔さん、監修してもらった菊池崇さん、マイナビの角竹さんのおかげです。書籍にはお礼の言葉を入れていないので、ここでお礼いたします。
書籍の特徴
さて、この書籍、見本ページを見ると「あれ?一般的な内容?」と思われてしまうのかもしれませんが、全然違います。
何が違うかというと、すでにあるサイトやデザインをどのように改善すべきかを掲載しています。
マイナビさんから出ている紙の書籍ではイラスト化されていて「こんなサイトあるわけないじゃん!」って思われてしまうかもですが、実際に存在するサイトのデザインやリアルに存在する家電のボタンデザインだったりします。
理論でデザインする
ノンデザイナーでもわかるようにと言うことで基本を丁寧に説明しています。基本というと簡単と思ってしまう方もいるようですが、簡単なものではなく、重要な概念になります。また、概念というと難しく、現場で使えないと勘違いされている方もいますが、UXデザインで重要な”思考”を司る需要な要素になります。
この考え方がなかったり、部署間で認識が異なっていると良い作品はできあがりません。また、感覚やセンスでデザインを組んでも共通の認識を持つことはできません。当然です、その方の感覚でデザインしているのですから、、、。そこで、理論的にデザインをすることが大切になります。
「日本の家電の「絶望的な使いづらさ」について」でも記載されていますが、日本は優れた製品が開発されているのにも関わらず、デザインとなると極端に使いにくくなってしまいます。
この記事を見て「代替デザインが本当に良いのか?」「開発には共通のパーツがあるんだよ」などのコメントを見たのですが、Webサイトでも同じことが言えます。「ガイドラインがあるからー。」
しかし、ガイドラインも汎用性を考えたガイドライン(やパーツ)でないと結果的にうまく行かなくなります。上記の記事は、その結果の現れと考えてもいいかも知れません。
また、代替デザインに関しては、デザインの良し悪しの基準を共通の認識として持つ必要があります。この問題は、理論的にデザインをすることができ、それをみんなで同様に評価できれば解決できます。
”共通認識のための理論がもっと浸透すればいいなー。”ということで、この書籍では理論についても紹介させていただいています。
ハンバーガーメニューやグリーディーナビもご紹介
「ハンバーガーメニューはゴミだ。」「なぜメニュー表示用ボタンの「ハンバーガーアイコン」はダメなのか?」(両方とも2012年のWDE出演のため来日したLuke: ルーク・ロブルフスキー氏の記事を引用)記事を見たことがある方もいると思いますが、なぜか日本のスマホサイトではハンバーガーメニューが利用されているケースが多いため、紹介させていただきました。(上記を読んでない方は、まずは読んでおきましょう)
三本線のものだけ、テキストがある場合、枠がある場合、両方ある場合などの違いも含めて解説しています。
解決策はいろいろとありますが、駄目な理由と改善策のための考え方と最近の王道としてのグリーディーナビゲーションについてもご紹介しています。
UX DAYS TOKYOではできるだけハンバーガーメニューを作らない方法を志しています。
情報設計からはじめよう
ドン・ノーマン氏が、(スマホ市場の拡大で)スマホデザインに目を向けるようになった利点として、パソコンを中心とするそれまでのWebサイトでは情報設計が疎かになっていたが、スマホの面積が少ないことで今までの問題(情報設計、など)に目をむけるようになった。という言葉あります。
日本のサイトも同様に、まずは情報設計を行わなくてはならない場合が多く存在します。そのため、情報設計とはなにか?ユーザーにとってわかりやすい情報設計はどのようにすべきか?など、具体的な例を出してご紹介しています。
5ハットラックス
情報設計を行うメソッドとして5ハットラックスをご紹介しています。これは、監修してもらった菊池が取得したNN/g(Nielsen Norman Group)で紹介している内容です。書籍ではご紹介に留まっていますが、実際に利用することで情報が格段にわかりやすくなります。
ビジネスモデルによるデザインの相違
ビジネスモデルっていうとカッコイイのですが、要はどこでユーザー(クライアント)からお金を頂戴できるか?という仕組みを指します。
よくできたビジネスモデルはやっぱり頭脳の良い経営者が考えることが多いのですが、それらのビジネスモデルをくみ取ってデザインをしなければなりません。当然ビジネスモデルが異なるのでデザインも異なるのですが、それを理解せず、業界ごとに同じようなサイトが存在しているケースが多くあります。
もちろん、ユーザーが蓄積したメンタルモデルがあるため同じようなUIが存在することは正しいですが、必ずしも同じデザインになることはありません。そこで、現状のサービスを比較してビジネスモデルによるデザインの違いをご紹介しています。
ECサイトのUX
ECサイトのUXについても少しだけ紹介しています。これは大きなサイトでないアーティストや作家さんのWebサイト、中小企業のサイトでもよくある悪い例で、なんとなく、どこでもやっているから気にもせずに行っているバットUIです。なぜ駄目なのかユーザー視点で紐解いています。
アマゾンと楽天市場の比較
大手のECサイトとしてアマゾンと楽天市場を比較しています。どっちが良い悪いという話ではなく、ユーザーが実際に買い物をする際にどのように感じるのかを紹介させていただきました。紙の書籍は紙面の都合で画像が数枚カットされているのでちょっとわかりにくくなっているのですが、実は、私が実際にスマホで靴を購入するにあたり感じた点を掲載しています。
この問題は、ユーザビリティテストをしたからと言って必ずしも表に出てくる問題ではなく、プロ視点があることで表面化される問題です。そういった意味ではフィーリスティック調査の必要性を感じました。
WDEでも対応可能です
最終的に本だけでの宣伝でなく、仕事の営業してしまってしまいますが、きちんとUXを勉強したUXのプロである菊池がフィーリスティック調査を行うサービスも行っています。実際に改善しKPIが2〜3倍になった事例は多く存在します。また、法人研修なども行っていますので、ご興味のある企業様は合わせてご検討ください。
書籍詳細
最後に書籍の詳細です。電子書籍も9月中には発売予定で、同じ金額の¥ 2,689です。いち早く読みたい!という方は紙の書籍をご購入ください。
また、感想などのレビューページを予定しています。紙の書籍を購入した場合でも、レビューに協力いただければ電子書籍もプレゼントいたします。
【内容】
- 第1章 デザイン思考とWebデザイン
- 第2章 WebデザインとUX
- 第3章 ビジネスモデルのデザイン
- 第4章 サイト構成のデザイン
- 第5章 情報のデザイン
- 第6章 ユーザー導線のデザイン
- 第7章 画面設計のデザイン
- 第8章 ユーザー操作とモバイルのデザイン
- 第9章 ユーザーの感性に訴えるデザイン
書籍プレゼントキャンペーン
30件ごとにFBでもしかしたら書籍がもらえる?
本日から10月一杯まで書籍が当たるキャンペーンを実施いたします。
FBで3名の方に「この記事の投稿」をメンションを送ってください。
この書籍を読まれるといいな。と思われる同じチームの人などが最適かと思います。
30件の投稿の中から1名様(1冊)をプレゼントいたします。
なお、紙の書籍は10冊(300投稿)までを予定しています。
また、カットがされていない電子書籍への変更も可能です。
応募方法
- UX DAYS TOKYOのFBで、書籍を読まれると良いなと思う方2名以上にメンション(お友達に@をつける方法)をつけて、次の「https://uxdaystokyo.com/articles/ux-theory-book/」をお知らせください。
抽選方法
- 30投稿ごとに1冊の書籍をプレゼントいたします。
- 当選者にはダイレクトメールをさせていただきます。
- 電子書籍の場合はkindleのメールアドレス、紙の書籍はご住所をお知らせください。
- 当選者は、匿名でUX DAYS TOKYOのFBで発表いたします。
みなさまのご応募お待ちしています。