使いやすさ日記: 454. ICカードチャージ専用機
このチャージ機の大きな特徴は、カードのデータを読み書きする際、従来の自動券売機と異なり、写真のように、差込口に差し込む方式になっていることです。 実際に使ってみて気になったのは、カードを差し込んで手続きが終わった後、いつカードを取り出せるか分かりにくいことです。 従来の自動券売機は、カードが機械に吸い込まれて見えなくなるため、 「カードが見える」＝「カードが取り出せる」 「カードが見えない」＝「カードが取り出せない」 というシンプルで分かりやすいルールが成立しており、このような問題はおきませんでした。 それに対し、このチャージ機は、カードが取り出せる時もそうでない時も、カードが常に「見える」状態であるため、上記のような分かりやすいルールがそもそもないわけです。では、代わりに何か「いつ取り出せばいいのか」を教えてくれるルールはあるのでしょうか？確かに写真２、３のような緑の三角のランプがあり、
使いやすさ日記: 455. サイズを区別しやすいアスクルの乾電池
2008年9月 1日 会社にあるテレビ用リモコンの乾電池が、切れていることに気づきました。 交換しようとしましたが、文具棚に乾電池の在庫がなかったため、会社の備品を購入しているインターネットショップのアスクルで注文することにしました。 会社では、いつもアスクルの乾電池を使っているのですが、一目でサイズがわかりやすいのが良い点です。サイズごとに色が異なっていて、ラベルにサイズが大きく表示されています。私はいつもこの乾電池を使っているため、写真を見ただけで迷わずサイズを判別することができます。 インターネットで注文する際に、サイズの判別しやすさが非常に役に立ちます。例えば、下図は他社製の単3、単4の乾電池ですが、画面上ではほとんど違いが無いように見えます。サイズを判別する手がかりは、商品名の文字列最後尾にある「単3、単4」しかありません。 アスクルの乾電池のように、ラベルデザインの工夫次第
本田雅一の「週刊モバイル通信」
本誌の読者ならばご承知のように、先日、Intel Developer Forumがサンフランシスコで開催され、筆者も8月17日から米国に出発した。これがiPhone 3Gを連れて行く初めての海外取材(海外旅行)となる。 iPhone 3Gの海外ローミングにまつわる話は、いくつか断片的に伝えられてはいるが、もう少し具体的な例も含めながら、ソフトバンクで言うところの“世界対応ケータイ”としてのiPhone 3Gについて書き進めることにしたい。 ●事前に知っておきべきこと さまざまな記事やブログ、ソフトバンクのWebサイトなどで入手できる情報がほとんどだが、iPhone 3Gを海外で利用する際に知っておくべき基礎知識を、まずはひとまとめにしておこう。初めて海外ローミングで携帯電話を使う人向けに書いているので、やや冗長になっている点はご容赦いただきたい。 ・海外ローミングは申し込みが必要 iPho
使いやすさ日記: 453. ユーザへの配慮と設計～文字のサイズと色のカスタマイズ機能～
2008年8月25日 インターネットをしていて、ページの文字が読みにくいと感じたことはありませんか？私はニュースサイトを見ている時に文字が小さかったり、背景色と文字色のコントラストが低かったりして、記事が読みにくいと感じることがあります。 よい解決策がないかと様々なWebサイトを探してみたらありました！なんと、文字サイズ、背景色、文字色が自分の好みに設定できるのです。 設定は設定パレットにある色を選択すればOKです。これなら直感的で簡単ですね。また、この機能を利用すれば色弱や弱視の方なども文字を読みやすくできるので、アクセシビリティに配慮している姿勢が伺えます。 ただ、文字色と背景色が同じ色で指定できてしまったり、そもそも、機能の入り口がユーザの目に付きにくい位置にあったり、ページによって機能の有無が異なっているため、ユーザのために用意したせっかくの機能も有効に使ってもらえないのではない
使いやすさ日記: 448. 一目瞭然！ICカードの残高具合い
2008年7月31日 ICカード乗車券PASMO（※１）を愛用し始めてから半年経ちますが、先日、ひとつ気づいた点があります。 電車を降り改札から出ようと改札機にカードをかざすと、液晶画面に［引去額］と［残額］が表示されますよね。この表示、背景が白い場合と、黄色い場合があるのをご存知でしょうか（Suicaの場合でも同様です）。実はこれ、“ICカードの残額が1000円以上の場合は白”、“1000円未満の場合は黄色”というふうに色分けされているのです。 多くの人がドヤドヤと改札を出ていく慌ただしい流れの中で、この表示を確認できるのはたった数秒です。急いでいるときなどは特に、残高金額の数字を瞬時に読み取ることは少々ハードルが高いタスクと言えましょう。しかし、そんな束の間でも“黄色＝残高が少ない”ということさえパッと認識できれば、次の乗車時までに余裕を持ってチャージしておくことができ、「うっかり残
使いやすさ日記: 447. うっかり防止！自動風呂給湯器
2008年7月28日 我が家には自動風呂給湯器が付いています。浴室だけでなく、キッチンからも操作ができ、さらにボタンひとつでお風呂が沸いてくれてとても便利です。 ところが先日、こんな失敗をしてしまいました・・・。日中に、浴槽の掃除をし、その後部屋の片付けをしたり、友達とお茶を飲んだりして休日を満喫した夜のこと、「さてお風呂に入ろう」といつものようにキッチン側のリモコンの“自動”ボタンを押し、お湯張りを開始しました。
FAQの隠れた役割 (ユーザビリティ実践メモ)
ユーザから頻繁に問い合わせを受ける質問に対応するため、多くのサイトでは、「Q&A」や「よくあるご質問」といったFAQ（Frequently Asked Questions）コンテンツを用意しています。 今回はFAQを効果的に活用する見せ方について考えていきます。 FAQはユーザが持つ疑問の解決につながりますが、ユーザはサイトを利用するなかで、FAQをそれほど意識して探しにはいかないことに注意が必要です。 では、FAQはページのどこに配置するのがよいでしょうか。 ヘッダーエリアか、左右のナビゲーションにFAQのリンクが配置されているパターンを思い浮かべる方が多いでしょう。（図１） ユーザは、コンテンツエリアを中心に見ていくため、意識的に探さないとFAQがあることに気付きません。 サイトの共通要素として、問い合わせなどと同様、どのページにも同じ位置に配置すべきですが、それに加えて、コンテンツを
はてなブログ | 無料ブログを作成しよう
新米と秋刀魚のわた焼き お刺身用の秋刀魚を買いました。1尾250円です 3枚におろして、秋刀魚のわたに酒、味醂、醤油で調味して1時間ほど漬け込み、グリルで焼きました 秋刀魚のわた焼き わたの、苦味が程よくマイルドに調味され、クセになる味わいです 艶やかな新米と一緒に 自家製お漬物 土…
使いやすさ日記: 444. カレンダーから日付を選ぶ入力方式
2008年7月14日 先日、近い週末に旅行をしようと思い、いくつかの宿泊施設予約サイトで宿を検索していました。そのとき閲覧したほとんどのサイトでは、宿泊日をテキストボックスかプルダウンメニューで入力するようになっていましたが、『宿・ホテル予約サイト じゃらん（http://www.jalan.net/）』では下の画面のように工夫していました。 一見普通のテキストボックスに見えますが、ボックスをクリックするとカレンダーが表示されます。そしてカレンダーから日付を選択すると、日付が自動的に入力されます。 私は宿泊日を土曜日にするということしか決めていなかったので、テキストボックスやプルダウンメニューで検索する場合、毎週土曜日の日付を確認してから入力する必要がありました。しかしこのサイトの入力方法ではカレンダーから選択できるため、日付は確認せずに土曜日の列から選んで入力することができました。 宿に
ユニバーサロンリポート
駅の中や周辺の公共施設までのルートなどを視覚障害者が触って確認できる触地図（しょくちず）や点字構内案内板を使いやすくするためのデザインや工夫を考える研究談話会が５日、都内港区の研修施設で開かれた。０６年１２月の「高齢者、障害者等の移動等の円滑化の促進に関する法律」（通称バリアフリー新法）の施行などに伴い、現在、エレベーターやエスカレータとともに全国の鉄道駅や公共施設などに視覚障害者が利用できる触知式の案内図の設置が進んでいる一方で、実際に駅を利用する視覚障害者からは「案内図を見ても目的地の方向が分からない」といった声が寄せられている。談話会は、障害のある人が使いやすい機器を研究するＮＰＯ法人ヒューマンインタフェース学会 アクセシブル・インタフェース専門研究会（ＳＩＧＡＣＩ）が開いたもので、当日は福祉機器の研究者や開発者のほか、視覚障害ユーザーらが参加、ユーザーから「複雑すぎて分からない」な
携帯サイトのフォーム設計のコツ (ユーザビリティ実践メモ)
PC向けサイトの資料請求ページなどでは、入力フォームに近接して入力例を置くことで入力形式の違いによるエラーを防ぐことができます。 しかし携帯サイトの場合、入力フォームの周りに入力例を表示したとしても、パソコンとは違い実際にユーザが入力する際には入力画面に切り替わってしまうため、ユーザが例を見ながら入力することができません。 入力フォームについてもう1点注意することがあります。 例えば上記にて、年月日の入力フォームを縦に並べてしまうと、スクロールのしかたによっては携帯サイトの画面に月日の入力フォームが表示領域外に隠れて見えなくなるケースが発生し、ユーザが誤って年のフォームに月日も同時に入力してしまう可能性があります。 入力フォームは横並びにする、入力フォームに文字数制限を設けることが有効です。 同じ役割を持つ画面でも、PCと携帯という物理的な環境やユーザの使用環境の違いを考慮すると違った設計
色や模様が購入の決め手となる商品の見せ方 (ユーザビリティ実践メモ)
ECサイトでの商品画像の出し方についてはこれまでも何度か取り上げてきました。今回は衣料品やアクセサリーなど、同じ形状であっても色や模様によって購入意欲が変わってしまう商品の見せ方について考えます。 図1：商品一覧画面と商品詳細画面 上記のサイトを訪れたユーザは、商品一覧画面を見てBのシャツの形状は気に入ったのですが、灰色ではなく水色のシャツが欲しかったので、Bのシャツの商品詳細を閲覧しようとはしませんでした。その後、しばらく一覧画面を閲覧した末、別の商品を探しに他のサイトに行ってしまいました。 実はBのシャツには水色の商品もあったのですが、ユーザは一覧画面の写真だけで判断してしまったため、水色のシャツの存在に気がつかなかったのです。 衣料品やアクセサリーのような商品は色違いや模様違いというだけでユーザには全く別の商品だと認識されてしまいます。そのため、同じタイプで三色を展開しているものであ
第3回 Webページで行間はどのくらいにしましょうか？
小林 信次 マークアップ・エンジニア。茨城県出身。1980年生まれ。専修大学経営学部卒業後，1年弱のニート生活を経て，販売代理店の営業職を経験後，有限会社アイエイトワンに入社。主に，Webディレクション，マークアップを務めるかたわら，講師活動・執筆活動を行う。allWebクリエイター塾ではCSS講習の講師。著書に「XHTML&CSSデザイン |基本原則，これだけ。」（共著，MdN発行）がある。 いろいろな方と話しているときに，line-height（1行の高さ。行間として認識できる余白を制御する値）ってどのくらいに指定していますか？という話題が出ることがあります。そこで改めて，他の人がサイトでどんな指定をしているのかを調べてみました。 ※ 今回は，Webのフロントエンド制作を仕事にしている人の間でよく知られており，アクセシビリティ，ユーザビリティ，文字の読みやすさなどにも気を使っていると思
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
使いやすさ日記: 450. 開かずの扉 ～トイレの個室
使いやすさ日記: 449. 料金ボタンが見つからない！～地下鉄券売機
掲載物のない状態のinformationボード → ○ (ユーザデザインブログ－本当の「使いやすさ」とは何かについて情報発信しています。)
使いやすさ日記: 445. 流し方がわからないトイレ パート２
使いやすさ日記: 443. きれいに開封できる封筒
ユーザーの目線を追え・ウェブツールで手軽に検証 インターネット-最新ニュース:IT-PLUS
使いやすさ日記: 438. ドアのガードアーム