タグ

usabilityに関するitengineerのブックマーク (7)

  • 第29回 入力エレメントが多いフォームはどうするのか:ITpro

    今回のポイント 入力項目が増えることで発生する問題点 入力項目を分割する2つの方法 共通デザインに埋めるか別ページにするか リストボックスの使い方 何らかのWebアプリケーションを組む場合,前回見たようなログイン・フォームや検索フォームのように,入力エレメント(入力要素)が1つあるいは2つだけのフォームは少ないでしょう。例えば会員制のサイトを作成するログイン場合を考えてみましょう。ログイン時はたしかにIDとパスワードの2つだけを入力するフォームですが,会員登録の画面では氏名やメールアドレス,場合によっては住所や電話番号,性別,趣味など10項目前後の入力エレメントをもつフォームになります。 例としてYahoo! JAPANの会員登録画面をみてみましょう(図1)。 これくらいの規模のフォームになると,“ページの一部がフォーム”ではなく,“ページ全体がフォーム”になります。 企業が何らかのサイト

    第29回 入力エレメントが多いフォームはどうするのか:ITpro
  • 色が与える影響ってあるよね - もっこもこっ

    色って面白いなぁと思って色彩学の勉強しているところです。 最近読んだの中にはこういうのが載っていました。 色によっていろいろと効果があるみたいです。 色の新しい捉え方 (光文社新書)より↓ 色 主な分泌ホルモン 刺激部位 作用 効果 赤 アドレナリン 循環器系 血流を促進する 興奮・情熱 橙 インシュリン 自律神経 アルコールを受け付けない 健康増進 黄橙 グレリン 自律神経 欲増進 欲・元気 黄 エンドルフィン 自律神経 笑いを生む、鎮痛 明朗 黄緑 成長ホルモン 自律神経 成長を促進する 成長 緑 アセチルコリン 脳下垂体 ストレスの解消 安心 青 セロトニン 視床下部 血液の生成 安心・集中 青紫 オブスタチン 自律神経 欲抑制 集中・安定 紫 ノルアドレナリン 視床下部 危機に対する警報 恐怖・不快 ピンク エストロゲン・プロゲスラン 腺下垂体 血流をよくする 快活・若々し

    色が与える影響ってあるよね - もっこもこっ
  • もうユーザビリティの「べからず集」はいらない! - @IT

    もうユーザビリティの「べからず集」はいらない!:デザイナにおすすめのユーザーインターフェイスデザイン6つのポイント(1)(1/2 ページ) はじめまして。数年、Webアプリケーション開発会社でUI(ユーザーインターフェイス)制作を担当しているデザイナの嶋田です。業務アプリケーション開発を中心に、ユーザーの業務を理解して、情報設計、最適なUIデザインの提案を目指しています。 この連載では、これまでの経験を生かして、私と同じようなWebアプリケーションのUI(ユーザーインターフェイス)制作を担当する方々を対象に、ユーザビリティ向上のヒントとなる要素をご紹介していきたいと思います。 ユーザーインターフェイスって? あなたは電車に乗るときに、「どのようなモーターで駆動しているのか」や「どのような材質で車両ができているか」を気にするでしょうか? あなたの見えない場所でいかに複雑で高度なことが行われて

    もうユーザビリティの「べからず集」はいらない! - @IT
  • 第6回 [画面編]画面遷移を“整列化”する

    今回は,分かりやすい「画面遷移図」の作成方法を解説しましょう。 画面遷移図は,対象となるシステムが実現する複数の画面と,その画面の変化する状況を規定する工程成果物です。通常,この画面遷移図は,複数の画面を示す「画面記号」や「画面レイアウト」と,遷移元の画面と遷移先の画面を結んだ「矢線」で表します(図1)。

    第6回 [画面編]画面遷移を“整列化”する
  • [画面編]見た目の分かりやすさが落とし穴

    神谷 慎吾 NTTデータ 技術開発部 ソフトウェア工学推進センタ シニアスペシャリスト 田中 久志 NTTデータ 技術開発部 ソフトウェア工学推進センタ シニアエキスパート 画面編に掲載したコツは画面のレイアウトや遷移、画面上の操作を決める画面設計で利用する。画面や画面の流れをどう表現するか、レビューの際にユーザーと設計内容をどう確認・合意すればよいかをまとめた。コツの数は合計82で、画面の表現に関するコツが多い(表1)。 画面設計書は目に見える画面を扱うので、ユーザーもベンダーも理解しやすい。一方で理解しやすいがゆえに、設計書の情報不足を招いたり、あいまいなレビューにつながる恐れがある。画面編のコツは確認漏れを防ぎ、適切な設計結果に導くことを目的とする。 画面の名称や領域を考える 代表的なコツは画面レイアウト図に関するものだ。例えば各画面に「ヘッダー登録用画面」「詳細登録用画面」など

    [画面編]見た目の分かりやすさが落とし穴
  • フォームにデータを正確に入力してもらうためのポイント - builder by ZDNet Japan

    3回にわたってフォームの基的なデザインについてまとめてきたが、今回はユーザーの入力を補助するフォームのデザインを紹介したい。 入力に必要な情報をわかりやすく伝える データを必ず入力してほしい場合や、全角で入力してほしい場合には、そのことをユーザーに伝えなければならない。そこで、ユーザーの目に留まるようにフォームに注意書きを表示する。 必須項目であることを示す 必ず入力してほしい項目には「必須」と表示するのが一般的だ。項目名の部分に表示するパターンと、テキストボックスの部分に表示するパターンがあるが、ユーザーが認識できればどちらに表示しても問題はない。 また、必須項目にマークを付けて、欄外に必須であることを記すパターンも利用することができる。 たとえば、次のサンプルは「名前」と「メールアドレス」の項目名の横に「必須」と表示したパターンだ。

    フォームにデータを正確に入力してもらうためのポイント - builder by ZDNet Japan
  • 続・押し間違いやすいキーを無効化する- @IT自分戦略研究所

    忙しいITエンジニアに無駄は禁物。連載では、わずかな工夫と最小の努力で仕事をスムースにする、“小技”を紹介します。 意図しないキーを押してしまってイライラするのを防ぐためにはキーを無効化するのがいちばん。今回はハード的にキーを無効化する方法を紹介する。 [F1]キーや[Esc]キーなど、普段は全く利用していないのに、レイアウト的にうっかり押してしまいがちなキーは、何らかの方法で無効化しておくのがいい。そうすれば、何かの拍子に[F1]キーに触れてしまってヘルプが起動してしまったとか、フォームの入力中に[Esc]キーに触れてしまって文章がすべて消えてしまったというイライラを防ぐことができる。 こうしたキーを無効化する方法として、前回の「押し間違いやすいキーを無効化する」ではソフトウェアを用いた手順を紹介したが、今回はハード的に無効化する方法を紹介しよう。とはいってもキーを壊したり取り外すわけ

  • 1