2011年の6月、出たてに買ってパラパラ眺めて積んでた。ようやく読んだのでメモ。
概要についてはさほど説明要らないかな。タイトルの通りのことを書いてる本。
= 読み方 =
- 「たまに引っ張り出してきても良いかもしれないけど、基本的にはもう読まない」という程度まで
- 逆に、ソラかつドヤ顔でこの内容を喋れる程度に習熟することは目指さない
= 気になったポイントメモ =
- ちょっと前のスタンダードをまとめた感じ。AndroidのUIガイドライン、今はもうちょいまともだよね
- さほど(改めて)読むべきことは無いかな
- webOSのUIガイドラインあたりも載ってるあたりが洒落てていいね
- ここではAndroid標準のUIガイドラインの出来が著しく悪いという話を書いてあるけど、本が出た後に割と改善されてきた箇所なので割り引いて読むのが良いね
- ビジュアルスタイルの項(p.34-p.39)は、そこそこ「どんな種類のUIにしたい?」という問いへの答えを楽にしてくれそうなので良い
- ワイヤーフレームとデザインプロトタイプの違い: ワイヤーフレームは色も細部描き込みもしていないもの。デザインプロトタイプを提示するタイミングが早すぎる構成/コンセプト確認からビジュアルデザイン議論へと発散してしまう。ここへ落ち込まないように目的をはっきりさせるためにワイヤーフレームおすすめ
- p.56に載ってる配色サイト/アプリ一覧は割と使えるかも。色弱シミュレーションとか 軽くCIに組み込んでおくと良いかもという感じする
- ボタンのグラデーションについて
- 始点と終点の色相は同じ、角度を90度(上下)として明度差により立体感の強弱をつける
- 押し込まれた状態の表現には、始点と終点を逆にして明度を少し下げる
- Androidでの9patchについて
- 左右の拡大場所は複数指定することも出来る
- たぶん余った領域分だけ均等に伸びることになる
- アイコンデザインについて
- モチーフの種類は主に4つ
- 類似アイコン
- アクション伝える向き
- 例アイコン
- シンボルアイコン
- 記号アイコン
- シンボルとの違いは、歴史的や伝統的に意味が一般化されているもの(&意味と記号に図形的な関連性が無いこと)
- キーワード連想などをもとにモチーフを選び、組み合わせる(ただし多く組み合わせるといみふなので2つぐらいに絞る)
- 絵を描く必要があるなら、工業製品などの人工物をモチーフに選ぶのが楽。素材の感じを表現出来るような描き込みを頑張る
- 丸なアイコンよりも四角なアイコンを小さめに作るガイドラインの意味: 四角のほうが大きめの印象となるため(あー、そう言われれば当たり前だわ)
- PowerPointでワイヤーフレームを作る話ほか。2.3あたりのガイドラインベースなのでちょいきつい感はあるけど手軽ではあるかな。4.0版どこかに無かったっけね
- デザインの理論的や脳での認識的な話が時折絡んでくるんだけど、あまり馴染み無いので読んでて面白い
- 文章から受ける全体の印象(別にdisってるわけでもなんでもなく、ただの印象)として「TLによくいる人が喋ってる感じ」。typoは少々気になるけど気にすると読み進むスピード落ちるので無視。別に論文じゃないので「〜と思います」連打なのも目くじら立てる場所じゃないやね
- あんまり技術的に正確な言葉遣いではないので、雰囲気でカバーするの大事(アルファチャンネル付きのいわゆるフルカラーなPNGをPNG-32ではなくPNG-24としてるあたり、多分Photoshop度の高い方が書いてるんだろうなという感じ)
- Photoshop/Illustratorフェーズは、実際に独力でアイコン作成とかをやろうという時までは読まなくてよさそう。ただ、関連するガイドライン的な部分は抑えておいたほうがいい
- GIMP/Inkscape用のテンプレもあったり、一応の作成方法解説もあるので、実際作る時には活用したい
- http://www.shuwasystem.co.jp/support/7980html/2976.html にテンプレを固めたzip(78MB)がある(解凍パスは本のp.2にある)。ちなみにこのblogエントリはテンプレファイルのダウンロード中に書いた
- 「気になったポイントメモ」にも書いたけど、Android標準のUIガイドラインの出来が著しく悪いという話については本が出た後に割と改善されてきた箇所なので割り引いて読むのが良い
- デザイン指針の流行り廃りについては本文中で触れられてる通り。PUMA Phoneってあったんだーというのをそもそも知らなかった
