アップル ヒューマンインタフェースガイドライン
アップル ヒューマンインタフェースガイドライン 原文：Apple Computer Inc. 訳：かろでん☆みゅーあ 2006-06-28 はじめに アップル ヒューマンインタフェースガイドライン序文 アップルは、強力なコアファウンデーション、そしてアクアと呼ばれる、目の離せないユーザインタフェースを結びつけた、世界で最も先進的なオペレーティングシステム、Mac OS X を手にしました。 進化した機能と、美的に洗練された色使い、そして透過処理、アニメーションによって、Mac OS Xは新規のユーザにはコンピュータ操作をより容易に、同時にプロフェッショナルユーザには彼らがMacintoshに期待する通りの生産性を提供します。 ユーザインタフェース、すなわちふるまいと外見は、よく練られた緊密なユーザ体験を、Mac OS X向けに開発された全てのアプリケーションに利用できるようにします。 これ
本物の机の上で作業するような感覚が味わえる『BumpTop』 - 100SHIKI ～ 世界のアイデアを日替わりで ～
本物の机の上で作業するような感覚が味わえる『BumpTop』 March 11th, 2007 Posted in 未分類 Write comment どこかで紹介したような気がしないでもないが、とにかくご紹介。 デスクトップをより本物の机の上のようにしようじゃないか、と考えているのがBumpTopだ。 このサイトではファイルやプログラムの管理をより直感的に行えるようなランチャー（？）を開発中である。 同サイトにはYouTubeの映像が上がっているので是非みてもらいたい。 これを使えば関連あるファイルを積み重ねていったり、今作業中のものは目立つところに配置したりといったことができる。 あたかも本当の机で書類をあちらこちらに動かしているような感覚だ。 仕事を効率よくこなすにはある程度のテンションが必要だ。そのテンションを高めてくれるような気持ちの良いインタフェースが求められている。BumpT
キャズムを超えろ！-家電メーカーよ、今すぐその時代遅れのUIから脱却せよ
TVのリモコンやデジタルカメラの操作ボタン類は、なんでああも使いにくいものなのか。PCやケータイを使い慣れた層にとっては苦痛以外の何者でもない。商品企画を仕切っているコンサバティブなオヤジどもを今すぐシルバー層向け商品の担当に転向させ、PCやケータイに慣れたユーザにメインストリーム商品のUI設計，リモコン設計を任せるべきだ。 リモコンと画面を行ったり来たり... 家電のUI設計の基本は、もとが1ボタン1機能である。とはいえ多機能化するデジタルTVやDVDレコーダー、デジタルカメラといった機器をこの思想で設計すると、100個はくだらないボタンを備えたリモコンが必要になる。これらの機器は全てディスプレイを備えているため、カーソルキーと決定キーを用意し、PCライクなGUIによる操作体系を加えた。が、ここでどっかの誰かがぶっとんだ間違いを犯した。 『操作回数が少ないことは何を差し置いてもいいことだ
メールの視覚化
メールで情報をやり取りする際に面倒な点の1つは、前後の話のつながりを追いづらいことですよね。例えば Gmail のように、関連するメールをスレッド形式で表示するなどといった工夫もありますが、話の流れが複数に分散した時に把握しづらくなります。そこでIBMがこんなアイデアを考え出したとのこと： ■ Thread Arcs (visualcomplexity.com) 2003年発表とのことですから、既にご存知の方も多いかもしれません。個々のメールを「点」で示し、他のメールとの関連を「弧（arc）」で示す「スレッド円弧（Thread Arcs、スレッド・アーチと意訳した方がカッコいいかも）」というアイデア。中が塗りつぶされている点は他人のメールを示し、さらに色の違いで送信者などを表すようになっているそうです。より詳しい情報は、IBMの公式ページからどうぞ： ■ THREAD ARCS: An E
ネットサービスでやってはいけない14のこと（Guy Kawasaki版） | P O P * P O P
このブログでもたまにとりあげるGuy Kawasakiさん。ベンチャーキャピタリストで数多くのネットサービスを手がけています。 そんな彼が「ネットサービスでやってはいけない10のこと」なる記事をあげていました（本当は14ありますが、Guyさんはなんでもポイントを10にするので有名）。 あたりまえ的なポイントも多いですが、数多くのネットサービスに携わっている方の言葉ですから説得力がありますよね。 » How to Change the World: The Top Ten Stupid Ways to Hinder Market Adoption では、早速、下記にご紹介。 【1】 すぐにユーザー登録を要求する 最初にユーザー登録を要求したい気持ちはわかりますが、利用者の心理的抵抗を大きくしてしまいます。 まずは使ってもらうことを第一にしましょう。ぎりぎりまで要求しない方が良いですよ。 【2
53 CSS-Techniques You Couldn’t Live Without | Smashing Magazine
CSS is important. And it is being used more and more often. Cascading Style Sheets offer many advantages you don’t have in table-layouts - and first of all a strict separation between layout, or design of the page, and the information, presented on the page. Thus the design of pages can be easily changed, just replacing a css-file with another one. Isn’t it great? Well, actualy, it is. Over the la
ヤコブ・ニールセンの考えをまとめたWebユーザビリティガイドライン::ホームページ制作::NPO法人しゃらく
ヤコブ・ニールセンの考えをまとめたユーザビリティガイドライン ユーザビリティのグル、ヤコブ・ニールセン氏の考えや調査を元にユーザビリティガイドラインを作りました。 デザインやコーディングをしている際に、このガイドラインを元に自分のデザインを一度チェックしてみるのもよいかと思います。 TRANS - ヤコブ・ニールセン氏の考えを元に、ユーザビリティガイドラインを作った。
第8回 デザイナーとともにより良いサイトを目指そう 〜「はてな」のやり方：ITpro
連載第5回（「デザインのセンス，持ってますか？」）においてちょっと触れましたが，ウェブサイトを構築する際に，デザイナーとエンジニア（プログラマ）がかかわり，共同で作業を行うケースというのは少なくないと思います。これはもちろん，デザイナーとエンジニアがどちらもそれぞれ別のスキルを持っているからなのですが，それぞれのスキルや立場が異なるために，お互いにうまく意思疎通ができないケースも多いんじゃないかと思っています。 例えば，デザイナーの作成したウェブページのデザインが，システムを作る側からすると扱いづらい構成になっていたり，逆にエンジニアがシステムの修正や機能追加を行った際に行った表示上の変更が，デザイナーからすると許せないものだったり。そうでなくてもデザイナーの意図を読みきれていなかったり，といった感じで，お互いの作業が，相手の作業を阻害してしまったり，手戻りを発生させてしまうといった経験を
ウノウラボ Unoh Labs: ユーザビリティって何だろう？（基本のまとめ）
こんばんわ、Sashaです。フォト蔵のUI改善への要望が高まっているのをうけて、最近、ユーザビリティについてみんなで考えています。 基本の基本が気になる私は、「ユーザビリティって何だろう」というところから考えるべく、『ユーザビリティのguru』と呼ばれるJakob Nielsenの「ユーザビリティ」の定義を復習しました。以下はそのまとめです。 ユーザビリティって何だろう？ ユーザビリティは、UIがどのくらい使いやすいものであるのかを示す質的属性です。「ユーザビリティ」という言葉は、モノをデザインする過程で「使いやすさ」を改善するための方法でもあります。 ユーザビリティは、次の5つの品質によって表すことができます。 「学習しやすさ」 初めてそのデザインに触れるユーザーが、どれだけ容易に基本的なタスクを発見し、遂行できるだろう？ 「効率のよさ」 ひとたびそのデザインを学習したユーザーが
GNOME 2.16.2リリース MOONGIFT
特集「オープンソース×10年」 予算ゼロからのIT環境整備2014/01/30 特別寄稿：センチメンタル・ジャーニー ~OSSはまだ16だから~2014/01/30 EC-CUBE – オープンソース・Eコマースの雄の進化を見る！2014/01/30 Zabbix Japanに聞いたオープンソース×ビジネスを成功させるための3つの基本2014/01/30 MOONGIFTの運営で大事にしている3つのこと2014/01/30 2007〜8年の大きな変動まとめ！2014/01/30 なぜプレミアム？そこから得られた経験教えます2014/01/30 2006〜09年、各年の人気オープンソース・ソフトウェアベスト52014/01/30 狙われやすいサイトはどんなサイト？オープンソース×セキュリティについてペンタセキュリティシステムズに聞く2014/01/30 aegifが考える企業でOSSを開発す
Web 2.0のデザインパターン | S i M P L E * S i M P L E
Web 2.0のデザインパターン November 24, 2006 12:15 PM written by Gen Taguchi メモ書きにてエントリー。訳しただけだけど。 Pixel Acresにて「The visual design of Web 2.0」という記事があがっています。Web 2.0っぽいサイトのデザインをパターン化したものです。見た目がすべてではありませんが、とっても重要なのは間違いないです（「見た目いけてないから他のサイト行こうっと」はよくありますよね・・・）。 さて、ではポイントをば。 ■ グレーの次はグリーンだ！ 明るいグリーンが流行です。下記サイトをみてもそうですよね。 ■ 角丸命！ Rounded Cornersは新しい標準す。 ■ 「無料！」印がキーワード まずはトライアルができるのがWeb 2.0の特徴。無料の文字もいれときましょう。 ■ は？素材集す
第26回 どこにメニューをおくべきか，どこが画面の一等地か：ITpro
Webサイトのデザインの中で，ここ2年で大きく変わりつつある「常識」があります。それは，「メニュー（索引）」の位置と「一等地」の場所です。ユーザーの閲覧環境が加速度的に変化しているという認識の下で，それでも最良のユーザビリティを提供しようとするなら，どのようなことを考えておく必要があるでしょうか。 左メニューと右メニュー（視線との交差）のどちらがベスト？ まだモニター画面の大きさが小さかった時代（1995年前後），情報へアクセスしやすくする「メニュー」の位置は，ほとんど誰が考えても左側にあり，議論もされなかったように記憶しています。確実に画面の中に入り，ユーザーも基本的に左端にさえ注意を向けていれば，大切な情報にたどり着けるという「暗黙の常識」が存在していたかのような時代でした。 しかしここ数年，メニューが左側にあると本当に操作性が良いのかという議論を聞くようになり，大手のWebサイトでも
いろいろな用途で使えるミニアイコンあれこれ - GIGAZINE
通常のアイコンよりも小さなサイズの使いやすいミニアイコンを集める必要性に迫られたので、いろいろとリストアップしてみました。 ブログやWiki、通常のサイト作成やFlash、PowerPointのプレゼンテーションやソフトウェアのボタンなどなど、いろいろな場面で役に立つはず。ボタンの画像を違うものにするだけでだけでも、割と雰囲気がガラリと変わるのでオススメです。 リスト一覧は以下の通り。 Mini Pixel Icons（ブログやCMS用のアイコン、ユーザーアイコンなどが多く、とてもカラフル） Mini Icons | urlgreyhot（12ピクセル四方という極めて小さなアイコンがいろいろあります。グレイスケールのアイコンは加工しやすいので、好みのアイコン素材にすることも可能） Bullet Madness - free bullets project at Stylegala（200個
Flashなしでもここまで作れる！：ITpro
Webプログラミングは，プロはもちろんアマチュアのプログラマの間でも，もはや欠かせない開発ジャンルの一つです。しかし，書籍や雑誌の解説記事のほとんどが，データベースがどうとか，サーバーサイドがどうとか，どうしてもディープな方向に進んでしまう傾向にあります。もちろん，それはそれで大切なことなんですが，いったい何割の人が，その技術を“自分の”ホームページに使っているでしょう。 最近話題の「リッチ・コンテンツ」にしても同様です。例えばFlash。たしかにActionScriptというスクリプト言語を使えば，動く，鳴る，つながると，いいこと尽くめです。でも，いかんせん「Macromedia Flash MX 2004を買ってきてね」とあっては，皆がみな使えるわけではありません。 Part1でも解説があったようにblog（ブログ）の認知度が上がり，利用率も増えて，プロバイダからの提供体制も整ってきて
iv.xight.org - 情報視覚化
■ Information Visualization の用途 情報検索 データ解析 プログラムデバッグ ■ Information Visualization に必要な技法 必要なものだけ表示する技法 画面の表示可能領域に制限 情報を選択的に表示 ズーミング手法・フィルタリング手法・重要度計算手法・画面を歪ませて表示する手法 e.t.c. 全体と詳細を同時に見る技法 全体を概観しながら詳細も見ることが可能 ズーミングの応用 抽象データの画面へのマッピング技法 表示すべきデータがユーザ操作により変化 表示すべき情報をどのような位置，形，色で表示するか グラフの自動配置手法・階層構造の表示手法 e.t.c. 自動レイアウト技法 重なりがちゃんと見えるように グラフの自動配置手法の一つ？ インタラクション技法 直接操作によって画面を移動・拡大させたり，条件を変更して動的検索を行ったりする手法
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
COULD：Webデザインに関する 15 の調査結果
http://plaza.rakuten.co.jp/catfrog/diary/200701140026/
日本語で読めるものを中心に - Webデザインのリンク集 | lush life*
Yahoo UI Libraryを拡張した超リッチなコンポーネント集:phpspot開発日誌
ユーザビリティ会議レポート：実績があがるサイトの秘訣を探りました | 100SHIKI PR Board