Yasuhisa Hasegawa - Yasuhisa Hasegawa (Page 34)

ブラウザは知るべき存在だと思う

この記事は「ブラウザって何ですか？ [http://www.yasuhisa.com/could/article/what-is-browser/] 」の続きにあたります。> @zerobase [http://twitter.com/zerobase/status/2247922609] 「誰がインタビューを実施し、結果を公表したか（その意図は何か）」への批判的な考察も書かれたほうがよいかも > “回答者の多くの方が「ブラウザ＝検索」という認識を持っているみたいですね” ぜひ石橋さんの意見を伺いたいところですが、私もほうも肯定的に「ブラウザは見えない存在になっているのね。良かったね！」と考えているわけではありません。利用者がウェブから取得したデータをどのようにブラウザで表示されるかどうかといった仕組みは知る必要はありません。ただし、ブラウザが分からないとなると、セキュリティへの理解も低いのではないかという懸念もあります。特別な知識やセキュリティソフトがなくても、ブラウザという窓口を利用しているのだと理解しているだけで予防出来ることは少なくありません。例えば、アドレスバーの URL

デザイン

ポッドキャストで感性とデータのデザイン

以前「感性によるデザインデータによるデザイン [http://www.yasuhisa.com/could/article/emotionaldesign-datadrivendesign/] 」という記事で、データ、感情、経験、発想といった要素がどのようにサイト制作に影響するのか書きました。結局バランスの問題だよね、と言ってしまえばそれまでの話なのかもしれませんが、実際どのようにバランスをとれば良いのでしょうか。4月からスローペースでポッドキャスト [http://www.yasuhisa.com/inflame/] を再開しているのですが、２回にわたって感情によるデザインとデータによるデザインに関する話をしました。 * IC #141 May 13 2009 [http://www.yasuhisa.com/inflame/show.php?s=141] (前編) * IC #142 June 18 2009 [http://www.yasuhisa.

ブラウザ

ブラウザって何ですか？

IT関連の仕事をしている方にとっては恐ろしく簡単なこの質問。私たちなら使っているブラウザの名称に応じて人のタイプを無意識に分類してしまいそうですよね。では、この質問を一般の方に向けたらどんな答えがかえってくるのでしょうか。Google の従業員がニューヨークで街頭インタビューをしたのが上のビデオになります。回答者の多くの方が「ブラウザ＝検索」という認識を持っているみたいですね。ビデオによれば、50人の回答者の中でブラウザ名を応えたのは全体の 8%。ブラウザはソフトウェアとしての捉えている方は少ないということになります。自分が行う行為そのものがブラウザというソフトウェアと融合しているのでしょう。これと同じ質問を日本をはじめ、他の地域で行うとまたレスポンスが変わるかもしれませんが、ブラウザ＝ソフトウェアと考えてる割合はそれほど変わらないのではないかと思います。こうした捉え方は、良い傾向なのかもしれません。ソフトを立ち上げて使っているというよりかは、自分がしたいことをするための、幾つか開いているウィンドウのひとつという存在が今のブラウザなのかも。身近な存在になっていると同時に、常に開

Twitter

Weekly Popular Twit Links 090612

Bacon Scented Bacon Print Tuxedo [http://bit.ly/ZYf5k] ベーコンの見た目を再現しているだけでなく、香りも豊かなタキシードQuote from Raymond Chandler [http://bit.ly/FStWl]テクニックの話をし始めたのはアイデア切れの証拠であるStop motion for STM [http://bit.ly/U2zaA]モントリオールにある電車線のコマーシャル。アナログ感が素敵Snow Leopard – Accessibility [http://bit.ly/3jenFA]いろいろよくなっているアクセシビリティ。日本語化されてたら最高Storm Troopin’ [http://bit.ly/MkH5i/]毎週必ずあるのとではないかと思わせるスターウォーズネタcamera candle [http://bit.ly/JMvz9]カメラの形をしたロウソク。別にカメラとして使えるというわけではないThree founders

UX

利用者がサイトを去るときの感情

アクセスしたウェブサイトから離脱する理由はいろいろあると思います。目的を達成したのであれば最高ですが、そうでない場合もあります。利用者がサイトを去る理由はサイトによって異なると思いますが、共通した思いを抱いていることもあります。ちょうど１年くらいの記事ですが「 25 reasons users STOP using your product: An analysis of customer lifecycle [http://andrewchenblog.com/2008/06/29/25-reasons-users-stop-using-your-product-an-analysis-of-customer-lifecycle/] 」で、利用者がサイトを利用しなくなったときの感情や思いをリストアップしています。主にソーシャルサイトを意識したものになっていますが、ウェブサイト全般にもいえることで思い当たるところを以下にリストしてみました。 * なぜこれが自分にとって価値があるのか分からない * なかなか表示してくれない * いろいろしたいわけじゃない * 登録してまで利用し

apple

ウェブサイト制作にも参考になるAppleアプリの作り方

以前紹介した LittleSnapper [http://www.yasuhisa.com/could/article/littlesnapper/] をはじめ、Macには無料・有料ソフトウェア問わず UI が洗練したものが数多く存在します。「Macらしいアプリ」と言えるかどうかはインターフェイスと大きく関わっているかと思います。Appleアプリの開発者はどのように形作っているのでしょうか。TechRadar UK の「Before you buy: how Apple software is born [http://www.techradar.com/news/computing/apple/before-you-buy-how-apple-software-is-born-601111] 」という記事で CoverScout 3 [http://www.equinux.com/us/products/coverscout/] の開発プロセスをインタビュー形式で紹介しています。大まかにコンセプトを固めるアイデアフェイズ、プログラムなどをする開発フェイズ、そしてバグフィックス

microsoft

Windows 7 デスクトップのデザインプロセス

Macユーザーではありますが、10月発売が決定した Windows 7 は結構期待しています。Vista で見つかった問題をどのように解決したのかという点も気になりますが、パソコンを利用する方達にどのようなソリューションを提案しているのかも興味深い点です。既にスクリーンショットやスクリーンキャストがウェブ上で出回っていますが、期待値が上がる UI や機能が幾つかあります。 Windows 7 のデスクトップはどのようにデザインされたのでしょうか。今年3月に開催された MIX09 [http://live.visitmix.com/]で、マイクロソフトシニア UX デザイナー Stephan Hoefnagels 氏が「 Designing the Windows 7 Desktop Experience [http://videos.visitmix.com/MIX09/C26F] 」というプレゼンをしました。デスクトップの細部にフォーカスして徐々に問題解決し、目指すゴールに近づけるプロセスを分かりやすく説明しています。以下に気になった部分を箇条書きしておきます。 * Wind

Twitter

Weekly Popular Twit Links 090605

Commons:Picture of the Year/2008 [http://bit.ly/NxU5S]素晴らしい写真集・・・７番目はなんだ？Ian Fleming: The Hourseman [http://bit.ly/DP3Jw]彼の Flickr [http://www.flickr.com/photos/ianidas/]ページも必見ですよJoo Youn Paek: Self-Sustainable Chair [http://bit.ly/11T7ZX]座りたいときにいつでも座れるようになりますWho Needs TV? [http://bit.ly/FFtEB]アメリカの話ですが、TVが必須アイテムと考えている人は半数しかいないみたいですScotland’s No1 Male Barbie

CSS

TypeKitから始まるウェブ文字革命

今月はじめに John [http://johnfallsopp.com/] が来日したときに「フォント関連で近々発表があるんだよね」と言っていたのですが、ついに全貌が明らかになったようです。Jeffrey Veen [http://www.veen.com/jeff/] を中心に TypeKit [http://blog.typekit.com/2009/05/27/introducing-typekit/] というプロジェクトが立ち上がる模様です。既に WebKit, Opera 10, Firefox 3.1 3.5 でサポートされている @font-face [http://www.w3.org/TR/css3-webfonts/] 。利用者のパソコンにあるなしに関係なく指定のフォントが使えるようになります。つまり、今まで仕方なく画像文字にしていた部分もテキストで処理可能になる可能性があります。 @font-faceでまず問題になるのが著作権に侵害しないかどうかという部分です。多くのフォントはウェブ上での配布を禁じていますし、@font-face

UI

いろいろあるインタラクティブ・テーブル

マルチタッチで操作可能なインタラクティブ・テーブルといえば Surface [http://www.microsoft.com/surface/] が有名ですが、他でも同類のテーブル（もしくは壁）が開発されています。カフェ、図書館、カンファレンスなど人がたくさん集まる場所にあると便利そうなインタラクティブ・テーブル。今回は GUI の見せ方も含めて興味深いものを幾つか紹介。アート作品から実際使われているものまで集めて参りました。リンク先のサイトには動画が掲載されているので、読むよりまずは見て体感すると良いと思いますよ。 Maeve [http://portal.mace-project.eu/maeve/]ドイツの University of Postdam で開発されているテーブル。専用カードを置くことで情報むことが出来たり複数のカードの情報の関連性を視覚化してくれます。Processing [http://processing.org/]とGestait [http://www.wortwechsel.biz/gestalt/] で開発されたそうです。Remotable [ht

インターネット

2009年的な影響力をもつ方法

今日 kengo [http://kengo.preston-net.com/]さんの tweet 経由で Twitter Grade [http://twitter.grader.com/yhassy] というサービスを知りました。Twitter上での影響力を調べるツールで、点数も付けてくれます。どうやって点数を付けているのかと思いこちらの記事 [http://grader.com/blog/how-does-twitter-grader-calculate-twitter-rankings/] を読んでみることに。フォローや更新数の多さから換算するような人気順ではなく RT や、@ といった他利用者とのインタラクションの頻度や誰にフォローされているのか（しているのか）といった関係も点数に影響するみたいです。ランキング [http://twitter.grader.com/location/?Location=Tokyo%2C+40%2C+Japan] をみると単にフォロワーが多かったり更新頻度が高ければ上位にいっているわけではないというのが分かります。影響をもつためのステップ

デザイン

質問: ウェブサイトの見た目は同じにしなければならないか？

東京・京都で開催された Web Directions East ワークショップ [http://east.webdirections.org/] にて、ジョンの通訳として参加させていただきました。同時通訳でもなければ、プロの方がされるような完全な言葉の伝達ではない形でしたが、よりインタラクティブな対話が出来たのではないかと思います。遠く離れた２カ所で開催されたワークショップでしたが、共通して盛り上がったディスカッションが「ウェブサイトの見た目は同じにしなければならないか？」というトピックです。この話題は私のサイトでも何度か挙って [http://www.yasuhisa.com/could/article/dowebsitesneedtolookexactlythesame/] いますが、「同じ見た目」という言葉だけでも随分捉え方が違いますよね。講師をしていた John にとっては「ほとんど同じだから良い」という装飾でも他の視点から見ればそうではない場合があります。最大公約数でポテンシャルを削ぎ落としてまで同じように見せる必要があるのか、実際、複数のブラウザで観覧するユーザーがどれ

ビジネス

共創のためのビジネスモデル

前回の共創に必要な価値観 [http://www.yasuhisa.com/could/article/co-creation/] という記事で、幾つかある共創のタイプ、そしてその特徴について紹介しました。市場に新たな価値を生み出す鍵といわれていますが、IDEOの Tim Brown も共創が今後の経済に必要だと考えている方のひとりです。Ideas Project のインタビューシリーズに彼が出演している [http://ideasproject.com/idea_person.webui?id=3407]のですが、そこで様々な興味深いアイデアを提案しています。よいサービスとは、消費者/利用者が何もしなくて済むものではなく、消費者が参加したくなるようなものを指すと Brown 氏は説明しています。参加型の経済メカニズムを専門用語でいうと参与型経済 (Participatory Economy) [http://tinyurl.com/r2etzm] と言います。労働者と消費者が共創するモデルで、資本主義経済とは異なりますし、すべてを中央化して平等に分け与える社会主義モデルと

アイデア

共創に必要な価値観

市場に新たな価値を生み出す鍵といわれている「Co-Creation (共創)」。この言葉自体を使わなかったとしても、ネットをはじめ様々なシーンで共創が行われています。では実際、どのような共創が存在するのでしょうか。そして、成功している共創には共通した特徴があるのでしょうか。アムステルダムのコンサルティング会社 Fronteer Stratery [http://www.fronteerstrategy.com/fronteer_strategy.html] が CO-CREATION’S 5 GUIDING PRINCIPLES [http://fronteerstrategy.blogspot.com/2009/04/co-creations-5-guiding-principles-or.html] という６ページのホワイトペーパーを公開しています。この資料では、４つの共創タイプ、５つの特徴を紹介しています (PDFダウンロード [http://www.fronteerstrategy.com/co-creation_files/Fronteer%20Strategy%205

ゲーム

ウェブブラウザとオンラインゲームの今後

数年前からオフィス系のソフトウェアは次々とWebブラウザ上で扱えるようになってきましたが、ゲームも似たような状況になりつつあります。Flashゲームのような小さなゲームは以前からブラウザで遊べましたが、 MMORPG [http://ja.wikipedia.org/wiki/MMORPG] のようなスケールの大きいゲームもブラウザへ移行しつつあります。ユーザー数が多いゲームで有名なのが RuneScape [http://www.runescape.com/]。サービスが立ち上がった 2001年当初はポリコンそのままのグラフィックでしたが、今では高画質でフルスクリーン表示も可能です。アクティブユーザーは何人か分かりませんが、850万アカウントあると言われています。ブラウザベースの MMORPG は他にも Free Realms [http://www.freerealms.com/] があります。どちらかというとコミュニティサイトですが、Club Penguin [http://www.clubpenguin.com/] もオンラインゲームといえます。いずれもコンソールゲーム

未来

IDEOが考える教育の姿

新しいビジネスが必要とされているのと同じように、教育においても21世紀という時代に合った形が必要とされています。教育は常に変化し続けていますし、必要とされていることと言っても様々な視点があります。 IDEO [http://www.ideo.com/]の考える未来の教育の姿はどういったものなのでしょうか。「IDEO’s Ten Tips For Creating a 21st–Century Classroom Experience [http://www.metropolismag.com/story/20090218/ideos-ten-tips-for-creating-a-21st-century-classroom-experience] 」で10の項目に別けて解説しています。以下に簡単に要約したものをリストアップしてあります。いかにも IDEO らしいリストといったところでしょうか。押しではなく引く生徒からたくさんの質問が生まれるような環境をつくる関連性を持たせる教えているコンセプトを直接体験し、話し合えるようにするソフトスキルと呼ぶ時代ではないクリエイティビティや

アート

フラクタルいろいろ

Jenn3d [http://www.math.cmu.edu/~fho/jenn/] フラクタルを描くことが出来るソフトウェア。Windows/Linux/Mac で動かせるだけでなく、ソースコードもダウンロード出来ますNaturally Occurring Fractals [http://www.miqel.com/fractals_math_patterns/visual-math-natural-fractals.html] 自然界にあるフラクタルを幾つか紹介George W.Hart [http://www.georgehart.com/] フラクタルの彫刻作品が幾つか掲載されていますJulius Ruis [http://www.fractal.org/Julius-Ruis-Gallery/Index-Gallery.htm] フラクタルを幾つか見れますが、自分で作れる「Fractal Imaginator (Windows)」のダウンロードも出来ますManny Lorenzo [http://www.

google

簡単にコンテンツが最適化されているかを見る方法

サイト運営側が「こうみられたい」と考えて作ったコンテンツでも、実際は異なる捉え方をされている場合があります。外からどのように捉えられるかを調べる方法のひとつとして Google のウェブマスターツール [https://www.google.com/accounts/ServiceLogin?service=sitemaps&hl=ja] があります。サイトがインデックスされているか、そして検索結果にどのように表示されているのか、調べることが出来ます。取得出来る幾つの情報の中に「上位の検索クエリ」という統計があります。統計データは２つの順位表に分かれています。左側がサイトのページの表示に最も多く使用された検索クエリ。そして右側が実際のクリックに繋がったクエリになります。地域や検索の種類、そして期間で絞り込んだ結果を出すことも出来ます。サイトに記載されているキーワードがランキングで表示されているので、利用者からみたサイトのイメージを漠然と捉えることが出来ます。このデータから２つの可能性と対策が考えられます。 * これらがあなたのサイト (もしくは企業サイト) を象徴するキー

OSX

Grapeを使って散らかったデスクトップを整理

Canvas for OneNoteの感覚的な情報整理 [http://www.yasuhisa.com/could/article/canvas-for-onenote/] というエントリーで、自動ではなく手動による情報整理の可能性を紹介しました。Canvas は、OneNote 限定ですが、BumpTop [http://bumptop.com/]のようにデスクトップ上のファイルを手動で整理出来るアプリケーションもあります。BumpTop のような３Dにすることで、ファイルを配置する平面がさらに３つ増えます。マウスで操作するには少々効率が悪いですが、機械的なソートでは整理出来ない情報整理の提案しています。こうした手動による情報整理が出来るソフトで最近見つけたのが Grape [http://tayasui.com/Grape.html] です。Mac OSX で動作するこのアプリケーションを使えば、仮想のデスクトップ上でファイルを自由に整理・検索が出来るようになります。手動と自動によるファイル整理をバランスよく行えるという意味でお勧めです。仮想デスクトップの広さはスクリーン

コンテンツ

コンテンツを活かすためのサイト制作

ウェブサイト制作の仕事をしているとはいえ、サイトの情報構造やインターフェイスについて考えているだけではありません。どのようにしてサイトにコンテンツを掲載するのか、それらをどのように管理していくのか、なぜそのコンテンツをサイトに掲載する必要があるのか検討しなければいけません。クライアントによっては掲載したいコンテンツが漠然であったり、壮大な場合があります。クライアントのニーズに応じて、CMSに頼る部分を検討する必要もあります。ウェブの媒体を活かした戦略はあるので、それがどういったものか、専門用語も含めて解説を行ったり、フィードバックをするプロセスがあります。これがデザイナーの仕事なのかといえば、違うのかもしれません。私が好んでこうしたやりとりをクライアントとしているのは、デザインをするための材料であり、中心的存在となるコンテンツについて考える時間に参加して調整が出来る点にあります。ウェブサイトは立ち上がったので終了というより、立ち上げてからどうサイトを成長させるのかが重要です。最初の段階でクライアントとコンテンツについて考える時間を設けることは、同時に立ち上げた後のプランも立てやすい

UX

お勧めのオンラインコラボツールいろいろ

基本的なコミュニケーションはメールやチャットといった文字情報のみで出来ますが、ビジュアルに関する考えを共有する場合、文字だけでは難しいです。スクリーンショットに手軽に情報を入れたり、スクリーンキャスト (動画) を作るツールが充実してきたので、ビジュアルを共有するのも難しくなくなってきました。絵を見せて意見を交換するというやりとりだけならメールでも難しくありません。しかし情報共有したり、共同作業をしたいと考えると、オンラインツールが最適です。今回はウェブサイト制作に役立つオンラインでコラボレーションを可能にするツールを幾つか紹介します。 Protonotes [http://www.protonotes.com/]以前builder.comの記事 [http://builder.japan.zdnet.com/member/u514743/blog/2008/11/21/entry_27018103/] として紹介したことがありますね。ウェブサイトに JavaScript のコードを埋め込むだけで、どのサイトにも付箋を貼付けることが出来るサービス。使う側は会員登録やプラグインを必要と

IA

効果的なプロトタイプを早く作るコツ

プロトタイプを作るのは重要ですが、作るためにおおくの時間を割きたくないところ。特に作ったあとも何回か調整をするわけですから、あまり作り込むわけにはいきません。しかし、あまりに単純な見た目だと情報共有が難しくなります。自分が使い慣れているツールを使うのは第一歩ですが、ちょっとしたことを気をつけることで、効果的なプロトタイプを早く作れるようになります。スゴいコツだ！というのはありませんが、心がけてるだけでも少しばかり早く作れるようになりますよ。使えるパレットを用意するよく使う UI 要素やコメントを付けるためのパーツはパレットにしておくと効率的。以前紹介した、OmniGraffle用 [http://www.yasuhisa.com/could/roundup/graffletopia/]とPowerPoint用 [http://www.yasuhisa.com/could/article/powerpoint-prototyping/]を利用すると手軽です。テンプレートを用意するOmniGraffle では、通常のファイルを新規作成が出来るだけでなく、テンプレートを作成すること

インターネット

企業がTwitterをするべきではない10の理由＋

海外では Twitter をカスタマーサービスや利用者とのコミュニケーションツールとして利用しているところが増えてきています。自動車メーカーではFord [http://twitter.com/scottmonty]、GM [http://twitter.com/gmblogs]、Honda [http://twitter.com/Alicia_at_Honda]。スポーツだとChicago Bulls [http://twitter.com/chicagobulls]、San Diego Chargers [http://twitter.com/chargers]。他にもComcast [http://twitter.com/comcastcares]、 Travel Channel [http://twitter.com/travelchannel]、DirecTV [http://twitter.com/DIRECTV]、Best

UI

変わりゆく「保存」の存在

アプリケーションに必ずあるコマンドのひとつに「保存」があります。このメタファーとしてフロッピーディスク [http://tinyurl.com/2xnvon] が長く採用されています。採用された当時は「フロッピーディスクのアイコンがあるから何かを記録するものだろう。よってこれは保存するという意味だ」と関連づけすることが出来たと思いますが今はその逆で「保存をするには、このアイコンをクリック」という認識になっているかと思います。フロッピーディスクが姿を消してしばらく経ち、知らない人も多いのにも関わらず、このメタファが使われ続けられているのも、ひとつの理由として、アイコンが意味を示すものではなく、意味を示すためのアイコンになり、広く認知されているからかもしれません。 Office 2007 [http://www.amazon.co.jp/gp/product/B001GCUTW0?ie=UTF8&tag=could-22&linkCode=as2&camp=247&creative=7399&creativeASIN=B001GCUTW0]

OSX

SousChefでレシピ管理がしたい

MacHeist 3 [http://www.macheist.com/] にはウェブサイト制作にや役立ちそうなアプリケーションが幾つかありますが、違う系統で興味をひいたのが SousChef [http://www.acaciatreesoftware.com/] というレシピ向けのアプリ。単にレシピを書き込んで整理するだけでなく、材料を買ったり作るときに便利な工夫が幾つかなされています。レシピに書き込まれた材料の分量は人数分 (yield) を変更することで自動的に変化するようになっています。アメリカ製のアプリなので用意されている単位が oz や gallon と分かり難いですが、こうした単位も自分で加えたり、自分のオリジナルの単位も作ることが出来ます。ひとつの材料がなくても、他の材料でどうにかなる場合がありますが、代わりになる材料のリストもあらかじめ作っておくことが出来、料理の際はあるもの材料で作ることも簡単に出来そうです。買い物の際は、作るレシピを「Grocery Lists」へドラッグ＆ドロップすると、印刷可能な買い物リストを作ってくれます。ついでに料理とは別に必要