今回は、パターンを1つだけ紹介します。「Mediatorパターン」です。GoF本では、それぞれのパターンの「目的]「背景」「効果」などが明示されています。私も、ちょっと真似をしてみましょう。複数のオブジェクトを組み合わせてプログラムの機能を実現するという目的において、オブジェクト間の関連がゴチャゴチャになってしまうという背景（問題）があり、Mediatorパターンの採用によって関連をキレイに整理できるという効果があります。説明だけでは、何のことだかわからないと思いますので、具体例をお見せしましょう。 図1[拡大表示](1)をご覧ください。これは、UML（Unified Modeling Language、ユーエムエル）と呼ばれる表記法で記述されたプログラムの設計図です。UMLでは、四角形の中に下線付きで名前を書いてオブジェクトを表し、関連のあるオブジェクトを矢印で結んで示します。ここで関連
今、C-teamというサイトの開発に関わっているのですが、あまりに効果が高くてスゴイので、結構ショックだったので紹介します。 C-team 今までWebディレクターとして、バナー制作をしたり、自分のサイトのバナーを制作会社に頼んでいたりしたんですが、これがいかに非効率だったかということを思い知って反省したので、紹介してみます。 自分の関わっているサービスをスゴイスゴイ言うと宣伝くさくなるので避けてたんですが、これは本当にびっくりしたのです。通常のバナーの作り方 通常のバナー広告って以下みたいな手順をふむことが多いですね。 1. 宣伝したいサイトの運営者(ディレクター)が欲しいイメージを制作会社に伝える 2. 制作会社のデザイナーさんがいくつか作る 3. そのバナーでよさそうなものを運営者が選んでそのバナーを出す ここでの問題は、1も2も3も「こういうのがいいんじゃないか」って勝手に想像して
私の仕事は、Zope/PloneをベースとしたカスタムCMS（その顧客専用のコンテンツ管理システム）を開発するというもので、これは「Web開発」とか「サーバサイド開発」とか呼ばれるカテゴリに入る。 これに対して、HTMLやCSS、JavaScriptなどクライアントサイドの開発・コーディングを担当する人を、最近のWeb業界では「フロントエンド・エンジニア」と呼ぶ場合があるようだ。これはなかなかいい呼び名だと思う。 一般的に「Webデザイナー」と呼ばれる人の仕事は、じつに幅広い。ビジュアル的に「デザイン」すること（どんなサイトにするかの「絵」を作ること）や、サイトの構造・ラベリング・ナビゲーションといった「情報アーキテクチャ」を決めること、そしてHTMLやCSS、JavaScriptといった技術によってそれらを実装することは、それぞれ異質な作業であり、別種のスキルが求められる。 最近はこうし
ズバリ言ってしまうと既存機能に上乗せする企画は通すのが簡単だし、リスクが少ないからだ。【機能やボタンが多すぎ!! 使いにくいUIのデジタル家電が発売されてしまう本当の理由 - キャズムを超えろ！より引用】 こういった罠にハマらないためには、色々とすべきこと・してはいけないことがあるが、たぶん最も強く意識すべきは「合議制では良いものは作れない」という法則。デザインに関わる人が多ければ多いほど、「いろいろな意見」が寄せられてしまい、「せっかく有意義な意見を出してもらったのだから」と次々に意見を取り入れているうちに、機能だけはたくさんあるけど魂が無くて妙に使いにくいものが出来てしまう。 その意味では、37signalsの人たちが言うところの「less is more」は「単に機能を削って使いやすくする」というだけの話ではなく、「企画に関わる人の数を削って魂があるものを作る」というもの作りの過程そ
「Webサイトの解像度の基準が変わった？ 」にて、社内システムの構築に際しては専任のデザイナーがいないと書きましたが、では社内システムの構築にデザイナーは必要ないのでしょうか。 答えはもちろんNOで、それを専門としてくれている人にきちんとデザインしてくれた方が全体感が統一されますし、専門としないプログラマーがわざわざそっちの方に気を使う必要も無いため、業務の効率も上がります。 しかし、私が勤める情報システム部門にはデザイナーの肩書きを持った人は存在しません。 デザイナーがいない場合、プログラマーが兼任してそれを行う事になりますが、システム全体の画面のレイアウトを予め統一して定めておかないと、個々のプログラマーが勝手に作り出すと全体として物凄く使い勝手の悪いシステムが出来上がってしまいます。 それをサービスとして展開しているものであれば、ユーザーはそれを使わずに他のサービスを使うと言う選択肢
バナー画像の3倍の効果をあげたテキストリンク（powered by beBit） November 6, 2007 3:41 PM written by Gen Taguchi ※ 今回の記事は「ウェブサービスインターフェース勉強会」でのbeBit社のプレゼンから。 今回ご紹介するのはレシピサイト、Cookpad.comの事例です。Cookpad.comでは有料会員（月額300円）があるのですが、その会員数が伸び悩んでいました。 そこでbeBit社に相談するのですが、それまではかわいいバナーをどーんとサイドバーに貼っていました。 ↑ なかなかかわいらしいバナーです。凝っていますよね。 しかしユーザビリティ調査をしてみると、そのバナー広告がほとんど見られていないことがわかりました。最近は「広告＝邪魔なもの」というイメージがありますよね。 そこでbeBit社ではこのバナーのかわりに次のテキスト
via Photoshop Match Color simple And Amazing Results metacafeで知ったPhotoshopの『カラーの適用』を使ったテクニックが面白かったので脊髄反射でエントリ。 既に知ってる方はスルーしてください。 用意するものは2枚の写真。1枚が効果を加える写真で、もう1枚が効果の元になる写真です。 ここでは砂丘の写真と雲海の写真を用意しました。 効果を加えたい写真（ここでは雲海）をアクティブにした状態で『イメージ』→『色調補正』→『カラーの適用』を選択します。 『画像の適用設定』にある『ソース』メニューから効果元の写真（ここでは砂丘）を選択します。 すると、砂丘の写真の色合いが雲海に適用されて↓のような写真になりました！ 昼間の雲海の写真が、一転して日没のような雲海の写真に。面白いですねぇ。 車が並んでる写真を適用すると、闇夜に月明かりが輝い
Web業界のデザイン手法として、密かに流行し始めている「左上の魔術師」理論。 サイトとしての「見栄え」よりも、ユーザーの「目の動き」に着目したWebデザイン手法として注目を浴びています。 今回は、まず始めにWebサイトのデザイン別にユーザーの「目の動き」を解説します。 そして、実際にミリオン単位でユーザーを獲得しているサイトを考察することで、「左上の魔術師」理論を解説したいと思います。 1.カラム別Webサイトデザイン 2.昔はたくさんあったWebサイトデザイン 3.ページ単体を見に来たときのユーザーの目の動き 4.サイト全体を見たくなったユーザーの目の動き 5.ミリオン単位でユーザーを獲得しているサイトのデザイン 6.左上の魔術師とは 1.カラム別Webサイトデザイン 現在のWebサイトの多くは、「1カラム型」、「2カラム型」、「3カラム型」のどれかで構成されています。 このうち「2カラ
東京都文京区本郷でとあるCMS開発会社を営む社長のブログ。さっきまで「越後のCMS問屋」だったのですが、会社が新潟に移転したと勘違いされたようなので変えました。 モバイル、ゲーム、フィード、Ajax、Flash、ハイテクグッズあたりのはやりモノが好きです。 最新作「メルルーの秘宝」がドワンゴから提供中 週刊アスキーで「2045年の週刊アスキーをつくる」連載中 最近、またいろいろなインターフェースを研究していたのですが、ひとつ気づいたことがありました。 特にWebサービス、Webアプリケーション全般がそうなのですが、縦スクロールするものと横スクロールするものについて、ちょっと気になったのです。 要するに、Webサービスは横軸方向に並べる場合と、縦軸方向に並べる場合で意味が変わるのではないかと。 言うまでもありませんが、普通のサイトは時間軸が上から下へ、縦軸方向に流れるようになっていま
私はJavaOneには7回参加した。自腹で10,000ドル以上出している。参加費だけでだ。ちょっと考えてほしいのだが、彼らが私に、その、胸があるという事実を隠さない記念のシャツをくれたことが、一度でもあっただろうか。2000ドルの入場料の1%でも余計に使って、6フィート未満の人間に着られるシャツを作ったことが、一度でもあっただろうか。そしてこれはもちろんSunのJavaOneに限った話ではない。実質的にすべてのテクノロジー企業が有罪だ。ブースを構えるベンダが「ほら、寝るときに着れるよ!」と言って笑うごとに10セントもらえたなら、私は今頃これを海辺の別荘で書いているだろう。 (あのね、テクノロジー会社さん、女性の多くは寝るときに着るものは何でもいいってわけじゃない。ああ、話がそれた･･･) 私たちがこのブログで言い古した公式はいたってシンプルだ: あなたはユーザをクールにするためにどんなこと
ユーザビリティのヒント（2） 「メールが送信されました」 伝えるのなら、控えめに 「Yahoo!メール vs Gmail」 ソシオメディア 上野 学 2006/7/28 Webアプリケーションのユーザーインターフェイスデザインに役立つさまざまなTips集。Yahoo!メールとGmail、使いやすいのはどっち？という疑問から使いやすいユーザーインターフェイスを考えてみましょう（編集部） 前回から始まったこの「ユーザビリティのヒント」ですが、今回もいくつかのTipsをご紹介しながら、Webアプリケーションのユーザーインターフェイスやインタラクションデザインについてボトムアップに考えていきたいと思います。 Webアプリケーションによっては、JavaScriptなどを使用して、ウィンドウの開閉、サイズの変更、スクロールバーやボタン類を隠す、アドレスバーやステータスバーを隠す、といったことを行ってい
お気に入り巡回先の、羨望は無知の「なぜ「デザイン」という行為、「デザイナー」という職業は誤解されるのか」や、分裂勘違い君劇場の「エンジニアの方が優れたユーザインタフェースデザインができる理由」、F's Garageの「エンジニアがダメなUIデザインをする原因」 のあたりのデザイン論が、あんまりデザインと縁のない人にデザインをわかりやすく説明してて面白い。面白いのだけどちょっと抽象的なんで、具体例の話とか書いてみるテスト。 最近、これらのエントリーで言及されるようなよいデザインを身をもって体験をした。それは画像管理ソフトPICASAのヘンテコなスクロールバー。 今まで気付かなかったけど、あのヘンなスクロールバーは単なるアヴァンギャルドやオシャレじゃあなかった。実は合理性に裏打ちされた素晴らしく美しいデザインだということに気付いた。 まずPICASAを知らない人に説明すると、このソフトのスクロ
それから、これは個人的な意見ですが、プログラマはコンピューターの扱いになれているから、そうでない人が使うためのインタフェースを設計することができない、みたいな話をときどき耳にしますが、僕はそれに懐疑的です。インタフェースをうまく設計できない人というのはプログラマに限った話じゃない。それは「プログラマは営業ができない」と乱暴にまとめてしまうのと同じようなこと。 たぶん、プログラムができるかできないかということと、インタフェースをうまく設計できるかできないかというのはあんまり相関がないように思います。むしろコンピュータの世界では、プログラマは頭のなかで思い描いたインタフェースを実現する手段を最も良く知っている部類の人で、インタフェースを作るセンスさえ持ち得れば、それ作るのにもっとも適した人たちなんじゃないかと思います。 知り合いの会社では、半期ごとだかクオーターごとだかに、その期に、もっとも優
del.icio.us/tag/del.icio.usを眺めていたらFlickrのときみたいに面白い資料を見つけたの紹介します。 Things to look out for when building a large application.というタイトルでサーバーサイドの管理等の話が中心かと思って読んでいたらそれ以外のインターフェース、実装すべき機能、spam対策、アプリケーションを如何に広めるかといった話にも触れていて面白いです。 以下にまとめてみました。 スケーリング 早期の最適化を避ける。SQLでスケーリングするのではなく、データを複数マシンに分散させる方法を考慮すべき。SQLプロファイリング重要。Nagiosがお勧め。 タグはSQLと相性がよくない。インデックシングの仕組みを理解し、その方針を決定する。最初の数ページに限定すれば小規模で高速なインデックスを保てる。 Apache
KDDIでau design projectを率いる立場のプロダクトデザインディレクター 小牟田啓博氏に、開発の現場でどんな議論があったのか聞いた。 折りたたみのピュアな姿を目指して neonの構想が誕生したのは、2年ほど前のこと。深澤直人氏が「INFOBAR」を手がけて世間の注目を集めたが、その直後にはもうneonの開発に向けてキックオフミーティングが開かれていたという。 「INFOBARが完成して、ストレートでスタンダードな端末の“ピュアな姿”という成功がイメージできた。その後単純に、2つ折りでもスタンダードかつピュアな姿を実現したい、ということで構想されたのがneonだ。圧倒的に静かな、シンプルな携帯をやりたいねということで、深澤さんに再度お願いすることにした」 ここにきて、デザインケータイとして“フラットな四角さ”をアピールする携帯も増えてきている。しかしneonの実物を見ると、そ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く