Unix Magazine「インターフェイスの街角」
Unix Magazine「インターフェイスの街角」関連資料 掲示板 2006年4月号 「写真の位置登録」 2006年3月号 「マイ認証」 2006年2月号 「索引ナビゲータ」 2006年1月号 「Greasemonkeyによるブラウザ機能の拡張」 2005年12月号 「本棚演算」 2005年11月号 「Rindaで実世界指向プログラミング」 2005年10月号 「並べる! 技術」 2005年9月号 「TV番組の検索と録画予約システム」 2005年8月号 「位置情報からの検索」 2005年7月号 「逆リンクと兄弟リンク」 2005年6月号 「携帯から位置情報を活用」 2005年5月号 「Ajax」 2005年4月号 「Phidgetsシステム」 2005年3月号 「ファイルシステムによる階層型データの管理」 2005年2月号 「最近の画像認証」 2005年1月号 「位置コミュニケーション」
ゲームの UI 研究 (2007/10/05＠java-ja)
ゲームの UI 研究＠java-ja onk (大仲 能史) 所属：株式会社ドリコム blog：http://onk.blog.drecom.jp/ twitter：http://twitter.com/onk/ tumblr：http://onk.tumblr.com/ よろしくお願いします ゲームと Web の共通点 大きく2つ マニュアルを読まないユーザ層 ゲームの場合 ゲームセンターをベース としているのが原因 web は…… なんで読まないんだろう？ マニュアルの分厚さ('A`)？ マニュアルを読まなくても 操作が分からなくてはいけない ゲームはホントにこれが上手い 2つめ 長時間の連続操作 これが家電と ゲーム / web との 大きな差 だからこそ ユーザをハメる演出 が必要 この点で ゲームは2歩も3歩も 先を行っている
FastFinga : 手書きメモに特化したiPhoneアプリ。秀逸なUIであなたのそのままの字が書けます！801 | AppBank
FastFinga の動画はこちら FastFinga の紹介はこちらから こちらが起動画面。 画面右下の「鉛筆アイコン」をタップすることで文字を書き始めます。 「鉛筆アイコン」をタップしたことで編集モードになりました。 この画面に文字を書いていきます。 こんにちは！ 画面上に文字を書きます。 さて、ここで画面右下の「DONE」か、画面左下の「指アイコン」どちらでもOKなので、タップしましょう。書いた文字が、メモ用紙に反映されます。 どんどん追加で文字を書いていきます。 このように文字が書けました。 このアプリのすごいところは操作感です。非常にスムーズで気持ちいいです。 さて、ここまで書くのに1分かかっていません。 こんな細かい文字なのに、何もストレスなく自分の字で繊細に書けるなんてすごいです。 さて、メモが完成したら、画面上のメールアイコンをタップすることでメールとして送れます。 これか
秀逸なユーザビリティのボタンをデザインするための5つの秘伝 - GIGAZINE
ユーザビリティを考える上でかなり重要なのがボタンのデザイン。聞いた話だと、某どこかのローンお申し込みページではボタンのサイズを極端に大きくして目立つようにして、ボタンに「OK」とか「投稿」ではなくデカデカと「今すぐ申し込む」というようにラベリングしたところ、数百パーセント増しで申込みがあったとのこと。ほんの少しのデザインの差でもバカにはできません。 というわけで、いろいろな有名サイトのアイディアが詰まって練り込まれたボタンのデザインを見てみると、どれもこれも一見すると普通に見えるようでも、実はそうではないことがわかります。それらには共通して5つのルールが適用されています。 秘伝の法則は以下から。 ■秘伝その1：色 ボタンの色はページの他のものよりも目立たせ、より明るく、そしてコントラストを効かせてページのカラーとは対照の色を使いましょう。 ■秘伝その2：場所 ユーザーがすぐに見つけることが
クールにアニメーションしてハイライトしてくれるJavascript『Create a Simple, Powerful Product Highlighter with MooTools』 – creamu
DiaryTechnology クールにアニメーションしてハイライトしてくれるJavascript『Create a Simple, Powerful Product Highlighter with MooTools』 クールなインターフェースを実装したい。 そんなあなたにおすすめなのが、『Create a Simple, Powerful Product Highlighter with MooTools』。クールにアニメーションしてハイライトしてくれるJavascriptだ。 このエントリーでは、かっこよくアニメーションしてくれるインターフェースが紹介されている。HTML、CSSだけでなく、Javascriptも公開されているため、実装するのも容易だろう。ライブラリはMootoolsを使用している。 以下にデモがあるので見ていただきたい。 » Demo クールにアニメーションしてハイ
FirefoxにGUIプロトタイピングの機能を追加するものすごい拡張「The Pencil Project」:phpspot開発日誌
FirefoxにGUIプロトタイピングの機能を追加するものすごい拡張「The Pencil Project」 2008年07月09日- Home - Pencil Project FirefoxにGUIプロトタイピングの機能を追加するものすごい拡張「The Pencil Project」。 Pencil Projectを使えば、予め用意されているGUI部品をキャンバスにドラッグ＆ドロップしてプロトタイプの画面イメージを作成することができます。 ボタンなんかも、ダブルクリックでキャプションを変えることができたり、VisualBasic、VisualC++などのアプリを使って画面デザインをしているイメージに近い操作感が実現できています。 アプリっぽい画面を作ってみましたが、超簡単です。 GUIのスタンドアロンアプリだけでなく、Webサイトにも使うことが出来ます。 HTMLを使って簡単に画面を作
チェックボックス、ラジオボックスをオシャレに表示するJS:phpspot開発日誌
Custom Checkboxes, Custom Radio Buttons, Custom Select Lists チェックボックス、ラジオボックスをオシャレに表示するJS。 次のようなチェックボックス、ラジオボックスにスタイルできるJSです。 <input type="checkbox" class="styled" /> のように、class="styled" で自動スタイルされます。 CSSを変更でデザイン変更可能です。 関連エントリ CSSデザインされたTextAreaサンプル inputのtype=fileをCSSでクールにスタイルするサンプル サイトのチェックボックス、ラジオボタンを可愛い感じにするためのJavaScriptライブラリ
第22回 大きなデータを眺める | WIRED VISION
第22回 大きなデータを眺める 2008年5月16日 IT コメント： トラックバック (0) （これまでの増井俊之の「界面潮流」はこちら) 下図はMacintoshの Disk Inventory X というソフトで私のホームディレクトリの中のファイルの大きさを視覚化したものです。 大きなファイルが大きな矩形で表現され、ファイルをまとめたフォルダも矩形として階層的に表現されています。 一方、下図はWindowsの SequoiaView というソフトを使ってファイルの大きさを視覚化した例です。 後発のDisk Inventory Xは、おそらく SequoiaView に触発されたと思われるので外見がよく似ていますが、階層的に配置した矩形の集合でファイルサイズを表現するという方法は、University of Maryland の Human-Computer Interaction
Googleがデザインするときに大切にしている10個の原則 - GIGAZINE
Googleのユーザーエクスペリエンスチームに所属するSue Factor氏が、Googleの公式ブログにて「Googleらしいデザイン原則」について、10個の原則を提示しています。デザインというか、ネットサービスの設計自体に関する原則となっており、さまざまな場面で応用できそうなものとなっています。 詳細は以下から。 Official Google Blog: What makes a design "Googley"? Googleのデザイン原則は以下の通り。 1.人々に焦点を当てろ――彼らの生活、彼らの仕事、彼らの夢に 2.すべてはミリセカンド単位で数えろ 3.シンプルにすると強力になる 4.初心者ユーザーを引き込み、上級者ユーザーを魅了しろ 5.革新に挑め 6.世界に通用するデザインを 7.今日と明日のビジネスのために計画せよ 8.気を散らさず、目を楽しませるようにしなさい 9.人々
[JS]高いカスタマイズ性を備えたLightbox風のスクリプト -nyroModal
nyroModalは、アニメーションを伴って表示・非表示される、高いカスタマイズ性を備えたモーダルウインドウを生成するスクリプトです。 nyroModal デモページ nyroModalが生成するウインドウには、テキストなどのコンテンツをはじめ、複数の画像を使用したギャラリーや動画、AJAXコンテンツやフォームなどを表示することができます。 また、デフォルトのままでも気持ちよく表示・非表示されるアニメーション、背景、ウインドウなどをカスタマイズすることも可能です。 nyroModalはjQueryのプラグインのため、動作にはjquery.jsが必要です。
ゲームの右と左 マリオはなぜ右を向いているのか - 最終防衛ライン3
＊ここでのゲームはテレビ、ビデオ、コンピュータゲームを指す ＊長文なので、なげーよ！論点まとめろよって人は、味も素っ気も無いけど 簡略版 へゴー 島国大和のド畜生 物語の進行方向について（日本漫画のメリットとか） 「チキチキマシン猛レース」は常に右から左に向かってレースをしているのだ。 物語は舞台の上手（かみて）から下手（しもて）、つまり右から左に進むのが洋の東西を問わず一般的。映画などでも、主人公は上手の右、敵役は左にいる。主人公は右から入場し左へと退場していく。つまり、物語は「←」と右から左へ進行する。縦書き右綴じな日本の漫画は「←」で右から左に物語が進むが、横書き左綴じの西洋の漫画は「→」と左から右に進む。日本の漫画は左右が映像のロジックと一致しており大変読み易いと言える。 しかし、ゲームは「→」と左から右へ進行する。スーパーマリオブラザーズを始めとする横スクロールアクションやグラデ
「Joel on Software」の筆者が語る“人を幸せにする”ソフト開発のポイント：ITpro
2008年2月13日，ソフトウエア開発者向けイベント「Developers Summit 2008」（主催：翔泳社）が始まり，米Fog Creek SoftwareのCEOであるJoel Spolsky氏（写真1）がセッションに登壇した。Spolsky氏は，ソフトウエア開発についての諸問題を皮肉とユーモアたっぷりに論じた書籍およびブログ，「Joel on Software」で有名。セッションも著書と同じく皮肉とユーモアに満ちたものになった。 セッションのテーマは「素晴らしいソフトウェアを作るということ」。機能的に優れた製品を作っても，市場で優位に立てないというよくある現象を分析し，万人に愛されるソフトウエアを作る方法を探るという流れでセッションは進んだ。 セッションの冒頭でSpolsky氏は，いきなりサッカー選手David Beckhamとその同僚Landon Donovan（どちらもLo
ユーザーの動き。｜CSS HappyLife
ボクたちみたいな、ウェブサイトを閲覧するのが当たり前の人間からすると、全く気づかない事に気づかされたりしたので、自分用メモ。 2008年2月14日の22：47頃に追記 ボクのただのメモ書きをもうちょっとちゃんと以下のエントリーで書いてもらってるので、あわせてご覧になって頂くと、良いかと思います。 Webアクセシビリティについての覚書 - ねんがんのWebユーザビリティテストに参加した ロゴクリック＝トップページに戻るという認識は殆ど無い。 トップページに戻る場合は、ブラウザの「戻る」ボタン。 サイドバーのバナーは、認知すらされない傾向が強い。 そもそもバナーとして押せるものではなく、デザイン上の飾りとして見られる場合も。 リストのマークとかのマーク部分をクリックしよーとする人が居る。 それにより、クリックできないと諦めるケースも。 プルダウン（ドロップダウン）型メニューは、近くのボタンを押
ユーザビリティの大切さに気づいてもらう - inucaraの日記
こないだの「インターネットってどういう仕組みで動いているの？」に書いた事前研修でユーザビリティの大切さについても話したいと思って簡単なフォームを作ってみたよ。 想定ターゲットはユーザビリティのユの字も知らないような人や、これからウェブサイトの設計、構築の仕事をしようとしている人。これらの人にユーザビリティの大切さに気づいてもらうために、前回と同じように話す内容をとりあえず書いてってみる。 ちなみに前回のインターネットの仕組みからユーザビリティって話が飛んでるけど、そういうことは気にしないで思いつくことをメモ的にどんどん書いてって、流れは最後に考えようかなって感じ。 じゃあ、さっそく始める！ ユーザビリティって何？ まず始めに、みんなは「ユーザビリティ」って言葉は聞いたことあるかな？ 日本語で「使いやすさ」って意味なんだけど、利用者がいかにストレスなく、便利で簡単で直感的な操作ができるか、っ
Webサイトエラー
アクセスが集中しているか、サーバメンテナンス中です。 しばらく経ってから再度アクセスしてください。 時間をおいてもアクセスできない場合には以下をお試しください。 ・ＵＲＬに誤りがないか確認する ・トップページから再度アクセスする ・ブラウザ、または端末を再起動する
UI-patterns.com
User Interface Design patterns are recurring solutions that solve common design problems. Design patterns are standard reference points for the experienced user interface designer. Product Insights at your fingertips. Our confidence-boosting product tools for business growth are practical guides and strategies that will immediately amplify the expertise of you and your team.
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IDEA * IDEA
何百件先の画像まで一気に検索してしまうインターフェイスを搭載したfirefoxプラグイン*ホームページを作
https://www.openvista.jp/archives/note/257/?257/
ユーザーインターフェイスデザインの参考になるサイト集