タグ

uiに関するh5y1m141のブックマーク (13)

  • Google Code Archive - Long-term storage for Google Code Project Hosting.

  • SIMILE | Timeline

    Timeline has graduated! The Timeline project has graduated and moved on with its life. Visit the new home page for more information on how to join the new mailing lists, synch with the new code repositories, issue tracking, etc. Please excuse our mess during the transition. Timeline is a DHTML-based AJAXy widget for visualizing time-based events. It is like Google Maps for time-based information.

  • ジョルダン touch!

    【サービス終了のお知らせ】 2011年12月20日(火)をもち、サービスを終了いたしました。 スマートフォンからは、「乗換案内NEXT無料版」をご利用ください。(同等の機能がご利用いただけます) 長らくご利用いただきまして、誠にありがとうございました。引き続き、「乗換案内」をよろしくお願いいたします。

  • ソシオメディア | UIデザインパターン

    ソシオメディアが独自に提供するUIデザインパターン集。これを使えばUI設計を効率化できます。

    ソシオメディア | UIデザインパターン
  • POLAR BEAR BLOG: 地図型ショッピングサイト -- BrowseGoods

    既に TechCrunch などでも紹介されていますが、information aesthetics 経由で知りました。オンラインショッピングサイトは様々な工夫をするものが登場していますが、まるで Google Maps を操作するかのように商品が探せるサイト、とのこと: ■ Browse Goods これは説明するより、触ってもらえば一目瞭然でしょう。最初はこんな風に、まるで大陸のように大カテゴリが表示されているのが: 「地図」を拡大(クリックもしくは画面左側の縮尺スライダーで)していくと、どんどん小カテゴリが表示されて、最終的に個別の商品にたどり着くというもの: この画面まで来ると、Amazon.com 経由で商品が買えるようになっています。また一応、ディレクトリ機能・検索機能も付いています。 このアイデア、確かに視覚的に分かりやすいし、デパートでフロアマップを見て売場に行く感覚に近い

    POLAR BEAR BLOG: 地図型ショッピングサイト -- BrowseGoods
    h5y1m141
    h5y1m141 2007/02/23
    このUIはなるほどなぁと思ったけど、多少動作がもっさりとしているのが気になる
  • メールの視覚化

    メールで情報をやり取りする際に面倒な点の1つは、前後の話のつながりを追いづらいことですよね。例えば Gmail のように、関連するメールをスレッド形式で表示するなどといった工夫もありますが、話の流れが複数に分散した時に把握しづらくなります。そこでIBMがこんなアイデアを考え出したとのこと: ■ Thread Arcs (visualcomplexity.com) 2003年発表とのことですから、既にご存知の方も多いかもしれません。個々のメールを「点」で示し、他のメールとの関連を「弧(arc)」で示す「スレッド円弧(Thread Arcs、スレッド・アーチと意訳した方がカッコいいかも)」というアイデア。中が塗りつぶされている点は他人のメールを示し、さらに色の違いで送信者などを表すようになっているそうです。より詳しい情報は、IBMの公式ページからどうぞ: ■ THREAD ARCS: An E

    メールの視覚化
  • 人力検索はてな - 入力フォームのデザインがすばらしいページを教えてください。 派手さや装飾ではなく、使いやすさ、見やすさなど機能美優先でお願いします。 海外のサイトでも結構で

    入力フォームのデザインがすばらしいページを教えてください。 派手さや装飾ではなく、使いやすさ、見やすさなど機能美優先でお願いします。 海外のサイトでも結構です。

  • form の内容がデフォルト値から変わったら色を変える JavaScript コード - swk's log

    * form の内容がデフォルト値から変わったら色を変える JavaScript コード [mform] 103 users これが便利だといえる状況はだいぶ限られてはいるのだけど.文字を入力したり,チェックボックスを押したりしてデフォルトの状態から変化すると,そこの色を変えるような JavaScript のコードを書いてみた. といってもわかりにくいと思うのでまずデモ: http://www.kagami.org/mform/mform_demo.html 適用したいページで,こんな JavaScript コードをロードします. (function(){ var color_modified = '#ffff88'; var reset_when_reloaded = 1; init(); function init() { var fs = document.forms; for (v

  • フォントの色と大きさと背景色の微妙な関係 | S i M P L E * S i M P L E

    フォントの色と大きさと背景色の微妙な関係 December 26, 2006 10:00 AM written by 8maki 12月1日からクリスマスまで、日替わりでウェブ制作のちょっとしたTipsを紹介する「24 ways」が今年も開設されているようです。 その24 waysから一つご紹介。 » 24 ways: Cheating Color フォントの色と大きさと背景色についてのTipsです。 わかりやすく例を出していきましょう。 架空の会社のロゴを例にしてご説明します。まず、大きいフォントで「Double Dagger」という社名があり、その下に小さいテキストが入っています。よくあるデザインですよね。さて、このデザインについて見ていきましょう。 ■ 薄い背景に明るいフォントの場合 さて、下に2つのロゴがあります。 左のロゴは色の統一感のルールに従って社名とテキストを同じ色にしてい

  • キャズムを超えろ! - 団塊~シニア層向けのWeb設計 やっちゃいけない10のUI

    一時期パソコン教室の講師をやっていたことによる経験と、昨今Webサービス運用にあたって中高年層からのクレームなどを自分なりにまとめた結果として、50代以上のユーザに対するWebサービスPCアプリケーションのUI設計における以下10のTIPSを公開してみたいと思う。...といってもたかだか10個で収まる簡単な話ではないので、思いついたら都度追加して行きたい。 ID,ニックネームを考えさせてはいけない。半角英字開始限定は論外 IDやニックネームが思いつかない方が多い。これはシニアに限らず、ITリテラシーがそれほど高くない若年層についても言えること。作る側の人間も「過去にWebで使ったID,Nicknameは全て使っちゃダメ。何か新しいのを考えて入れてみて。」と言われると結構悩んじゃうもの。それと同じ状態に陥ると思っていただけるとわかりやすい。「IDのかわりに電話番号でもいいですよ」というと結

    キャズムを超えろ! - 団塊~シニア層向けのWeb設計 やっちゃいけない10のUI
    h5y1m141
    h5y1m141 2006/11/27
    こういう年齢層に応じたUI っていうのを動的に変化できるようなwebサイトっていうのがあったりするとおもしろかったり。
  • トム・ケリーに学ぶ子供のような好奇心

    今朝、スポーツジムで泳いでいる時に水の中にブルーのグラデーションがかかっているのを見ながら思ったことは、「これってユーザーインターフェイスに応用できないかな?」である。そこで会社についてさっそく作ったプロトタイプがこれ(インタラクティブなデモもある―要Java Runtime)。 イノベーションを起こそうとするときに最も大切なことは、会議や書類作りではなく、とにかく手を動かしてプロトタイプなどの形に落とし込むこと。こうやって実際に触って感触を味わえる形にするとしないとでは、コミュニケーションの効率が全然違う。 好都合にも、CNetにトム・ケリーのインタビュー記事が載っていたので引用させていただく。 それから、とにかくプロトタイプを作って形に落とし込むこと。新たなことを試みる実験精神と、新しいものに対して興味を持つ子供のような好奇心も必要です。固定観念や先入観にとらわれては真のイノベーション

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

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

  • WYSIWYGよ、さようなら

    Macintoshスタイルのインタラクションデザインは限界に達した。Results-Oriented UI(結果志向のユーザインタフェース)と呼ばれる新たなパラダイムが、ユーザに大きな力を与える日がやってくるのかもしれない。 R.I.P. WYSIWYG by Jakob Nielsen on October 10, 2005 これまでの25年間、あるスタイルのユーザ・インターフェイスが幅を利かせてきた。Macintoshスタイルのグラフィカル・ユーザ・インターフェイス(GUI)である。しかし、今、それは限界に到達し、あるスタイルに取って代わられようとしている。GUIの土台にある貴重なインタラクション原理が、部分的とは言え、覆されようとしているのだ。 MacスタイルのGUIは、それ以前のインタラクション・パラダイムと比べると非常に使いやすいものだった。コマンドやパラメーターを直接入力するの

    WYSIWYGよ、さようなら
    h5y1m141
    h5y1m141 2005/10/18
    ゴールを設定して、その作業をやりやすくするためのGUIっていうのも面白いね
  • 1