タグ

usabilityに関するmiyanamiのブックマーク (114)

  • プロトタイピングでUIデザインの失敗にさようなら - @IT

    仲里淳 2009/9/11 ※ トリックスター……この連載でのトリックスターのイメージは、相反する2つの者同士が、別個に機能する共同体をつなぐ役目を果たす人。閉鎖的な空間に風穴を開けて風通しを良くする人。エンジニアとコーダー、デザイナの機能システムが組み合わさった緩やかな共同体を創造する人たちです。 WebサイトのUIデザインを効率的に進める「プロトタイピング」が注目されている。この手法に積極的に取り組むビジネス・アーキテクツの伊原力也氏に、実践する際のポイントについて聞いた 悩みの種は納品後に発生するUIデザインの修正 RIA/リッチクライアントに限らず、納品後にUI(ユーザーインターフェイス)に対して「使いにくい、分かりにくい」「やっぱり画面にアレが欲しいな」といった意見がクライアントから出ることは少なくない。こういったUIトラブルを減らす有効な手段として「プロトタイピング」が注目を集

  • 第36回 手品とインタフェース | WIRED VISION

    第36回 手品とインタフェース 2009年10月14日 (これまでの増井俊之の「界面潮流」はこちら) 奇術や手品は人間の錯覚や勘違いを最大限に利用したエンターテインメントです。人間は錯覚や勘違いの固まりですから、突然何かが変化しても気付かなかったり/慣れたものを見逃すことが多かったり/手品の達人は観客の目前でも易々とイリュージョンを見せることができ、観客はそれを見て驚き楽しむことができます。人間の知覚能力や認識能力がたいしたものではないという事実は多くの場合は不利だと思われますが、そのおかげで未熟な技術でも実用的に使えて都合が良いこともあります。テレビ映画は1秒間に30枚以下しか画面を表示していないにもかかわらず、動画がなめらかに動くように見えるのは人間の知覚能力が低いおかげといえるでしょう。 勘違いをしやすいという点は、逆に考えるとイリュージョンを見る能力があるという長所だと考えること

  • UK STUDIO - ついったーBOT作者にお願いしたいこと

    最近、行儀がわるいというか、ハッキリ言ってしまうと「陶しいBOT」が増えた(前からかもだけど)気がするので個人的にBOTを作るときに気をつけてもらいたいことを書いておく。 言及に気を配って ついったーの仕様上、いつからかは知らないけど発言内容に「@自分のID」が含まれていると言及されたということでReplyに流れてくる。 それはまぁいいんだけど、BOTが必要以上にIDを含めているとそれだけでReplyがうまってしまう。特に「○○なう系BOT」がひどい。山手線とか色々あるけど渋谷なうBOTがひどい。 なにがひどいって一度「渋谷なう」と言ったら補足されて大体24時間ぐらいはそのBOTの発言に自分のIDが含まれて、誰かが「渋谷なう」と言う度に自分のReplyに流れてくる。そんな情報は求めていない。せめて@をはずしてほしい。 それと同じような理由で延々と特定のキーワードに対してReTweetする

  • サイトのユーザビリティ上の問題を手っ取り早く発見するためのコツ 5ヶ条 - Feel Like A Fallinstar

    サイトのユーザビリティがあがれば、成果に良い影響がでることは既に広く知られています。 でも、意外と「効率よく」改善する方法ってあまり見たことがなかったのでエントリー。 クリティカルな課題を手っ取り早く発見するためのポイントです。 ファーストビューのみに絞って重点的にチェックする 共通化されたフッターに改善の余地がないかチェックする 細かい文章は読まず、文章を「塊」として捉える フォームの課題は、とにかく真っ先にチェックする トップページのチェックは最後に回す 1.ファーストビューのみに絞って重点的にチェックする ユーザが、ファーストビューより下のコンテンツをじっくり読む可能性はぐんと下がります。 (ブログは除く) ユーザビリティ上の課題でクリティカルなものは、ファーストビューに集中することが多いです。 ファーストビューでしっかり興味をひきつけてしまえば、その下が多少問題でも、大きな破綻は起

  • 今だからこそ、「軽量なウェブサイト」を作ることが重要、というお話。 - Feel Like A Fallinstar

    最近はJavaScriptのライブラリ整備や、大きなモニターが増えたせいもあり、リッチな見た目のサイトが増えてきたなーって思います。 でも、その一方で、それ以上に増えている様相なのが「低速度回線」のユーザ。 今だからこそ、技術をきちんと理解して軽いウェブサイトを作るべきなんじゃないか、というお話を少し。 増えているのは、フレッツよりも「持ち歩きPC」「スマートフォン」のアクセス これは今木が運営する、とあるポータルサイトの利用者の接続速度の変化のデータです。 月間PVが大体150,000位で、割と昔からあるタイプのまじめなコンテンツのサイト。携帯は対応していませんし、IT系とかに偏ったコンテンツもありません。 見ると分かる傾向は ダイヤルアップ、実はあまり減っていない ケーブルはそこまで延びていない Unknownが年々増えている ADSL / 光(T1)も割合としてはむしろ減少傾向 グラ

  • MTが実現したたった一つのイノベーション

    おいらは、かつてCMSを作っていたが、MT2.6を見て、管理画面の割り切り方もさることながら、一番衝撃を受けたこと。 それは、 「カテゴリを一個も登録することなく、コンテンツを登録できること」 いわゆるCMSの使いにくさの最たるところは、 「先にコンテンツ構造が決まってないと何も作れないこと」 だと僕は思う。 話ずれるね。比喩の話。 最近、ワイヤフレームの有効性の話を聞くことがちらほら。 デザイナや設計者にとってのワイヤフレームのことではない。 お客さんとのやりとりの手法にワイヤフレームで説明することの是非。 結論としてはこうだ。 「ワイヤフレームで完成品を夢想できるお客さんは少ない。結局、イメージできるのは色や実物のデザインを見てから」 結局、実物を見てナンボという、致命的な部分は捨てられないのね。 この埋めがたいギャップをどうやって埋めて、お客様の暗黙知を引き出した良いサイトを作ってい

  • 「進むボタン」と「戻るボタン」のちょっとした法則【ユーザビリティTips】

    『MarkeZine』が主催するマーケティング・イベント『MarkeZine Day』『MarkeZine Academy』『MarkeZine プレミアムセミナー』の 最新情報をはじめ、様々なイベント情報をまとめてご紹介します。 MarkeZine Day

    「進むボタン」と「戻るボタン」のちょっとした法則【ユーザビリティTips】
  • 理想の結婚写真を撮影しよう|思い出を写真に残す

    写真を撮る機会は実に多くありますが、特に結婚写真は一生の記念になる大事な写真ですので、できるだけ良いものを残しておきたいものですね。 結婚前は何かと忙しくなりますが、疲れが残らないよう、写真撮影の前にはしっかり休息を取っておきたいですし、エステなども利用して、できるだけきれいな状態で撮影にのぞみたいものです。 そして、結婚写真は挙式当日に撮影されるカップルも多いですが、やはり慌しいこともあり、せっかくの写真も表情が硬くなってしまったという経験をお持ちの方もいらっしゃるのではないでしょうか。 結婚写真は最近は前撮りでゆとりを持って撮影される方も増えているようです。 メイクや着付けも時間をかけられますし、時間にも余裕がありますので、より自然な表情で撮影ができるのもメリットです。 そして、式当日とは違う衣装を選ぶことができるのも良いですね。 スタジオ撮影はもちろん、ロケーション撮影などで屋外での

  • さらなる“ユーザー中心設計”を目指すために [最終回] | ゼロ円でもできる!? 省コストユーザビリティ向上術

    ユーザー中心設計とはこれまで「師匠と弟子方式のインタビュー」「ペルソナ」「カードソート」「ペーパープロトタイプ」「ユーザーテスト」といったユーザビリティ手法を紹介したが、種を明かせば、これらは私の発明品ではない。「ユーザー中心設計(人間中心設計とも言う)」に含まれるテクニックの一部なのだ。 ユーザー中心設計とはソフトウェアの設計思想の1つであり、個々の手法を指すものではない。カレン・ホルツブラットの「コンテクスチュアル・デザイン」も、アラン・クーパーの「ゴール・ダイレクテッド・デザイン」も、さらにこの連載で紹介してきた「ディスカウント・ユーザビリティ」も、いずれもがユーザー中心設計の範疇に入る。 ただ、そこには骨格となるような共通したパターンがある。それは以下のようなものだ。 ユーザーの利用状況を把握する。利用状況からユーザーニーズを探索する。ユーザーニーズを満たすような解決案を作る。解決

    さらなる“ユーザー中心設計”を目指すために [最終回] | ゼロ円でもできる!? 省コストユーザビリティ向上術
  • SUS(システムユーザビリティスケール) - unoy@wiki

    下記に書いた10の指標について、1(まったくそう思わない)~5(まったくそう思う)の5段階評価を行ってもらいます。そして、指標の番号が奇数のものは回答から1を引き、偶数ものは5から回答点を引きます。 10指標についてこの処理を行い、それらの合計した点数に2.5を掛けた値を0(使えない)~100(非常に使いやすい)とし、ユーザビリティ評価の目安とします。 1.このシステムをしばしば使いたいと思う 2.このシステムは不必要なほど複雑であると感じた 3.このシステムは容易に使えると思った 4.このシステムを使うのに技術専門家のサポートが必要とするかもしれない 5.このシステムにあるさまざまな機能がよくまとまっていると感じた 6.このシステムでは、一貫性のないところが多くあったとおもった 7.たいていのユーザは、このシステムの仕様方法について、素早く学べるだろう 8.このシステムはとても扱いにくい

    SUS(システムユーザビリティスケール) - unoy@wiki
  • モバイルユーザビリティ・デザイン Web制作者が身につけておくべき新・100の法則

    またしても IDEA*IDEA 経由で 携帯サイトのを頂戴しました。ありがとうございます。 といっても実はこれを拝領したのは1ヶ月前。 実際にこれを参考にして 何か作ってみてから書こうと思っているうちに 時間ばかりが経ってしまった。いかんな最近。 でまあ結局まだできてないんだけど、 そのまま先延ばしにするのはもったないので。 これに目を通しておくだけで 今すぐ楽になる人がたくさんいると思う。 もうタイトルのとおり ユーザビリティを重視したモバイルサイトのデザインに関して 注意すべき点を100の法則にまとめた一冊。 100個全部を並べるまでもなく、 各章のタイトルを見るだけで 「これは読んでおかなければ」と思うようなものばかり。 第1章 ケータイサイトを作る前にやるべき法則 第2章 基構造とレイアウトの法則 第3章 視覚的にアピールするデザインの法則 第4章 ユーザーをサイトに引き込むた

    モバイルユーザビリティ・デザイン Web制作者が身につけておくべき新・100の法則
  • ウェブインターフェースデザインに関するスライド – 秋元

    これはいい。ウェブのボタンやフォームの配置等についてのティップスがつまったプレゼン。元Yahoo.comのAjaxエヴァンジェリスト、現NetflixUIエンジニアBill Scottさんの作によるものです。 UIの話で図がいっぱい入ってるから英語読まなくてもなんとなくわかるし。 Yahoo.comの映画レビューで使われているUIは僕も好きだなあ。グレード評価なので日にそのまま使えるわけではないけど、レビューサイトとか作るとしたらぜひああいうの入れたいと思います。 Javascriptでその場でいろいろする場合にも、マウスの移動距離を考えよ、ってのを見てはっとしました。あんまり考えて無かったかもしれません。 327ページのスライドというのがすごいですね。新刊(↓)の宣伝とはいえ、ここまで出してしまうとは。 [am]0596516258[/am] 今回のプレゼンとは違いますけど、一昨年に

  • http://hpbuilder.net/weblog/

  • UIデザインガイドラインのまとめ : could

    UIUXガイドライン UIデザインガイドラインのまとめ デザインガイドラインは、実際同じようなガイドラインを作るときだけでなく、UIデザインを考える際にも役立つ貴重な資料です。今まで個別で紹介したことはありますが、今回は一挙にまとめてリストアップしてみました。 Introduction to Apple Human Interface Guidelines 個人的に UI デザインガイドラインといえばこれ。日語訳も大変便利です Apple User Experience Guides ソフトウェア開発向けですが、イントロダクションあたりは参考になります iPhones Human Interface Guidelines 会員登録すると見れる PDF 資料ですが、上記のリンクからブラウザ上で観覧することが出来ます Windows User Experience Interaction G

    UIデザインガイドラインのまとめ : could
  • IDEA * IDEA

    ドットインストール代表のライフハックブログ

    IDEA * IDEA
  • UIデザインを改善する10の方法 | エンタープライズ | マイコミジャーナル

    Smashing Magazine - WE SMASH YOU WITH THE INFORMATION THAT WILL MAKE YOUR LIFE EASIER, REALLY. Dmitry Fadeyev氏がSmashing Magazineにおいて10 Useful Techniques To Improve Your User Interface Designsというタイトルのもと、Webページのデザインを改善するための10のテクニックを紹介している。内容を要約すると次のとおり。 ブロックリンクを活用する。たとえば a { display: block; padding: 6px; } のようにインラインをブロックに変更してさらにパディングを指定する。幅を指定する必要がないうえ、リンク対象が広くなりクリック漏れが少なくなる 英字の場合、上下のバランスを考える。ボタンやラベ

  • オノマトペン - かんばらにっき

    めっちゃ久々に日記を更新してみるよ。 オノマトペを使って絵を描くオノマトペンというものを作ってみました。 YouTube版 「モコモコ〜」と言いながら線を引くとモコモコした線になるというものです。音声認識を使った単純なネタですが絵を描くのがちょっと楽しくなるかも。

    オノマトペン - かんばらにっき
  • 本当に『らくらく』だったか?らくらくホンⅤ: ユーザーの生の声を届ける!ハーモニーblog

    このblogでも告知しましたが、9日に無事「ユーザーと共に行動し携帯の使い勝手を体験・検証する交流会」 を終えました。 自分自身はauの一般の携帯を使っているもので、今回のように徹底的に「らくらくホン」を、ユーザーと共に試してみたのは初めての体験でした。 そんな事もあり、ターゲットユーザーとしているシニア層には相当使いやすいものなのだろうと期待していたのですが・・・。 さて、その結果はというと、少し裏切られる部分も正直言ってありました。もちろん、独自の工夫でよい部分も多いのですが。 そこで、そのレポートを少しずつではありますが、かいつまんで今後書いていきたいと思っています。 既に、当日参加なさったアークウェブの中野氏が、ご自身のblogにレポートをアップなさっているので、ぜひ合わせてご覧ください。 http://nakanohajime.wordpress.com/2008/11/11/r

    本当に『らくらく』だったか?らくらくホンⅤ: ユーザーの生の声を届ける!ハーモニーblog
  • ユーザーの視点で考えることの重要性とその難しさについて

    これは確かに配慮してほしいところ。 「いま・・・」 by ayumi : 明らかに・・・ あるお店で商品が、 背の高い棚の一番上から S→M→L→XL と並んでいた。 Sを取りたくても、手が届かない。 陳列する側の気持ちからすると、 小さいのを上、大きいのを下にした方が 安定感があっていいのかもしれない。 が、買う側の都合で考えたら逆。 S サイズを手に取りたい人は L サイズを求める人と比べて 背が低い人である可能性が高いから。 中くらいのMサイズを着る人が多いとして、 取りやすいところに置くとしても、 XL→L→M→S だよなぁ。 ごもっとも。 もちろんお店の雰囲気によっては 見栄えを大切にしないといけない場合もあると思う。 ただ、見せたい側の都合もあるだろうけど 買う方の視点を忘れないようにしたいね、ということ。 ウェブサイトでも同じですね 見栄えも大事だけど、ユーザーの都合が先。

    ユーザーの視点で考えることの重要性とその難しさについて
  • 「トップページはFlash!」は単なる迷信 目的に応じた使いわけを

    『MarkeZine』が主催するマーケティング・イベント『MarkeZine Day』『MarkeZine Academy』『MarkeZine プレミアムセミナー』の 最新情報をはじめ、様々なイベント情報をまとめてご紹介します。 MarkeZine Day

    「トップページはFlash!」は単なる迷信 目的に応じた使いわけを