タグ

usabilityとdesignに関するchaws2004のブックマーク (28)

  • デザインは、デザイナーに任せるには重要すぎる - Feel Like A Fallinstar

    なんて言葉があります。しばらく前のエントリーでも書いた、IDEOのティム・ブラウンによる言葉。 「デザイン思考」とか「UX」なんて単語に集約すると、出来損ないのユーザエクスペリエンス(自称)専門家みたいで嫌ですが、少し解釈を広げつつ、デザインをすることについて、つらつら書いてみようかなと。 失敗が成功の早道 では、なぜデザインをデザイナーに任せないのか? それは全てのデザイナーが、とは言いませんが、所謂「デザイナー」「クリエイター」が消費者と比較的切り離されたところでデザインを行ってしまっていることが原因なんだと思います。 卑近な例で言うとバナー広告とか。 クリエイターが経験則であれこれ悩む暇があったら、世に放り込んでみれば、数字でも言葉でもちゃんとフィードバック(欠点/改善点)が跳ね返ってくる。 これが、人間中心のアプローチ。 ちゃんと良い失敗を早期に行うことで、最後の成果がぐんとアップ

  • その画像、必要ですか?~ 「連想的シンボル」「機能的シンボル」「コンテンツ」3つの価値 - Feel Like A Fallinstar

    ウェブサイトの画像はただの「イメージ」ではなく、明確な「役割」を持っているべきです。 なんとなくデザインが見栄えいいから なんとなく他のサイトでも使ってるレイアウトだから なんて理由で(特に上司に見せたときにかっこいいから、とか)画像を多用するのは避けたいもの。 最近は、ノートPCを持ち歩いて、イーモバイル等でネットを見たり、フルブラウザを使う人も増えてますし、無駄な重さは排除したほうが賢明ですしね。 個人的には、ウェブの画像には 「連想的シンボル」 「機能的シンボル」 「コンテンツ」 の3つの価値があると思っています。 (この3つに当てはまらない画像は不要なことが多い、という意味でもあります) 1.連想的なシンボル これは、その画像があることで特定の業種やサービスを扱っていることを想起させる使用法。 例えばIBMのサイトで使われているこの画像。 別にIBMが夜景の都市開発をやっているわけ

  • fladdict.net blog: flash使いから見た、ajaxのユーザビリティ(1)

    ajaxにおけるユーザビリティについて、flash使いの視点から書いてみる。 おそらくは、ajaxに携わる人の99%はプログラマやSEだと思うので、プログラマの言葉でデザインについて語ってみるテスト。今回は遷移について。 如何に遷移状態を知覚可能にするか 非同期通信のユーザビリティにおいて最も重要なことはおそらく、ユーザーに対し如何に状態繊維を意識させるか?ということではないかと思います。 「せっかくのシームレスな環境で、何故わざわざ遷移を意識させなければいけないのだろうか?」 と不思議に思う方も多いと思いますが、実はシームレスな環境だからこそ、遷移を意識させなければならないのです。 シームレスに遷移が行われるということは、同時にユーザーが現在位置を見失う可能性があるということでもあります。ロードが終了したのに気付かずに、いつまでも待っているというようなものはカワイイもので、例えばマウスオ

    chaws2004
    chaws2004 2009/06/04
    非同期通信アプリは、シームレスな遷移でユーザーの体験や集中力を寸断しないことが本質であり、決して遷移を意識させないことではない
  • @IT:Webアプリケーションのユーザーインターフェイス[1]-1

    Webアプリケーションのユーザーインターフェイス[1] ユーザーにとっては “ユーザーインターフェイス”こそが製品そのもの ソシオメディア 上野 学 2005/6/2 ■はじめに Webクライアントの技術が進歩し、多様化するに従って、Webベースのシステムにはデスクトップアプリケーションと同等の品質を持つユーザーインターフェイスが必要となってきています。 しかし開発の現場では、ユーザーインターフェイス(特にGUI)デザインについての専門的なスキルを持った技術者が圧倒的に不足しています。その理由は、ソフトウェア製品におけるユーザーインターフェイスの重要性が正当に理解されていないためと、ユーザーインターフェイス・デザインに関する教育機会がほとんどないためです。 利用者の視点に立てば、ユーザーインターフェイスとは製品そのものです。いくら高度に洗練された仕組みがバックエンドにあったとしても、それが

    chaws2004
    chaws2004 2009/06/04
    ユーザーインターフェイスとは製品そのもの
  • fladdict.net blog: 「本当に素晴らしいデザイン」とは、PICASAの変なスクロールバーみたいなものを言う

    お気に入り巡回先の、羨望は無知の「なぜ「デザイン」という行為、「デザイナー」という職業は誤解されるのか」や、分裂勘違い君劇場の「エンジニアの方が優れたユーザインタフェースデザインができる理由」、F's Garageの「エンジニアがダメなUIデザインをする原因」 のあたりのデザイン論が、あんまりデザインと縁のない人にデザインをわかりやすく説明してて面白い。面白いのだけどちょっと抽象的なんで、具体例の話とか書いてみるテスト。 最近、これらのエントリーで言及されるようなよいデザインを身をもって体験をした。それは画像管理ソフトPICASAのヘンテコなスクロールバー。 今まで気付かなかったけど、あのヘンなスクロールバーは単なるアヴァンギャルドやオシャレじゃあなかった。実は合理性に裏打ちされた素晴らしく美しいデザインだということに気付いた。 まずPICASAを知らない人に説明すると、このソフトのスクロ

    chaws2004
    chaws2004 2009/06/04
    あまりに自然すぎてその必然性にだれも気がつかなかった
  • 左ナビと右ナビはどっちが良い? (ユーザビリティ実践メモ)

    ウェブサイトを設計する際に、ナビゲーションメニューを左右のどちらに設置するかで悩んだ経験はありませんか? 弊社でウェブサイトを設計する際には、「コンテンツ」と「ナビゲーションによる誘導」のいずれが大事かによって設置位置を判断しています。 ■ナビゲーションによる誘導が重要な場合はナビゲーションを左に 例えばアマゾンなどの巨大ECサイトではナビゲーションによる誘導が重要であるため、ナビゲーションが画面から切れてしまうことのないよう、左側にナビゲーション設置しています。 上記のほかの考え方として、ユーザがそのサイトと同時に利用する競合サイトと同じ位置にナビゲーションを設置する、という考え方もあります(ユーザの慣れや先入観に配慮する)。 ナビゲーション設置時には「コンテンツ」と「誘導」のいずれが大事なのかによって設置位置を調整するようにしましょう。

    chaws2004
    chaws2004 2009/03/31
    いや、そうとも思わないっす。
  • サイトマップをフッタに配置する際のポイントとその効果

    サイトマップを独立したページとしてではなく、フッタに配置する際のポイントとその効果をWeb Designer Wallから紹介します。 Modern Sitemap and Footer 下記は、その意訳です。 昔はほとんどすべてのウェブサイトで、コンテンツをリストアップしたサイトマップを独立したページとして設置していました。 サイトマップの重要な目的は、ユーザーや検索エンジン(スパイダー)がサイト内の情報を探し出すのに役立つことです。 現在は、多くのモダンなウェブサイトでサイトマップページを設置していません。代わりに、サイトマップをフッタに配置しています。 サイトマップをフッタに設置する効果 クリック数やページビューの増加 ユーザーはページを隅々までじっくり見るわけでなく、スクロールしながらざっと見ることがほとんどです。 そして、多くのユーザーがスクロールして最後に見る場所は、フッタです

  • アクセシブルで、美しいフォームを実装するためのチュートリアル集 | コリス

    アクセシブルで、美しいフォームを実装するためのチュートリアル集をnoupeから紹介します。 Beautiful Forms - Design, Style, & make it work with PHP &a [...]

  • 意外に効果的なフッターリンク | 誤解を避けるコンテンツ配置のコツ (ユーザビリティ実践メモ)

    ウェブサイトを訪れたユーザにできるだけ多くのページを閲覧してもらうために、どんな対応が考えられるでしょうか。 他に見たいと思うコンテンツにスムーズに移動できるようにすることが重要となります。 今回は、後者を実現するための手段の一つとして、フッターリンクの有効性についてご紹介します。 ナビゲーションリンクには、一般的には「グローバルナビゲーション」や「左ナビゲーション」「右ナビゲーション」などがありますが、中でもユーザに頻繁に利用されているのはページ下部に配置されたフッターリンクであることが弊社のユーザビリティテスト(ユーザ行動観察調査)でわかっています。 フッターリンクはページの下部に配置されるナビゲーションリンクであるため、設計時には軽視されがちです。しかし、ユーザにとってはページの上から一通りコンテンツを閲覧した後に出現する関連ページへの最も近い導線であるため、有効な手段となっているわ

  • CBCNET > Dots & Lines > クリス パルミエリ > バイリンガルのウェブデザインでするべきこと・してはいけない14のこと

    ±0はとてもよく出来たサイトだけど、英語の使い方が複雑で、ユーザを混乱させる要因になっている。英語と日語が混在している箇所があったかと思えば、英語だけ、または日語だけのところもある。 1. 同じページで英語と日語を混在させない 英語圏のほとんどの人々はシステムに日語をインストールしていないので、日語のテキストは文字化けされてみえてしまう。加えて、情報量の少ないサイトを除いては、ひとつのページに2つの言語で情報をバランスよく表示させることは難しいし、自分の言語以外は読む人にとって視覚的なノイズにしかならない。 インターナショナルな閲覧者を考慮してサイトに英語を散りばめているのかもしれないが、多くの場合、逆にユーザを混乱させることになる。デベロッパにとっても、単に2つ目のサイトをメンテナンスするよりもつらいことになるかもしれない。 2.コンテンツはミラーリングがおすすめ。 ただし、そ

    chaws2004
    chaws2004 2009/02/25
    うむむ
  • Business Media 誠:「ブラウザの文字サイズ最大」が半数以上――家庭用PC

    テレビで見た話題をYahoo!で検索したり、ネットショッピングで買い物をしたり……かつて“仕事の道具”だったPCはすっかり日常的な存在になり、家庭にも当たり前に入り込んでいる(9月10日の記事参照)。 ところで家庭では、みんなどのような環境でPCを使っているのだろうか。 コンサルティング会社のブライト・ウェイは9月7日、「家庭でのPCの使用状況、設定について」アンケート結果を発表した。調査期間は2007年8月1日から8月31日までで、同社が運営する子育て支援サイト「こそだて」で実施したもので、回答数は516人(男女比24:76)。 調査によれば、家庭で使用しているPCは、デスクトップが51.8%、ノートPCが47.1%だった。ディスプレイの画面サイズは、14~15インチ程度(ノート)が34.1%で最も多く、次いで17インチ程度(デスクトップ)21.8%だった。デスクトップを含めると、14~

    Business Media 誠:「ブラウザの文字サイズ最大」が半数以上――家庭用PC
  • ユーザーエクスペリエンスデザインの成果物リスト | Web担当者Forum

    ユーザーエクスペリエンス(UX)デザインの世界に身を置くわれわれにとっては、いまや心浮き立つような時代となった。UXの価値はますます広く認められるようになり、次々に生まれる新たなテクノロジーやメディアを超えたトレンドは、UXデザインの実践面で飛躍的な進化を生み出す土壌を整えつつある。 私自身、新たなチャレンジの数々に見舞われてあやうく安全圏から押し流されそうになりながらも、インフォメーションアーキテクトとしてはそれらを大いに楽しんでいる。これまでに、ソーシャルソフトウェアやリッチユーザーインターフェースをデザインしたり、モバイル検索の未来についてのシナリオを描いてみたり、いろいろなチャネルやアプリケーションにまたがるようなUXを設計してきた。するとそのうち、VIPルームの“エラい人たち”に自分のアイデアをご理解いただこうと苦心する場面が次第に増えつつあることに気づいた。 そんなわけで、私は

    ユーザーエクスペリエンスデザインの成果物リスト | Web担当者Forum
  • ウェブインターフェイスの6原則

    既に英語版が発売されている「Designing Web Interfaces: Principles and Patterns for Rich Interactions」。書籍のブログとFlickr コレクションには UI に関する豊富な例が紹介されていて、これを見ているだけでも楽しめます。 主にウェブアプリケーションを対象にした書籍ですが、企業サイトやショッピングサイトの構築際も参考になる点は幾つもあります。は14章に分かれており、それぞれ異なるインターフェイスを紹介しているわけですが、この 14章を大まかに 6種類の原則にまとめることが出来ます。 単刀直入に アウトプットがあるところにインプットが出来るようにする。ページ単位ではなく、ページの中の情報単位での操作を可能にする 軽量化 ファイルサイズだけではなく、物理的な動作や精神的な負担を軽減するような UI つくりを心がける ひと

    ウェブインターフェイスの6原則
    chaws2004
    chaws2004 2009/02/10
    ほほう
  • ウェブデザインにおける効果的なコミュニケーションの取り方

    ウェブデザインにおける明確で効果的なコミュニケーションの取り方をSmashing Magazineから紹介します。 Clear And Effective Communication In Web Design 下記は、簡潔に意訳したものです。 1. コミュニケーションのアプローチ方法 ウェブサイトの来訪者とコミュニケーションを取るためのアプローチ方法をいくつか紹介します。 テキスト 見出しやコンテンツ内にかかわらず、来訪者はテキストをメッセージとして受け取ります。コミュニケーションにおいて、極めて重要な要素です。 画像 画像は、テキストよりもすばやくメッセージを伝えるときがあります。画像を作成する際は、メッセージを魅力的に伝えられるようにします。 タイトルとヘッダ タイトルとヘッダは、来訪者に主要なポイントと考えを伝える重要で効果的なものです。 アイコン アイコンはウェブデザインの特徴的

  • IDEA * IDEA

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

    IDEA * IDEA
  • はぁ、またか、とFlashがダメだなと思う一瞬

    先に補足を追記します: 僕のスタンスをはっきりしておかないとFlashという単語などの想定しないところで思考がひっかかる人が出てきそうなので書いておくと、 ・これから以下に書くようなFlashを作っていた人でもあります。 ・FlashやAdobe(Macromedia)プロダクトが大好きです。 ・現状の環境で素晴らしいUIを実現するにはFlashとJavaScript(Ajax)の適材適所での利用は不可欠だと思っています。 以上のことを踏まえた上で読んでいただけるとありがたいです。 こんな記事を見つけた。 次世代画像クルージング技術「ImageCruiser」、楽天市場で実験開始 :: SEM R 色検索とか地図検索とか作っていろいろ思うところが多い者としては、行く末が気になります。 予想を裏切って欲しいという意味で、成果があがることを期待しつつ。 が、どうしても気になっていて、これ画面ね

    chaws2004
    chaws2004 2009/01/08
    もやもやと頭の中で考えていたことで、とても共感できます。すばらしい記事です。Flashそのものが悪いということは決してないです。
  • IDEA * IDEA

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

    IDEA * IDEA
  • 多くのユーザーは一度に1本しかジュースを買わない ― @IT

    ユーザビリティのヒント(1) 多くのユーザーは 一度に1しかジュースを買わない 「自動販売機での不要な動作から考える」 ソシオメディア 上野 学 2006/6/2 Webアプリケーションのユーザーインターフェイスデザインに役立つさまざまなTips集。自動販売機でジュースを買うときの不要な動作から考える。(編集部) 今回からはWebアプリケーションのユーザーインターフェイスの続編の「Tips編」として、ウェブアプリケーションのユーザーインターフェイスをデザインするうえで役立つさまざまなヒントを、少し細かな視点から具体的に見ていきます。 複雑な構成物を作り上げるには、基となるコンセプトやアーキテクチャといった抽象度の高い部分から考えていくトップダウン式のアプローチと、構成要素の細部から考えていくボトムアップ式のアプローチの両方が必要になりますが、前回までの経験則編はどちらかといえばトップダ

  • webサイトを作る時に顧客とあらかじめシンクロしておくと良い7つの基礎*ホームページを作る人のネタ帳

    webサイトを作る時に顧客とあらかじめシンクロしておくと良い7つの基礎*ホームページを作る人のネタ帳
  • UIパターンいろいろ - DesignWalker

    UIパターンいろいろ - DesignWalker