Yasuhisa Hasegawa

Yasuhisa Hasegawa

Web やアプリのデザインを専門しているデザイナー。現在は組織でより良いデザインができるようプロセスや仕組の改善に力を入れています。ブログやポッドキャストなどのコンテンツ配信や講師業もしています。

https://x.com/yhassy https://www.facebook.com/yhassy/
意見

読まなくなった私たちと「読む」の今後

今、書籍を読む人たちはどれくらいいるのでしょうか。学生の頃はたくさん読んでいましたが、今は減ってきています。そもそも書籍を読むということが時にストレスがたまることも少なくありません。はやく要点に辿り着いて欲しいと感じる事もあれば、検索が出来ないのでとても不便と感じることもあります。 お菓子コンテンツが愛される 少ないメッセージやちょっとしたリンクであれば Twitter [http://twitter.com/yhassy] で十分役割が果たせるので、このサイトでは情報を盛り込んだ読み応えのある文章にするよう心がけています。Web には他にもたくさんの長文と呼ばれる記事はありますが、本のボリュームで考えると数ページの話です。それですら私たちは「あとで読む」とタグ付けをしてブックマークの奥底に放置します。むしろ、長文は読者受けされにくく、ザッピングに最適化されたリストや Tips が多いのが現状です。 このサイトでも長文かリスト形式の Tips にするかでアクセス数が大幅に異なることがあります。 Webだけが、こうした一口サイズのお菓子コンテンツになっているわけではありません。書
コンテンツ

私的今年のベストWebサイト

今年もたくさんのサイトを見てきたわけですが、個人的に最もインパクトがあったのが Boston Globe が運営する写真ブログ「The Big Picture [http://www.boston.com/bigpicture/]」。Twitter [http://twitter.com/yhassy]でいろいろな サイトを紹介 [http://www.yasuhisa.com/could/twitter/]していますが、かなりの頻度で The Big Picture を紹介しました。写真 (コンテンツ) が素晴らしいのは当然ですが、他にも注目する点は幾つかあります。 このサイトは Boston Globe という 100年以上続く新聞社が運営しています。他の新聞社と同様、発行部数は大幅に落ちており非常に厳しい状況 [http://www.editorandpublisher.com/eandp/news/article_
シンプル

複雑をシンプルにしても駄目な場合

「シンプルがベスト」という言葉はデザイナーでなくてもよく使う言葉です。しかし、すべてをシンプルにしてしまえば良いというわけではありません。シンプルの反意語で「複雑」という言葉があります。しかし、英語の「Simple」の反意語には「Complicate」と「Complex」という２つの言葉があります。いずれの単語も日本語にしてしまうと「複雑」になってしまいますが、使い方が違います。そして、「Complicate」をシンプルにするのと、「Complex」をシンプルにするのは意味が異なります。 「Complicate」は込み入ったものや困難という意味がありますが、「Complex」は幾つかの部品からなる複合体、入り組んだという意味が含まれています。共に複雑に構成されている可能性がありますが、必要なもので作られた複合体（Complex）だとしたら、シンプルにするのは難しいです。つまり、「Complicate」はシンプルにすると良いですが、「Complex」は一概にそうとは言えないということになります。複雑だからシンプルにしたほうが良いというわけではなく、その複雑さがどういった性質のものか判断
デザイン

2009年ベストイントラネットサイト

オーストラリアのコンサルティング企業 Step Two Designs [http://www.steptwo.com.au/] は、2007年から企業のイントラネットサイトで優れたデザインを紹介・分析したレポートを公開しています。詳細な情報を知りたい場合はレポートを購入する必要がありますが、概要であればオンラインで観覧することが出来ます。イントラネットサイトに関する情報はなかなか表に出ることがないので、貴重な情報です。しかも、公開されているスクリーンショットはぼかしがかかっているものではなく、実際動作しているサイトのイメージで掲載されているのも嬉しいです。 優秀サイト一覧はこちらのページ [http://www.steptwo.com.au/products/iia2009/winners-iia2009] にリストされています。CRS Australia のようなオーストラリア国内のものだけでなく、IDEO や IBM のような有名企業もリストされています。オリジナリティ、スタッフへのインパクト、企業利益という３項目を審査対象とし、優秀サイトが選出されたそうです。レポートにはな
UX

Nokiaが考える2015年の未来

Webを利用した共同作業 [http://www.yasuhisa.com/could/article/nokia-betalabs/]や ジェスチャーを利用したコミュニケーション [http://www.yasuhisa.com/could/article/gesture-mobile-communication/]など、ノキアは UX に注目したサービスやデバイスの模索をここ数年続けています。そのノキアが、今月はじめにフィンランドにて The Way We Live Next 3.0 [http://events.nokia.com/thewaywelivenext/home.htm] というカンファレンスを開催しました。そこで、2015年に人々はどのような生活をしているのか幾つか提案をしています。「インテリジェント・デバイス」と呼ばれるネットに常時接続と同期をするデバイスを利用することで人々とシームレスに繋がる構想が描かれています。イメージビデオを見ると、その全体像がなんとなく見えてきますが、ビデオの下にサマリーを書いておきます。 * すべてのデータがクラウドに保管される
テクノロジー

メールがこれからも残り続ける理由

Google Wave [http://www.yasuhisa.com/could/article/google-wave-and-you/] は、Web上でのコラボレーションをより効率的に行うための新しいツールになる可能性があります。今までメールでやりとりでしてきたことを Google Wave で代替することで、情報のズレや漏れを防ぐことが出来るかもしれません。Google Wave 以前からも「メールは時代に合っていない。新しい形が必要だ」と言われていましたが、依然メールは仕事においてよく使うコミュニケーションツールですし、様々なデータが添付されてくることがあります。 新しいツールを使わない（使われない）理由として Web リテラシーを挙げる場合がありますが、これも一概にいえません。RSS や Gmail を使いこなしている Web に詳しい方でもファイルはメール添付で送ってくる方がいます。「Dropbox [https://www.dropbox.com/] とか便利ですよ」とサービスを紹介してもメールで添付してくる方もいます。その方は Web を基軸にした仕事をしていま
仕事

マイコミジャーナルでの連載が100回を迎えました

本日掲載された Magntize [http://journal.mycom.co.jp/column/lifehack/100/] の紹介記事で、 クリエイターのためのライフハック [http://journal.mycom.co.jp/column/lifehack/index.html] がめでたく100回目を迎えました。第一回目の Writeboard [http://journal.mycom.co.jp/column/lifehack/001/index.html] の紹介が 2006年ですから3年以上かかってしまいました。週に2,3回で途中から別の連載 [http://journal.mycom.co.jp/column/anatomyofwebdesign/index.html] を始めていることもあるので余計時間がかかったのかもしれませんが・・・いや、かかりすぎか。
Webデザイン

私にとってテクニカルアートディレクターの意味

Twitter [http://twitter.com/yhassy]では、自分の趣向に合ったサイトをリンクしているだけ [http://www.yasuhisa.com/could/twitter/] ということが多いですが、たまに仕事に関係したことを書いていることがあります。先週ですが、以下のようなことを書きました。 > 優れたマークアップをする方はテクニカルアートディレクターみたいな存在になっていくのかな。既にそんな方いるけど。 — Yasuhisa🗯 (@yhassy) November 12, 2009 [https://twitter.com/yhassy/status/5652774126] Twitterの文字数ではどうも説明しきれない部分があるので、この場で少し補足しておきます。 マークアップする方は印刷機？ 単価数百円のマークアップサービスがあるように、見た目のデザインを再現するという意味でのマークアップの価値は下がっていく一方です。もし見た目を形作るだけでマークアップがあるのであれば、それは当然のことです。紙の印刷業も同様で、見た目の再現の水準が同等で
Webデザイン

ゲームにもあるProgressive Enhancement

Progressive Enhancement [http://www.yasuhisa.com/could/article/progressive-enhancement-result/]は、Web サイト制作の取り組み方にも影響する重要なトピック。Web 特有の考え方だと思われるかもしれませんが、ゲームの世界では随分前から Progressive Enhancement をゲーム開発の一部として取り組まれています。 左が画質設定が最高の画面 影の中のディテールが鮮明だけでなく光の反射も繊細上の画像は「Crysis [http://www.amazon.co.jp/exec/obidos/ASIN/B000VYXVBU/could-22/ref=nosim/] 」というファーストパーソン・シューティングゲームのものです。同じゲームですが、少しだけ違う見た目を提供しています。ユーザーが影やテキスチャの質を自由に調整することが出来るので、環境により違う見た目になっています。素晴らしいグラフィックが特徴の Crysis ですが、こうしたハイスペックのゲームを古いパソコンで遊ぶとフレームレ
UI

Web OS 搭載のネットブック「litl」

正直、あまりネットブックに興味がなかったのですが、今月初めに発売された litl [http://www.litl.com/] は興味津々です。ソフトウェアのインターフェイスが独特なのと、機能ではなくライフスタイルからネットブックの可能性を提案している点が好感をもてます。ハードをフリップさせてデジタルフレームとして使える点のもおもしろいですね。 スペックをみると、HDDは2GB, 1GB RAM, 1.86GHz Intel Atom プロセッサなので、他のネットブックと変わりありません。しかし litl が他のネットブックより魅力的に感じるのは小さくて便利というスペックから見た魅力紹介ではなく、具体的な使い方を提案している点にあります。また、外へ持ち出すのではなく、家で使えるネットブックという見せ方もあまりないかもしれませんね。 litl の最大の特徴は、専用 OS にあります。これはモバイル向けの Ubuntu を改良したもので、インターフェイスデザインはロンドンを拠点とし今は世界各地に事務所をもつ Pentagram [http://pentagram.com/en/new
仕事

テラハウス訪問で考えた教育のこと仕事のこと

先日、東中野にあるテラハウス ICA [http://www.terahouse-ica.ac.jp/] キャリア開発研究所の見学に行きました。テラハウスは再就職訓練を実施している施設。東京都産業労働局には職業能力開発センターや職業能力開発校といった組織がありますが、テラハウスは民間委託訓練施設に属します。教務部長の金澤さま、 キョウリツネット [http://rico-web.net/]の新井さまと牧原さまにお時間をいただいて、職務訓練の現場について、そして教育する側からみた Web の仕事についてお話を伺いました。 再就職訓練という一度社会に出ている方を対象にして短期間で Web の仕事ができるためのスキルを教える場。3ヶ月の授業と1ヶ月、Webサイト制作会社にてインターンとして働くことが出来るカリキュラムになっています。週に5日の授業はトータルで360時間ありますが、その間に「使う拡張子はなに？」から具体的なワークフローの実践まで幅広く学ぶわけですからかなりハードです。しかも Photoshop, Illustrator, Dreamweaver, Fireworks, Fla
UI

決して使いやすいとはいえないタッチUI

iPhone [http://www.apple.com/iphone/] の登場以来、国内外問わず多くのスマートフォンがタッチスクリーンを採用しはじめています。これからのユーザーインターフェイスはタッチスクリーンだと感じている方もいるかもしれませんが、利用者はどのように感じているのでしょうか。 Canalys [http://www.canalys.com/]という調査会社がヨーロッパのモバイルユーザーにタッチスクリーンに関する反応をまとめています。 Survey reveals extent of shift in mobile UI preferences [http://www.canalys.com/pr/2009/r2009111.htm] この調査によると、次のモバイル機器の購入の際、指で操作するタッチスクリーンにしたいと考えている方は 38% にのぼり、スタイラス式（16%）の購入を考えている方を大きく上回ります。このようにタッチスクリーンの注目度は高いですが、既にタッチスクリーンの携帯電話を利用している方の反応は少し違います。Canalys の調査によると、47％
Adobe

アドビさんへ２

以前「アドビさんへ [http://www.yasuhisa.com/could/article/dear-adobe/]」という記事を書きました。当時 Dear Adobe [http://dearadobe.com/t] という Adobe 製品の不満や改善点を共有するサイトが話題になり、私も記事内で提案を幾つか書きました。そして、その記事を書いたおよそ１年後のAdobe MAX [http://2009.max.adobe.com/] で CS5 [http://cs5.org/] がほんの少し紹介されました。一体どのような改善点が見られるのか楽しみにしていたのですが、結果はガッカリする内容でした。 もちろん、今回が CS5 のすべてではないですし、Flash Catalyst を中心とした RIA 戦略が話題の中心でした。失望するには早すぎますが、Photoshop CS5
デザイン

U2 360° 関連情報まとめ

96,000人を動員した 10月25日の U2 コンサート [http://360.u2.com/]は YouTube でライブ中継 [http://www.youtube.com/u2official] されました。U2好きでなかったとしても一見の価値があったイベントだったと思います。音楽を楽しむだけでもよかったのですが、仕事柄どうやってこのコンサートを実現したのか気になってしまいますね。コンサート中に Twitter [http://twitter.com/yhassy] でも幾つか情報発信していましたが、そこで公開しなかった情報も含めてこちらに一挙公開。いろいろな意味ですごいコンサートでした。 YouTubeでコンサート映像今日の中継を逃した方は別の日の映像なら見れます 1 [http://www.youtube.com/watch?v=FLaLeUaAh-M] 2 [http://www.youtube.com/watch?v=I3Sng0Bl69o] 3 [http://www.
IA

探索的検索という違う時間の流れ

検索とひとことで言ってもいろいろな形があります。私たちが Google などでキーワード検索するときは、答えを導き出すためのキーワードが分かっている場合がありますが、いつもゴールへの辿り着き方が分かるとは限りません。ゴールが何か明確でない場合もありますし、辿り着くためにまずは関連情報を学ぶ必要があるかもしれません。閲覧 (Browse) と検索 (Search) が合わさったような利用者の行動を Exploratory Search (探索的検索) と呼んでおり、ここ数年様々な研究・調査がされています。概要が知りたい方は Wikipedia の記事 [http://en.wikipedia.org/wiki/Exploratory_search]が参考になります。 今すぐ欲しい情報を探すのであればキーワード検索でも十分ですが、調査、仕事のプロジェクト、ライフプランなど中・長期に渡って探し続ける情報をいかに補助するかが課題です。今でもブックマークを使ったりメモソフトを組み合わせることで管理が出来ているものの、別の解も考えられます。探索的検索を理解することが出来れば、キーワードから導き
google

Google Waveがもたらす心理の変化

数日前に Google Wave [http://wave.google.com/] の招待状をいただき、いろいろ使ってみました。従来からあるメール、IM、Wiki そして WebEx [http://www.webex.co.jp/]のような Web 会議システムが混ざり合った独特の形といえます。具体的に何が出来るのか知りたい方は、動画 [http://www.youtube.com/watch?v=v_UyVmITiYQ]や記事 [http://www.atmarkit.co.jp/news/200905/29/wave.html] を確認してください。ブレインストーム、レビュー、共同で文書作成などコラボレーションをする際に使えそうな印象があります。 多くのサイトで既に語られている Google Wave
microsoft

マイクロソフトが提案する次世代マウス

先週、マウスとキーボードの代りになる可能性を示すデバイスとインターフェイスのデモ 10/GUI [http://www.yasuhisa.com/could/article/10gui/]を紹介しました。Microsoft のほうでもマルチタッチ機能をマウスに組み込むことが出来ないかといろいろ模索しているようです。10月初旬にカナダで開催されたUser Interface Software and Technology conference [http://www.acm.org/uist/uist2009/] で、5つの次世代マウスのプロトタイプが発表されました。Webサイト [http://www.microsoft.com/appliedsciences/mouse20.mspx] のほうで、5つのプロトタイプに関する書類と動画を観覧することが出来ます。 FTIR Mouse形状はマウスに似ていますが、マルチタッチ操作がしやすいように軽く曲線がかかったフラットな表面が特徴Orb Mouse マウス全体がマルチタッチインターフェイスなので、違う場所を触ることで違う操作が出来ますC
ユーザビリティ

見た目と使いやすさの素敵な関係

Web は、受動的に「観覧する」というより、能動的に「利用する」という特色が強いです。それゆえ、高いユーザビリティ [http://www.yasuhisa.com/could/tag/ユーザビリティ/] が求められますし、試行錯誤を続けている方もいると思います。ユーザビリティを洗練させることで、より人に使ってもらえる (売り上げに貢献する) Web サイトになると考えがちです。極端な例だと Google がそうで、見た目はともかく使いやすいさ、使い心地を徹底的に追及しています。では、使いやすければ好感度も高く満足されるサイトなのかといえば、実はどうでもないようです。 Wichita State University にある Software Usability Research Laboratory [http://www.surl.org/] で、サイトの見た目とユーザービリティの関連性について調査を行っており、その結果が Web サイトに公開されています。 Visual
コンテンツ

リクリでコンテンツとデザインについて話しました

先日スピーカーとして第2回 Re:Creator’s Kansai [http://www.re-creators.jp/vol2/]に参加しました。WDE [http://east.webdirections.org/] の菊池さんも加わり、これから何をしようかといった将来の話題が中心のイベントになりました。大阪でセミナーをするのはかなり久しぶりだったので、こうした機会が巡ってきて嬉しかったです。今年は執筆している記事も含め コンテンツ [http://www.yasuhisa.com/could/tag/コンテンツ] にフォーカスした講演が多かったですが、リクリでも再びコンテンツをテーマにした話題でした。今までは概念的な部分が多かったのに対し、今回は「 コンテンツ戦略を意識したデザインアプローチ」という題名で、コンテンツにフォーカスしたサイトの組み立て方を、実際あるサイトを例に挙げて解説しました。 テレビ、紙媒体、ラジオでは顧客・消費者を「視聴者」「読者」「観覧者」と呼びます。受動的な呼び名が使われているのに対し、Webでは「利用者」という能動的な表現を使います。ちょっとした違い
UI

10/GUIとマルチタッチインターフェイスの可能性

マウスとキーボードを使って GUI に表示されている情報を操作するという手法は 30 年以上採用され続けています。多くの方が慣れ親しんでいる方法とはいえ直感的に使えるわけではありませんし、複雑な操作をマウスだけで行うのは難しいです。今の時代に合ったマウスに代わる次世代の操作を模索している動きは以前からありますが、 10/GUI [http://10gui.com/] はその中でも出来が素晴らしいです。Techcrunch [http://www.techcrunch.com/2009/10/13/10gui-one-very-slick-desktop-multi-touch-concept-video/] をはじめ幾つかのサイトで紹介されているので、既にご覧になった方もいるかと思います。 次はタッチスクリーンと考えがちですが、手が邪魔でスクリーンが見えなくなるという問題があります。これを解決した例としてデバイスの裏からタッチする Nano touch [http://builder.japan.zdnet.com/member/u514743/blog/2009/10/08/ent
デザイン

知識ではなく知恵を養おう

先日開催された3.4.U [http://www.yasuhisa.com/could/diary/3-4-u/]で、サイバーガーデンの益子さん [http://www.cybergarden.net/] にお会いしました。イベントが始まる前に少し話をすることが出来たのですが、そのとき「知識ではなく知恵を大事にしないとね」という話をされていました。サラッと名言を残し姿を消した益子氏でしたが、よくよく考えてみると仕事においてとても重要な考え方だなと思いました。Webデザインという狭い範囲で考えても当てはまることですね。 他の分野と同様、Webデザインにも幾つかのルールが存在します。検索をすると「すぐ出来る」「知っておきたい」「鉄則」「ルール」あたりの言葉が添えられたノウハウがたくさん出てきますし、書籍も似たような感じです。こうしたルールを示す情報があること自体は重要ですが、これによって本当に「正しいこと」が出来ない場合があると思います。 ルールがある以上、例外は存在します。大まかに「Webサイト」とひと囲みしてもそれぞれ目的や作り方が違うので、ルールに当てはまらない場合は出てきます。
Webデザイン

3.4.U!で情報とテクノロジーの変化について話しました

2009年10月8日、JWDA・CSS Nite・PCC の共同イベント 3.4.U! [http://www.jwda.jp/event/e20091008/] にて「コミュニケーションの変化からみる今後のWebデザイン 」とう題名で講演をしました。毎回セミナーに行くと数人知っている方にお会いするのですが、今回はほとんどいなかったので少しだけアウェーな感じがしました。それも恐らくビジュアルデザインやマーケティングなど Web という共通項があるものの、違う立場で仕事をしている方が集まるセミナーだったからかもしれません。こうした場にあまり参加したことがなかったので、新鮮でもあり良い体験をさせていただきました。私の前に話をした un-T factory [http://www.un-t.com/] の中川さん、ニューロテクニカ [http://www.neuro-technika.com/]の細野さん共にプレゼンが上手だったという意味でも刺激になりました。 いろいろ技術が出て来ては消えています。人によっては何を学べば良いのか分からなくなったり、覚えることが多過ぎて気が滅入ってしまうこ
openwebdesign

404ページのデザイン提案【後編】

このエントリーは「404ページのデザイン提案」の続きにあたります (前編 [http://www.yasuhisa.com/could/article/designing-404-1/]) (中編 [http://www.yasuhisa.com/could/article/designing-404-2/])スケッチをすることでページの大まかな形が見えてきたところで、早速コーディングに入りました。404という1ページの課題なので、そうしているというのもありますが、最近は Photoshop とかでビジュアルを固めないままマークアップを記述することがあります。結局ブラウザで表示される状態でないと分からないこともありますし、骨格の状態から徐々に色や雰囲気を加えて行く作業は結構楽しかったりもします。構造への意識もしやすいですし、この時点でまたレイアウトを吟味出来る機会があるという意味でもメリットがあると思います。こういう作り方をしているので、ブラウザのデバッグツールが充実しているのは非常にありがたいです。 すべての案件でそうしているわけではないですが、今後はそうしていきたいですし、素早く
google

Googleが考える新聞の生き残る道

随分前になりますが、今年の 4 月に Google の Eric Schmidt が Newspaper Association of America の集会で 演説を行いました [http://newshare.typepad.com/newshare/2009/04/audio-google-ceo-eric-schmidt-addresses-the-naa.html] 。また、別のサイトで質疑応答の筆記録 [http://www.poynter.org/column.asp?id=101&aid=161441] も公開されています。新聞の発行部数も広告収入も急激に落ちて来ているアメリカでは、Web サイトに様々なコンテンツを掲載し、開けた印象を作り始めています。質疑応答のほうでは良くも悪くも Google 視点な見解と提案がなされていますね。以下に要約をリストアップしておきます。 * いずれかひとつではなく、広告、購読、マイクロペイメントの3つが収入源になるだろう。
openwebdesign

404ページのデザイン提案【中編】

このエントリーは「404ページのデザイン提案【前編】 [http://www.yasuhisa.com/could/article/designing-404-1/]」の続きにあたります。なぜ 404 ページが表示されたのか、そして利用者が出来る次のアクションが何かがみえてきました。これからいよいよ大まかなレイアウトのスケッチに入るわけですが、もうひとつ考えておきたいことがあります。ページに表示させたい項目だけでなく、必要でないと考えられる要素も洗い出しておくと、スケッチが最初の段階からある程度洗練されたものになります。 通常のページでは必須項目でも目的が絞られてるページだとそうではない場合があります。「あっても良い」「もしかすると誰か必要になるから」くらいの要素は目的が絞られているページでは省いてしまっても良いと思います。要素を最小限に絞り込むことで、ページで伝えたい目的がより明確になるでしょう。サイト内のリンクからで 404 が表示される割合より、サイト外からのアクセスで 404 が多く表示されています。そこで、サイト内でいろいろ読みたいけど行き詰まった人というよりかは、読みたい