タグ

uiに関するVoQnのブックマーク (101)

  • xtel Theory: Design Theory of Ubiquitous Content: 第2講 インタラクションデザインの歴史 その1

    コンピュータとはなにか。デザイン思考の考え方では、コンピュータのコンセプトはなにかに答える形でこうした問題に答える。コンセプトとはものの形やサービスの形、あるいはインタラクションの形のことである。サービスやインタラクションは一定の時間の流れの中で行われるため、ダイナミックな形になる。 さて、ドミナントデザインという言葉がある。イノベーション研究の分野で使われている。CDプレイヤーやビデオレコーダーのように市場で一つのプロダクトデザインしかないとき、それをドミナントデザイン(dominant design)と呼ぶ。 現代のコンピュータはフォンノイマン型のシステムにソフトウェアプログラム開発環境が付け加わったコンセプトがドミナントデザインになっている。フォンノイマン型とはWikipediaによれば「プログラムをデータとして記憶装置に格納し、これを順番に読み込んで実行するコンピュータである。スト

    VoQn
    VoQn 2008/06/02
  • Moto Labs - multi-touch:home

    VoQn
    VoQn 2008/04/20
    processingでマルチタッチテーブルの実装。
  • ゲームの右と左 マリオはなぜ右を向いているのか - 最終防衛ライン3

    *ここでのゲームテレビ、ビデオ、コンピュータゲームを指す *長文なので、なげーよ!論点まとめろよって人は、味も素っ気も無いけど 簡略版 へゴー 島国大和のド畜生 物語の進行方向について(日漫画のメリットとか) 「チキチキマシン猛レース」は常に右から左に向かってレースをしているのだ。 物語は舞台の上手(かみて)から下手(しもて)、つまり右から左に進むのが洋の東西を問わず一般的。映画などでも、主人公は上手の右、敵役は左にいる。主人公は右から入場し左へと退場していく。つまり、物語は「←」と右から左へ進行する。縦書き右綴じな日漫画は「←」で右から左に物語が進むが、横書き左綴じの西洋の漫画は「→」と左から右に進む。日漫画は左右が映像のロジックと一致しており大変読み易いと言える。 しかし、ゲームは「→」と左から右へ進行する。スーパーマリオブラザーズを始めとする横スクロールアクションやグラデ

    ゲームの右と左 マリオはなぜ右を向いているのか - 最終防衛ライン3
    VoQn
    VoQn 2008/03/31
    これブクマした時、ゲームの現場入るって予想してなかったけど、現場入ったらうんざりするくらい語るので。ゲームのナラティブと舞台芸術論の話
  • 第17回 検索と入力の素敵な関係 | WIRED VISION

    第17回 検索と入力の素敵な関係 2008年1月11日 IT コメント: トラックバック (0) (これまでの増井俊之の「界面潮流」はこちら) 「入力システム」という言葉を聞くとキーボードやかな漢字変換システムのことを連想するでしょうし、「検索システム」という言葉を聞くとGoogleのような検索サイトやSpotlightのようなデスクトップ検索システムのことを連想するもので、入力と検索は全く別物と考えられているのが普通です。一方、辞書やWebで検索した単語や例文を自分の文章にコピペしたり、面白いサイトのURLをメールに貼り付けたり、検索結果を自分の文章作成に利用することは広く行なわれています。実は検索と入力はほとんど一体のものであると考えると両者の関係がすっきりします。 ■検索と入力の関係 検索結果を自分の文章にコピペするだけで文章を作ろうとは普通は考えないかもしれませんが、POBoxのよ

    VoQn
    VoQn 2008/01/13
    macOSにもそういうソフトないのかな
  • Mosaic、アルバム、参考リンク - FAX

    photos.svgこういう雑然と並ぶインターフェースあるなぁ。Flashとか。タッチスクリーンとかのデバイスじゃないと当に楽しくはないんじゃないかしら。でも、触って楽しい。 Rodney Smith - Portfolio写真家さんのポートフォリオ。マウスオーバーで拡大画像がピコピコでる。Lightboxとか使ってるへっぽこいサイトに比べるとかなりいい。ポイントは、マウスカーソルの反対の辺に拡大画像が出るところ。なんでかというと、これからポイントするサムネイルが見えなくなってしまわないように。でも、ポイントする場所と、出てくる画像が離れてしまっていて、実は左右の視線の移動量が多く、当に見たい拡大画像に意識が集中できない。かたっぽでお手玉しながらラーメンべるようなもん。そういうことに気がついた。Mosaicでは、拡大画像がマウスカーソルの邪魔にならないようにくっついていくことで、視線

    VoQn
    VoQn 2007/11/30
  • Rauru Blog » Blog Archive » アイカメラから得られた23の教訓

  • 第10回 UIデザインの基礎知識:シンプルで使いやすいビジュアル

    利用者の操作を把握した後,画面のビジュアル・デザインに着手する。 ビジュアル・デザインにおいても,シンプルであることは重要なポイントである。「よく切れるナイフ」がシンプルで美しい機能美を備えているように,「使いやすいシステム」もまた,シンプルで美しいビジュアルを伴っているものだ。派手な見た目や奇をてらった演出はいらない。必要十分な画面要素を人間の認知心理に基づいて論理的に配置すれば,十分に使いやすいビジュアル・デザインを作り出せる。 要素を絞って目立たせる 図1は,ビジュアル・デザインを見直し,使い勝手を改善した例である。この画面はどちらも,デジタル・カメラの写真データからカレンダーを作るという電子商取引システムのトップ画面である。改善前より改善後の画面の方が,「オリジナルのカレンダーを作ろう」という提案メッセージが伝わってこないだろうか。 主な改善点は,表示要素を大幅に絞り込んだことであ

    第10回 UIデザインの基礎知識:シンプルで使いやすいビジュアル
    VoQn
    VoQn 2007/11/02
    認知パターンに合わせて画面をレイアウト
  • 第9回 UIデザインの基礎知識:操作の流れに気を配ったインタラクション

    使い勝手は,ユーザー・インタフェース(UI)の「デザイン」によって大きく変わる。一般にデザインという場合,画面上の要素について色や配置を決めていく「ビジュアル・デザイン」だけを想像しがちだ。出来上がったシステムに対し,「使い勝手の良いデザインを作ってほしい」と依頼するようなエンジニアは,たいていビジュアル・デザインに目が向いている。 実際はビジュアル・デザインだけでなく,利用者とシステムの対話方式を決める「インタラクション・デザイン」がある。画面遷移などを含むもので,ビジュアル・デザインよりも先に決める必要がある。インタラクション・デザイン抜きにビジュアル・デザインで帳尻を合わそうとしても限界がある。 UI設計に携わるエンジニアは,インタラクション・デザインとビジュアル・デザインの両方の基礎知識を持つ必要がある。システムによってはプロのデザイナーがプロジェクトに参加することもあるはずだ。デ

    第9回 UIデザインの基礎知識:操作の流れに気を配ったインタラクション
  • web-conte.com | blue | なぜみんな角丸が好きなのか?

    タイトルに惹かれ、「Why Do We Love Rounded Corners?」というこの記事を訳してみた。何が書いてあるのかと思って。われながら、あまりいい訳とも思えないけれど。 インターフェースの設計者やグラフィックデザイナーと同様、われわれも「丸みを帯びたコーナー」に取り憑かれている。Webの開発者はCSS(や、ときにJavaScript)を創造的に用い、可能なかぎり手間をかけずに角丸を表現することを目指して、そのことにどんな苦労もいとわなかったものだ。現在提案されている CSS3 の定義書には、角丸を指定するためのプロパティすら含まれている(Firefox はすでにこのプロパティをサポート済みだ)。 なぜそんなに角丸には魅力があるのか。思い切ってこれから述べようと思うのは、われわれが角丸に魅了されるこの現象が審美的なレベルを超えたものではないかということ。それともう二、三のこと

    web-conte.com | blue | なぜみんな角丸が好きなのか?
    VoQn
    VoQn 2007/10/22
    プロダクトの角Rが与えられる理由とGUIに使われる角丸の理由は次元が違うと思うのだけど。
  • SIGHCI: 第126回ヒューマンコンピュータインタラクション研究会

    招待講演 「最速インターフェースの研究と実践」 mala氏(ライブドア) 略歴 1982年生まれ.株式会社ライブドア開発部所属 2004年12月よりブログ「最速インターフェース研究会」を書き始める. 2006年2月 ライブドア事件直後のライブドアに入社.好評を博す. 2006年4月 livedoor Readerをリリース. 2007年7月 livedoor Readerの海外版となるFastladderをリリース. 招待講演 「他者の力:意思決定における社会的要因」 渡邊克巳(東京大学 先端科学技術研究センター) 略歴 1995年 東京大学文学部心理学科卒業 1997年 東京大学大学院総合文化研究科卒業(学術修士) 2001年 カリフォルニア工科大学(Ph.D) 2001年 日学術振興会特別研究員(PD)-順天堂大学医学部 2002年 National Eye

    VoQn
    VoQn 2007/09/03
    行けるなら見たい
  • 認知的ウォークスルー: DESIGN IT! w/LOVE

    不確実な時代をクネクネ蛇行しながら道を切りひらく非線形型ブログ。人間の思考の形の変遷を探求することをライフワークに。 認知的ウォークスルーは、ユーザビリティ・インスペクション(ユーザビリティ評価)の手法の1つで、テストルームで行うユーザビリティテストなどとは異なり、実際のユーザーを使わずに専門家による分析的評価を行う方法です。 認知的ウォークスルーとはウォークスルーとは、芝居の立ち稽古のことで、衣装や舞台装置を使わなず普段着で台を片手に行う稽古を指します。 認知的ウォークスルーも同じように、事前にマニュアルを読んだりトレーニングを受けたりすることなく、使いながら操作を理解していく際の認知モデルである探査学習理論に基づき、ユーザーが実行するタスクの各プロセスごとに、以下の4つの探査学習ステップをそれぞれ評価していきます。 目標設定:ユーザーはいま何をするかを設定する探査:ユーザーは目の前の

    VoQn
    VoQn 2007/07/26
  • 赤ん坊でも使えるiPhoneとギークにも使えないW-ZERO3 - アンカテ

    狐の王国: どエスとかアドエスとかいうAdvanced/W-ZERO3(es)は誰が殺したのか? Life is beautiful: 直感的なUIとhande-eye-cordinationの話 当然、どちらも私にとっては気になってしょうがないデバイスなんだけど、対照的な報告が上がってきている。 私は、Advancedでない方のW-ZERO3[es]を使っているので、狐の王国のid:KoshianXさんのいらだちはよくわかる(と言ったら「Windows mobile5のイライラ感で同6のイライラ感を語るな!」と言われそうな気もするが)。 アーリーアダプター層が使ってみてブログに何を書くかというのは、これから新商品を売る時の売上に直結する重要項目だ。これまでは、表面的な○×比較によって売上が左右されたのかもしれない。だから、普通のメーカーの商品開発はそういう○×表に最適化されているのかもし

    赤ん坊でも使えるiPhoneとギークにも使えないW-ZERO3 - アンカテ
  • 直感的なUIとhand-eye-cordinationの話

    下のビデオは一歳度児がiPhoneのフォト・アルバムの機能を使っている姿を撮影したものだが、これを見ると「直感的なUI」とは、まさに人間が赤ん坊のうちにマスターする"hand eye cordination(目からフィードバックを受けながら手先を動かして物をコントロールする能力)"に合致したものなのだということが良く分かる。 【追記】参考までに、私が特に好きなUI関連の書物二冊へのリンクを張っておく。特に「誰のためのデザイン」はUIが単なるソフトウェアやウェブ・サイトのUIデザインの問題ではないことに目を開かせてくれる良書だ。 ・誰のためのデザイン?—認知科学者のデザイン原論 ・Envision Information

    VoQn
    VoQn 2007/07/23
    なんかいつも大人が議論してるスペックどうのこうのとかホントつまらない話に思えてくるね
  • なんでヒトはコンピュータが動かないからといって文句を言ったりするの?(本当の意味での人間中心のデザイン): DESIGN IT! w/LOVE

    不確実な時代をクネクネ蛇行しながら道を切りひらく非線形型ブログ。人間の思考の形の変遷を探求することをライフワークに。 動かない/動きが遅いコンピュータに対してイライラしたり、ひとりでコンピュータに向かって文句を言ったり、ひどい場合は机をバン!と叩いて怒ったりした経験は誰にも一度くらいはあるのではないでしょうか? コンピュータじゃなくてもそうですよね。意図したとおりに機械(たとえば自動販売機とか)が動作してくれなかったりしたときには、つい文句を言ってしまったりします。 個体における心の発達でも、それっておかしいよね。 だって、僕らはそれが機械だということを知っている。機械が人間の言葉を理解しない存在だということもわかっている。 認知科学の研究では、ヒトは生まれてから3ヶ月~6ヶ月で生物的なものの動きをその他のものの動きと区別できるようになり、6ヶ月~9ヶ月では生物以外の物体や自動で動くような

  • 第24回 何かに似せたユーザー・インタフェース

    今回は「何かに似せたユーザー・インタフェース」について考えてみたいと思います。何かに似せたインタフェースというのは,つまりすでにある何かによく似ている,もしくは同じように使えるインタフェースを用意する,ということです。 なんて書くと,「パクリ」や「インスパイヤ」と呼ばれる,流行っているサイトのデザインをそのままそっくりまねる手法を思い出してしまうかもしれません。流行っているサイトのデザインには,もしかしたら何らかの特長的ですばらしい点があるかも知れず,それをまねすることは,「まねただろう」といわれるデメリットを差し引いてもメリットがあるのかもしれませんし,もう少し意味を広げて,すでにあるサイトの良さをいかにうまく取り込むか,ということになれば,すごく意味があることだと思います。 でも今回の「まねる」はそういうほかのサイトのデザインをまねる,という話ではありません。もう少し広い意味であったり

    第24回 何かに似せたユーザー・インタフェース
    VoQn
    VoQn 2007/07/04
    インターフェース記号論
  • 次期Mac OS:UIを革新する『Core Animation』(3) | WIRED VISION

    次期Mac OS:UIを革新する『Core Animation』(3) 2007年6月13日 IT コメント: トラックバック (0) Scott Gilbertson, Leander Kahney 2007年06月13日 (2から続く) これもLeopardの新機能である『Spaces』では、純粋に見て楽しいナビゲーション・システムを使って、複数の仮想ワークスペースの管理や切り替えができる。 オランダのソフトウェア会社、madebysofa社でインターフェースの設計と作成を行なうAustin Sarner氏によると、Apple社のアプリケーションの新しいスタイルは、見栄えのする効果だけではなく、使い勝手にも貢献するという。 「アニメーションは総じて、連続性を生み出すとともに、より直接的なフィードバックをユーザー体験にもたらす。グラフィックスの表示速度が明らかに向上したことに加えて、(ア

    VoQn
    VoQn 2007/06/13
    「たとえば、文書のスクロールは、スクロールバーをいじらなくても、マウスで文書をつかんで上方に「投げる」操作で可能になる。」こういう感性は大事
  • 観的なインタフェースをめざして

    現在使われている計算機のほとんどは ウィンドウやマウスを使った グラフィカルユーザインタフェース(GUI)で操作を行なうようになっているが、 GUIが一般に普及する前は キーボードを使った コマンドラインユーザインタフェース(CUI)で計算機に指示を与えたり 結果を表示させたりするのが普通であった。 CUIに比べるとGUIは圧倒的に操作が直観的になることが多いため、 GUIを持たない計算機は現在ほとんど考えられなくなっているといえる。 家電製品などあらゆる機器で計算機やネットワークの機能が利用されるように なりつつあるが、これらの世界では現在でもCUI的なインタフェースが利用されていることが多い。 たとえば テレビのチャンネルを変えるために リモコンの数字キーでチャンネル番号と決定ボタンを押すという方式はCUI的な操作といえるだろう。 ビデオの録画予約にしても電子レンジにしても 直観的でな

  • 次期Mac OS:UIを革新する『Core Animation』(1) | WIRED VISION

    次期Mac OS:UIを革新する『Core Animation』(1) 2007年6月11日 IT コメント: トラックバック (0) Scott Gilbertson, Leander Kahney 2007年06月11日 ディスク「焼付け」ソフトの『Disco』は、インターフェースへの新たなアプローチを示している。ディスクを焼いている間に煙が出て、コンピューターのマイクに息を吹きかけるとデスクトップの煙が吹き飛ばされる。 米Apple社の最高経営責任者(CEO)を務めるSteve Jobs氏は、6月11日(米国時間)に同社主催の開発者会議の壇上に立つとき、Macのオペレーティング・システム(OS)のアップグレード版を少しだけ披露すると見られている。それは、30年にわたるMacのインターフェースの進化で最も大きな変化を予告するものになるかもしれない。 サンフランシスコで開催される今年の

    VoQn
    VoQn 2007/06/11
    デモムービーだと何の機能かわからなかったけど、iPhoneのようなUXを実現するUIだってコトか
  • ソシオメディア | UIデザインパターン

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

    ソシオメディア | UIデザインパターン
    VoQn
    VoQn 2007/06/09
    これは要確認
  • Microsoft Surface - 新しいタブレット PC

    Microsoft Surface - 新しいタブレット PC