
- 中古
- 店舗受取可
- 書籍
- 書籍
- 1211-04-00
UIデザインの教科書 新版 マルチデバイス時代のインターフェース設計

定価 ¥2,618
990円 定価より1,628円(62%)おトク
獲得ポイント9P
在庫あり
発送時期 1~5日以内に発送

店舗受取サービス対応商品
店舗受取なら1点でも送料無料!
店舗到着予定
2/26(水)~3/3(月)

商品詳細
内容紹介 | |
---|---|
販売会社/発売会社 | 翔泳社 |
発売年月日 | 2019/01/21 |
JAN | 9784798155456 |


店舗受取サービス
対応商品
店舗受取なら1点でも送料無料!
さらにお買い物で使えるポイントがたまる
店舗到着予定
2/26(水)~3/3(月)
- 書籍
- 書籍
UIデザインの教科書 新版
商品が入荷した店舗:0店
店頭で購入可能な商品の入荷情報となります
ご来店の際には売り切れの場合もございます
オンラインストア上の価格と店頭価格は異なります
お電話やお問い合わせフォームでの在庫確認、お客様宅への発送やお取り置き・お取り寄せは行っておりません
UIデザインの教科書 新版
¥990
在庫あり
商品レビュー
4.3
11件のお客様レビュー
画面設計の基本が知りたくて本書を手に取りました。デザインと言う響きから、デザイナーが読むものと先入観を持っていましたが、その考え方が、間違っていることに気付きました。
Posted by
UI/UXのデザインに携わりたい人におすすめの1冊です。 人間の認知特性などを踏まえて学べるので「確かに!!」「なるほど…」と思うポイントが多くあります。 タイトルを見ると複雑で難しそうだと感じるかもしれませんが、読んで損はないと思います! デザイン学科3年
Posted by
<本のタイトル> UIデザインの教科書[新版] マルチデバイス時代のインターフェース設計 <本の紹介> 2週間ぐらい前に「Web制作者のためのUXデザインをはじめる本」を読みましたが、 今日紹介する本は、UIデザイン部分の具体的な中身に踏み込んだ内容になります。 <感想・気づ...
<本のタイトル> UIデザインの教科書[新版] マルチデバイス時代のインターフェース設計 <本の紹介> 2週間ぐらい前に「Web制作者のためのUXデザインをはじめる本」を読みましたが、 今日紹介する本は、UIデザイン部分の具体的な中身に踏み込んだ内容になります。 <感想・気づき> ・スティーブ・ジョブズが言うには 「デザインはどう見えるか(how it looks)ではなく、どう機能するか(how it works)」 ・デバイスごと入力手段の違い ーPC:マウスで操作。細かい操作が可能、縦スクロールに強い 最大の特徴はホバーが使えること ※ホバー=マウスオーバー(クリックしなくてもカーソルを合わせると対象が変化する) ーSP:指で操作する為、各パーツがある程度の大きさが必要。細かいパーツの選択は神経を使う。 タッチパネルデザインではホバーが使えないので、目視で対象の選択可否を判別できることが重要なポイントになる ーTV:リモコンの十字キーで操作、もしくは音声入力が大半。 十字キー操作では、いまどこにフォーカスがあるのかパッとわかることが何より重要。 なぜならPCやSPのように、直接対象をクリックすることができないため。 またフォーカス移動も「縦方向だけ」「横方向だけ」のように1方向に限定すべき。 ・デバイスごとの画面の違い ーPC:ブラウザのサイズを自由に変えられる ー他:すべてフルスクリーン表示。 ・Webサイトと専用アプリの違い ーWebサイト:Webブラウザで利用。マルチデバイスの展開が容易。 OSの違いによる環境差異が小さい。同時に複数ブラウザを起動できる。 最も大きな特徴は「URLと不可分に結びついている」ため切り離せないこと。 また操作スピードは遅く、インタラクションも乏しい。 ー専用アプリ:OSにインストールして利用。動作が早く、操作が軽快。 データ通信量がWebサイトの場合と比較して少量で済む デメリットはサービス毎に都度インストールが必要であり、 OSごとに異なるプログラミング言語で開発する必要がある。 またハードウェアやOSの差異がUIのデザインに大きく影響を及ぼす。 ※なお最近はPWA(Progressive Web Apps)という技術を用いると「アプリのように動くWebサイト」を開発することもできるみたい。 ・テキスト・画像の違い ーテキスト:基本となるデータ形式。原則どんなOSやデバイスにも最適化されて表示可能。 テキストを画像で貼ると、検索もできないし、画質も粗いのでオススメしない。 ただし下にも書くとおり、あえてテキストを画像で貼るほうがよいときもある。 ー画像 :解像度の影響を受けるが、それ以外については環境間の差異が無く同一に表示できる。 テキストだとOSやデバイス毎に自動で(よかれと思って)最適化されてしまうので、 あえて最適化されないように画像でテキストを用意するケースもある。 ただわざわざそうまでしないといけない理由がある場合にのみやるべきである。 ・HTTPとHTTP/2の違い ーHTTP :1つのリクエストに対して1つのレスポンスを返す ーHTTP/2:複数のリクエストに対して複数のレスポンスを非同期で返す。HTTPSが必須。 ・Webサイト内の現在地を理解するため、5つの方法で「表現の差別化」を行う ー太さ :文字の太さで現在地を表現する。太字が現在地、細字がそれ以外の場所。 ー色 :文字の色で現在地を表現する。明度差、無彩色(白黒)/有彩色(カラー)など。 ー大きさ:文字や対象の大きさで現在地を表現する。TVと相性がいい。 ー背景 :背景に色を敷くことで現在地を表現する。 ー目印 :帯やアイコンなど、目印や装飾を添えることで現在地を表現する。 ・トップ/一覧/詳細の構成 だいたいのサービスはトップページ、一覧ページ、詳細ページの3構成になっている。 サービスによってはトップページ=一覧ページの場合もある。 一覧ページのインタフェースの良し悪しが、ユーザーが望んだゴールにたどり着けるかのカギ。 とはいえ一覧ページで工夫できることは、基本的には次の3つしかない。 絞り込み:何らかの制約をかけて絞る 並び替え:何らかの軸でソートする 切り替え:表示件数を変えたり、表示方法を変えたりする(リスト化/ブロック化)
Posted by