サービス普及のためのユーザーインターフェース指向型サービス開発
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog はじめに 島津悠樹と申します。Yahoo!ブックマークのディレクションを担当しています。本エントリーでは、エンジニアのみなさまや企画担当の方を対象にサービス普及施策のヒントとなるような話題をお届けします。 「サービス普及のために何をすべきか？」 おそらくサービス関係者にとって永遠のテーマといえるこの課題に対し、ユーザーインターフェース（UI）を起点にサービスのあり方を考える方法が有効です。 特に効果的と思われるのは「アフォーダンス」と呼ばれる概念を応用した取り組みです。これより詳しくご紹介します。 アフォーダンスとは？ 認知心理学の分野から出てきたのが、デザイン業界で転じて、道具の使いやすさ実現のためのキーワードとなりました。その
IBMがWebアプリケーションのUIガイドラインとHTML/CSSのソースコードを公開
業務アプリケーションがWebアプリケーションとして開発されるのは現在の大きなトレンドです。それに伴ってHTMLとCSSによって業務アプリケーションの複雑なユーザーインターフェイスを構築する必要性が生じます。 しかし機能が豊富な業務アプリケーションのユーザーインターフェイスをHTMLとCSSで構築するのはそれほど簡単ではなく、しかもそれをアプリケーション全体で統一し、優れたユーザビリティを実現するのはさらに手間のかかる作業です。 そうした業務用のWebアプリケーションのユーザーインターフェイスを構築するためのサンプルが豊富に含まれたガイドライン「IBM Lotus User Interface Developer Documentation」が、IBMから公開されました。 今回公開されたIBMのガイドラインは、同社のLotus製品群のユーザビリティを統一するための社内プロジェクト「One U
第35回 覗き見対策 | WIRED VISION
第35回 覗き見対策 2009年9月15日 （これまでの増井俊之の「界面潮流」はこちら） パスワードを使って計算機やWebサービスにログインするとき、パスワードは「****」のように伏字で表示されるのが普通です。秘密のパスワードが表示されて他人に見られると大変ですから、このような方法で入力文字を隠すのは当然と考えられていますし、他人がパスワードを入力しているときはキー操作が見えないように別の方を向くのが常識的なマナーだと思われています。 ところがユーザビリティの専門家であるJacob Nielsen氏が6月23日に突然、自分のブログで「パスワード入力の伏字は有害である」と言いだしました。 伏字が有害だとNielsen氏が言った理由は以下のようなものです。 ユーザの操作に対しては常にフィードバックが返るべきである 本当にパスワードを盗もうとする奴はキーボードを見るから伏字にしてもあまり意味が
「進むボタン」と「戻るボタン」のちょっとした法則【ユーザビリティTips】
『MarkeZine』が主催するマーケティング・イベント『MarkeZine Day』『MarkeZine Academy』『MarkeZine プレミアムセミナー』の 最新情報をはじめ、様々なイベント情報をまとめてご紹介します。 MarkeZine Day
今だからこそ、「軽量なウェブサイト」を作ることが重要、というお話。 - Feel Like A Fallinstar
最近はJavaScriptのライブラリ整備や、大きなモニターが増えたせいもあり、リッチな見た目のサイトが増えてきたなーって思います。 でも、その一方で、それ以上に増えている様相なのが「低速度回線」のユーザ。 今だからこそ、技術をきちんと理解して軽いウェブサイトを作るべきなんじゃないか、というお話を少し。 増えているのは、フレッツよりも「持ち歩きPC」「スマートフォン」のアクセス これは今木が運営する、とあるポータルサイトの利用者の接続速度の変化のデータです。 月間PVが大体150,000位で、割と昔からあるタイプのまじめなコンテンツのサイト。携帯は対応していませんし、IT系とかに偏ったコンテンツもありません。 見ると分かる傾向は ダイヤルアップ、実はあまり減っていない ケーブルはそこまで延びていない Unknownが年々増えている ADSL / 光(T1）も割合としてはむしろ減少傾向 グラ
Search User Interfaces
Book Contents This book presents the state of the art of search interface design, based on both academic research and deployment in commercial systems. "This will be seen as a transformational book -- one that synthesized a new, coherent discipline of human information interaction out of literature and experience scattered across many fields." - Dr. Stuart Card "[H]igh praise ... Apart from being
Yahoo!検索の「ユーザーインターフェース設計」
分業による効果 一般的なデザイン作業において、下記のようなデザイン作業の上流部分をごく限られた人数で行い、そこから先の展開部分を大人数で行う方法を取る場合が多いと思われます。 インタラクションの設計 ビジュアルの設計 主要要素のHTMLマークアップ・CSSコーディング設計 しかし、モジュールの概念を取り入れることにより、デザイン作業の上流部分から分業を行うことが可能になります。 作業者のスキルやサービスへのコミット具合によって、多少ぶれる場合もありますが、そこはサービスの全体的なルールや作業時の補助ツールによってコントロールを行うことが可能です。 そのため、モジュールの命名規則や運用ルールについては、あらかじめドキュメントを作成した上で、ある程度厳密に運用を行う必要があります。 コミュニケーションの効率化による効果 最初にインタラクションの設計時に命名したモジュール名や要素名を、ビジュアル
Google が行う様々な実験
前回のブログでは、ユーザーの皆さんに最高の検索体験を提供するための、Google の理念をお話しました。もし間違って入力しても自動修正してくれる「もしかして」や、各検索結果を説明するスニペットなどの単純な機能の背景には、複雑なアルゴリズムが存在しています。Google は、どのアルゴリズムが優れたものなのか検証するために、ごく一部のユーザーの皆さんに新しい機能を試験的に提供する「実験」を行っています。（注：今回のブログ記事では英語での実験の画像を使っていますが、日本でも同様の実験を日々行っています。） 私たちは「実験」をとても大切だと考えていて、検索結果に加えた変更の良し悪しをテストするために幅広く活用しています。 Google では常時 50 ～ 200 にわたる実験を行っています。実験の中には、ページをじっくり見てもほとんど違いが分からないような細かい変更もあれば、一目瞭然のものもあり
Googleが目指す最高の検索UI
数ヶ月前にウディ・マンバーがサーチクオリティグループの存在を紹介し、この連載でも前に文書のランキングについて触れました。ウェブ文書のランキングはグーグル検索の品質の要ですが、皆さんの行っている検索はそれよりもっと多くのものから成り立っています。今回は、グーグル検索の発展を支えている理念とその実例について述べようと思います。また、グーグルがいかに徹底した実験を通して確実に機能を向上させているかについても述べるつもりです。次回は、現在行っている実験のいくつかを紹介する予定です。 まずは自己紹介から始めましょう。私の名前はベン・ゴメス。1999 年からグーグルで主に検索品質を中心に検索にたずさわってきました。ロボットによるページの収集からランキングまで検索エンジンのほとんどに貢献するという幸運に恵まれ、現在は検索インターフェースと検索機能の技術責任者として働いています。 グーグルの検索ユーザーイ
Yahoo!ニュース高速化へのサイトデザイン側からのアプローチ
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは、Yahoo!ニュースのデザイナーの黒田・由衛です。 Yahoo!ニュースが2009年4月27日にリニューアルしました。今回のリニューアルでは、お客様に快適にサイトを利用していただけるよう最速でページを表示させることに重点をおきました。 お客様がウェブを閲覧するのは1日の中のほんの限られた時間です。その貴重な時間を割いてYahoo!ニュースに来ていただくわけですから、1ページでも多くの記事を「読みやすく」「ストレスなく」見ていただけるようにするのが、Yahoo!ニュースがお客様にできる最高のおもてなしだと考えています。そこで、今回のリニューアルでは、サイトデザイン側からのアプローチとして以下の2点の施策を行いました。 １
その表現、ユーザに分かりやすいですか？ (ユーザビリティ実践メモ)
ユーザにとって分かりやすい文言・説明はウェブコンテンツ制作の基本です。 専門用語は思った以上にユーザに理解されていませんし、会社固有の名称・モデル名なども説明がなければユーザには何のことか分かりません。 最も個別製品ページへ進みたいと思うページはどれでしょうか。 例Aのように専門的な説明文章の場合はどうでしょうか。 専門用語が多く、各製品の違いを簡単には理解できません。 例Bでは、製品モデル名や型番のリンクのみを展開しています。 これではそれぞれの製品の違いが分からず、どの製品を見るべきかユーザはわからないため、ここで離脱してしまう可能性があります。 例Cが最も個別製品を選択しやすいのではないでしょうか。 価格、形、馬力といった大まかな情報があるため、各製品の違いが端的に分かり、詳細を確認するステップに進みやすくなります。 製品一覧ページに限らず、ユーザ（製品やサービスに詳しくない人）にと
エンジニアにもわかる「ユーザーインターフェース設計」
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog はじめに 島津悠樹と申します。Yahoo! JAPANのソーシャルメディア系サービスの開発・ユーザーインターフェース（以下UI）設計を担当しています。私からは「エンジニアにもわかる『ユーザーインターフェース設計』」と題し、エンジニアのみなさまに考え方のヒントとなるようなネタをお届けします。 エンジニアの方々にとって、UI設計は、おもしろそう、けれど、どこかとっつきにくい......、そんな印象を持っておられるのではないかと思います。 私も以前はそう思っていました。ですが、とっつきにくさを理由にUI設計をやらないのはもったいない、という思いで試行錯誤した結果、なんとか、UI設計のお仕事をいろいろ担当させていただくことができるようにな
使い易いユーザーインタフェースとは何かを勉強しています。そこで、質問です。使い易いユーザーインタフェースを持ったウェブサイトやソフトウェアを教えてくださ.. - 人力検索はてな
使い易いユーザーインタフェースとは何かを勉強しています。 そこで、質問です。 - 使い易いユーザーインタフェースを持ったウェブサイトやソフトウェアを教えてください - また、それが使い易いと感じた理由を教えてください 条件は以下、 - 一般的なパソコンのディスプレイ、マウス、キーボードで触れるインタフェース - あなたが実際に体験したインタフェース よろしくお願いいたします。
グーグルのビジュアルデザイン責任者が退職--データ中心主義に嫌気
Googleでビジュアルデザインの責任者を務めていたDouglas Bowman氏が退職する。同社ではウェブページの詳細なパフォーマンスデータが重視されており、こうした状況が一因となっているようだ。 同氏が退職について複雑な思いでいるのは明らかだが、好ましからざる点の指摘に遠慮はない。Bowman氏は米国時間3月20日付けのブログ投稿で次のように述べている。 技術者が溢れている企業では、問題を解決するため工学技術を頼りにする。問題を単純で論理的なものに還元し、主観をすべて取り去ってデータだけを見る。やがて、データがあらゆる問題解決を支えるようになり、企業を麻痺させ、斬新なデザインの決定を妨げる。 そう、Googleでは2種類の青色のいずれかで決めかねたら41の中間色をテストして最もパフォーマンスのよいものを選ぶというのは事実なのだ。先日、境界線の幅を3ピクセル、4ピクセル、5ピクセルのいず
成果を上げる携帯サイトのフォーム設計 (ユーザビリティ実践メモ)
離脱されない携帯サイトのフォーム作成術 携帯サイトのフォーム設計のコツ 個人プロフィールからの引用を考慮した携帯サイトフォーム設計 さて、携帯サイトのフォームの入力効率を上げる（完遂率を上げる）には、まず項目数を少なくして入力負荷を減らすことが第一です。 しかしビジネス上の要件から、項目数を減らすことにも限界があります。そこで、入力時のボタン操作など、「ユーザの操作面の負担を少なくする」ことを考えましょう。 1. 入力文字種を指定する テキストエリアの属性としてistyleを指定することで、入力文字種の「全角かな」「半角カナ」「英文字」「数字」をページ側で指定することができます。 携帯電話では文字入力モードを変更するために、2-3回（十字キーを使う場合はもっと多くなります）ボタンを押さなければなりませんので、この指定だけでもユーザの負担は大きく減ります。 ※タグや属性の詳細な仕様に関しては
楽器とかインターフェイスの話 - SLN:blog*
ピアノがうまいとか、ギターがうまいとか、ドラムがうまいとか、「音を出す」っていう根本的な所を考えれば、ウマ/ヘタはあまり関係ないはずなんだけども、例えば譜面のような「演奏を再現する」という目的がある限り、その精度によって「うまさ」というのはどうしても測られてしまうわけだよね。もちろん、そういった「うまい」演奏というのは、それはそれで見ていて気持ちいいし、高揚したりもするんだけど、今回注目してみたいのは、そういった「うまい」演奏ではなくて、そこから逸脱しているもの、例えば本来楽器ではないものを楽器にしている、本来の使い方とは違う方法で演奏している、ようなもの。こうした一風変わったテクニックの中に、人と楽器のインターフェイスを考える上でのいろいろなヒントが隠されているような気がしている。 本来の用途とは違う使い方をしている代表格として、レコードをこする事で音を出すスクラッチがあげられると思う。
iPhone 向けの画像検索が新しくなりました
iPhone と iPod touch 向けに、画像検索の提供を開始しました。 この新しい画像検索結果ページでは、1 ページで最大 20 枚の画像を一度に見ることができ、そこから気に入った画像を選んでさらに詳細な情報を得ることができます。詳細ページからは、もっと大きなサイズで画像のサムネイルを見たり、その画像の含まれているウェブページに移動したり、また画像だけを最大化して表示することもできます。また、新しい検索結果ページでは、「検索対象」フィルタを使って、表示される結果を、人の顔、クリップアート、線画、写真に絞り込むことができます。 ぜひ、 iPhone または iPod touch から、 google.co.jp にアクセスして試してみてください！ 1. まずは、google.co.jp にアクセスして、「画像」リンクをクリックし、キーワードを入力します。
最近のAR事情 - 強火で進め
最近、「新しい技術」タグを付けるような内容のエントリー書いてないなぁ。と言うのと以前、twitterでセカイカメラの話があったときに「こんなのもあるよ」とつぶやいたら意外と「反響があった＆結構みんな知らなかった」という状況だったのでSREngineなどを中心にAR関連のこと書いときます。 SREngineとはこちらのサイトのSeinさんという方が作られている「シーン(景色や風景)を識別するソフトウェアエンジン」です。 とりあえずムービーを見てもらったらすぐにこの凄さが分かると思います。 識別した情報を元にセカイカメラの様なことや 現実の撮影データの上にお店の評価やカーナビの様な情報も表示できるみたいです。これは実際に使ってみたい!! Sein blog: 【拡張現実AR】SREngine for iPhoneプロトタイプの動画 http://semanticlog.blogspot.com
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
長文日記
長文日記