↑イメージ画像は以前jQuery Mobileで作ったスマートフォン用壁紙サイトです。
iPhoneに埋め込んでる点は気にしないでくださいw
Xperia Ray楽しいです☆
ってただ遊んでるだけじゃないんですよ！！
…ということで、
ちっこいスマートフォン、Xperia Rayでサイトやアプリをいろいろ見て気になったこととか思ったことを、今後のデザインに活かすために忘れないうちにメモしておきたいと思います♪
あくまで私の主観ですのであしからず…。
(1)画面の一番下に固定でボタンを出す場合は横5個までならちゃんと押せる
→一番下だと指を垂直にぴたっとクリックできるので5個ぐらいまでなら平気。
(2)一番下固定以外ならよほど縦に長いボタン（もしくはクリックできる領域が周辺にない状態）じゃない限り5個並べたら厳しい。せめて横4つまで。
→指の位置的にちょい斜めに押すことが多いし、上下もクリックできるエリアであればそこをさけるようにうまいこと狙わないといけないので4つぐらいまでじゃないと上手く狙えなくてイライラ
(3)ようはAndroidのHOME画面のアイコンの配置、数までぐらいで限界。
→これより多かったり、ボタンが小さかったりするとすごく使いにくい
(4)横に4つ並べるならできるだけ高さのあるボタンにする。もしくは上下にボタンやリンクがない状態にする
→横に4つ、高さもないボタンは致命的に押しにくい。
(5)ボタンの直下にテキストリンクが出るようなレイアウトには絶対しない。間違えて押してイライラする確率高し。
→ソーシャルゲームしてみて思った。【次へ】ボタンの下に【ここを出る】みたいなテキストリンクがくっついてたりしてるような画面がいくつもあって、間違えて何回も押した。これはかなりストレスだった…
(6)見出し類は絶対ブロックごとまとめてクリックエリアにする。
→一行テキストの見出しがずらずら並んでいるのは本当に押しにくい…！2行ぐらいにして、テキストの上のブロックエリアごとクリックエリアにするのは絶対やっとこうと思った。
(7)サイトに関しては、サクサクスクロールできるからファーストビューに全部押し込むのとかあんまり意味ない気がする。
→これまでの携帯サイトよりサクサクっと下まで進めるから、ファーストビューにそんなに情報やボタン詰め込まなくても、画面大胆に使って多少デカデカとなっても押しやすい、読みやすいデザインにした方がいいんじゃないかと思った。
逆に詰め込み過ぎ、ボタン押しにくいサイトのほうが一瞬で離脱する。リンクが押しにくいととにかく次のページを見る気がしない。
(8)アプリに関しても一画面に機能詰め込みすぎない。ボタンは大きく、必要最低限のものだけ配置する
→機能満載アプリはそもそもなにをさせたいのか意味不明になっちゃってる。1画面に1機能を徹底する。
(9)近くで見るせいか、全体に白が多すぎるとまぶしい。
→まっしろ背景だとすごくまぶしい。少しグレーかベージュにしておきたいところ。
(10)白地に黒文字より黒字（もしくは彩度の低い色）に白抜き文字のほうが読みやすい
→人＆機種によるかもしれないけど私＆Rayだとそうだった。
(11)iPhoneサイトのデザインを集めたサイトとかをPCで見るのと、実際にスマホで見るのは受ける印象が結構違うのでギャラリーサイトも実機で確認必須。
→ギャラリーサイトで見てていいなー！と思ったサイトも実際に使って見ると使いにくかった…っていうのが結構あった。実機でみるべし。
(12)画像の容量気をつける。重いサイトはPC以上に見る気しない。すぐ離脱。
→必要以上にPCサイト並みのリッチな高解像度の画像載せすぎたら重い。環境にもよると思うけど。必要な部分だけリッチに。
今のところ思ったのはこんなところ。
しかしこれだけ画面外小さいと、やっぱりトップページだけでもスマホ対応してあるサイトの方が圧倒的に見やすいですね…！
VIVID COLORS + BLOGも一応スマートフォン対応してるんですけど、これらをふまえてあらためてもう一回デザイン見直してみようと思いました。
多分もうすでに言われていることばっかりだと思いますが、こういうのは自分で体感することによって優先すべき順番とかも見えてくると思うので引き続き続けてみたいと思います☆
みなさんも、このサイト＆アプリはここが使いやすい♪使いにくい＞＜などありましたらぜひぜひ教えて下さいね！