栞/#ui
JavaScriptを使ってCookieに既訪問ユーザーかどうかを保存、新規ユーザーの場合はメッセージなりコンテンツなりを表示する。
webページの情報をどう構造化して、しかもユーザーから見てわかりやすいものにするか。
webページをなるべく広く使うために。タブとか擬似モーダルウィンドウとかの工夫。
アイトラッキングしてみてわかったこと。画像広告よりテキスト広告。
各サービスのロゴを統一化。まぁやっておくべきことではある。
タグの見せ方、コンタクトリストの見せ方。
i-modeブラウザ 2.0で実現できる新しいUI。
単純なリスト表示ではないドロップダウンナビゲーションの有用性とか。
「Progressive Enhancementとは、『情報やサービスへのアクセシビリティを確保しつつ、ブラウザやデバイスの特徴を活かしたデザインや技術を実装する』という考え方です。」
Yahoo!が検索結果画面のレイアウトを変更。結構思い切ったことやってる。
「例えば携帯オンリーユーザは、早いスクロール・手入力が習慣化しているため、駆け抜けるようにサイトを利用します。」あまり上にボタンを配置しても見逃されるおそれあり。訴求ポイントはきちんと書くこと。
「小さなページ」「複雑なアルゴリズムをシンプルに表示」「どこででも使える機能」「データに基づいた決定－実験、実験、とにかく実験」
入力する内容/内容量に応じた入力欄の大きさ。
最初の数語で「情報の匂い」をいかにして感じさせるか。
BBC Newsのヘッドラインのタイトル付けのキャッチーさについて。
「Frequently Bought Together」を「あわせて買いたい」と訳すということ。
ユーザーにそれほどメリットがないんだけど掲載しなければならない情報をどう見せるか。わざと視認性を落としたり、視線を遮断した後に持ってきたり。
スムーズに使えるタブナビゲーション。コンテンツと連続していること、他の選択されていないタブとの差異を表現すること。
ドロップシャドウの効果。境界を認識させることで浮いている部分にフォーカスが行く。
hover擬似クラスを使ったUIいろいろ。ツールチップ的な表示、編集ボックスなど。
画像の最適化、CSS Sprite、8bitPNGの減色やチャンクカット、検索ボックスの配置見直し。
横幅960px超の時代？
「画面の切り替わりを少なくする方法として、ディスプレイを情報の“のぞき窓”として捉えるようなUIのデザインが今後の主流になると田川氏は見ている。その典型的な例がiPhoneだ。」
Googleが新しいCAPTCHAを考え中。人間だけが上下を判別できるような画像を回転させて正しい天地にさせる。
「ユーザの言いなりになったら、平凡で、機能ごたごた山盛りで、退屈なものしかできないのだ。」ユーザーの意見じゃなくて行動を観察しないと。
ユーザー導線を考えること。気持ちよく使ってもらうために。
ユーザーが失敗しないUIをどう作るか。何をするか迷いなく明確なこと。
ユーザビリティの手法一覧表。
haptic/tactileという語について。
「バックグラウンドを工夫することにより 古いWebページがそれなりに古く見える方法を考える。」