Yasuhisa Hasegawa

Yasuhisa Hasegawa

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

セミナー

VCもエキサイティングな仕事だ

先月 [http://www.yasuhisa.com/could/diary/meetup-february2008/]に引き続き、百式の田口さん [http://www.100shiki.com/] が主催の勉強会に参加してきました。今回はエンジニアの方、アニメーター、企画やプロデュースをしている方など10人くらいが集まりました。ベンチャーキャピタル [http://ja.wikipedia.org/wiki/ベンチャーキャピタル] (VC) の方に基本的なことを教えていただいたり、質問や疑問に応えていただくという形式で、前回より勉強会の色が濃かった集まりでした。 短い時間ではありましたが、VCの特徴やビジョン、そして VC と組むときに気をつけること、逆に VC が投資をするときに気をつけていることなど貴重な話を聞くことが出来ました。「知らない」「分からない」という感覚が「怪しい」や「不安」に繋がってしまうことがあります。これは様々なことにいえることで、今回勉強会に行く前に VC に対して抱いていた感覚も (ほとんどステレオタイプかもしれませんが) そういうところが多少あったと

wasp

Web標準に関する良書を教えてください

Web Standards Project [http://webstandards.org/] は、今でも Adobe Task Force [http://www.webstandards.org/2008/03/10/announcing-the-adobe-task-force/] を立ち上げるなど、Web標準を考慮したサイト作りが出来る環境をつくるために様々な活動を行っています。その中で興味深いのがWaSP Street Team [http://streetteam.webstandards.org/]。図書館や学校にある古い書籍にこっそり URL 入りの栞を忍び込ませて草の根的な活動をするというちょっと変わったプロジェクト。本当にやっている方 [http://www.flickr.com/groups/wasp-streetteam-bookmarks/pool/] もいるみたいですが、同僚や同業種の友達に渡すちょっとしたアイテムにもなりそうです。春ですし、新入社員に渡すということも出来そうですね 今のところ 洋書のリスト [http://streetteam.web

セミナー

湯川鶴章さんの勉強会へ行ってきました

[http://www.flickr.com/photos/yhassy/2366851274/]前回ポッドキャストで対談した [http://www.yasuhisa.com/inflame/show.php?s=118]安田さんからのお誘いで、AMN [http://agilemedia.jp/] 共催の広告代理店や企業のマーケ担当の方向けの勉強会 [http://agilemedia.jp/blog/2008/03/post_58.html]に参加してきました。Webマーケティングに関して鋭い視点をもつ 湯川鶴章さん [http://it.blog-jiji.com/0001/] の生の声と最新事情が聞けた貴重な時間でしたが、広告に携わる方が大半を占める中で、彼らの言語や視点を体感出来たという意味でも有意義な時間でした。 先月あった百式の田口さん主催の勉強会 [http://www.yasuhisa.com/could/diary/

視覚化

メールを視覚化するツールいろいろ

ネットを利用した様々なコミュニケーションツールがありますが、生活や仕事で最も使われるのがEメールだと思います。スパムメールを含めると本当にたくさんのメールが行き来しています。 About Email [http://email.about.com/od/emailtrivia/f/emails_per_day.htm]によれば 12億人がEメールを利用しているといわれています。2006年には 1830億通のメールのやりとりが毎日行われていたそうです (そのうちの7割はスパムという悲しい事実もありますが)。 今回は身近な存在であるEメールを視覚化しているツールをいろいろ紹介。テキストベースのEメールがいろいろな形に変化していておもしろいです。 3D Mailbox [http://www.3dmailbox.com/]メールのやりとりをバーチャル空間で見せるという凝ったメールソフト。個人的にゾンビ版 [http://www.3dmailbox.com/snapshots/level03/index.html]を使ってみたいですMountain [http://alumni.media

IA

サイドバーの行方

サイドバーはブログが広まる前から存在していたコンポーネント。メインコンテンツ以外の情報を上部に載せることが出来るので、多くのサイトでサイドバーが採用されています。実装も簡単に出来ますし、3カラム、4カラムと増やすことも出来るわけですが、実装の敷居も低いのでただの賑やかしになってしまいがちの部分でもあります。情報の配置の仕方によって、情報が活かされるときもあれば、そうでないときもあります。サイドバーもメインコンテンツ以外の情報を放り込む場所ではなく、的確な情報が載る場所として扱わなくてはいけません。 ブログのサイドバーで必要なもの サイドバーによくある情報は * 最近のエントリーリスト * 最近のコメントリスト * アーカイブリスト * カテゴリリスト * タグクラウド * Feed をはじめとした購読ボタン * ウィジェット諸々 アクセス解析やサイトコンセプトによってサイドバーの使い方も変わってきます。このサイトは Feed は多くの方に登録されていますが、サイトまで訪れる方はその中のわずかな数ですし、エントリーによってアクセス数も数倍違うこともあります。よって、情

google

Google のデザインガイドライン10項目

以前 Google の UX プロセス [http://www.yasuhisa.com/could/article/google-ux-process/] というエントリーで、Google が考えるユーザー体験を向上するための対策を紹介しました。Google のような数多くのサービスを運営している大企業でなかったとしても、参考になる項目が幾つかありましたが、先日 Google Operating System で Google’s Design Guidelines [http://googlesystem.blogspot.com/2008/03/googles-design-guidelines.html] という記事が掲載されました。Google アプリケーションのユーザー体験を担当する Jon Wiley 氏が WritersUS Conference [http://www.writersua.com/ohc/track1.htm#

データを一望出来るダッシュボードいろいろ

特定のデータを詳しく分析したいという要望もあると同時に、全体を見渡して傾向を把握したいときもあります。そういった場合、ダッシュボードがトップページとして表示されることがあります。様々な種類のデータやコンテンツが一望出来るという意味では iGoogle をはじめとしたウィジェット(ガジェット)を使ったサービスもダッシュボードの一種といえるでしょう。 ダッシュボードも見せ方はいろいろあって、様々なサービスをみると参考になります。 ClubReady [http://www.clubready.com/management.asp]フィットネスクラブ管理ツール。ブログ [http://www.clubreadyblog.com/]のほうでスクリーンショットが見れますCapital One Card Lab [http://capitalone.com/cardlab/]見た目も優れていますし、横のステップが見えるインターフェイスも良いですねGoogle Sites [http://sites.google.com/a/altostrat.com/project-eggplant/Home

仕事

Find Job! にインタビューが掲載されました

Find Jobs! ではクリエーターを目指している方に向けたインタビューコンテンツ『生業』を毎月掲載しています。有名な方や知っている方も出ているこのシリーズですが、今回 僕のインタビューが掲載されました [http://www.find-job.net/support/nariwai/09.html] 。インタビュー自体は約1時間あり、いろいろ話した記憶がありますが、いい感じに短くまとめられています。なぜこの仕事を始めたのかといういきさつも少々書いてあります。こうしてインタビューといて掲載されていると、よく考えていたようにみえなくもないですが、結構行き当たりばったりの部分が多かったりします、はい。 インタビューでは今までブログで書いてきたところを断片的にして話しているところがあるので、このサイトを読んでいただいている方にとっては総集編のように見えるかもしれませんね。たぶん以下のエントリーと合わせて読むと分かりやすいと思います。 * Webデザインへの理解を深める [http://www.yasuhisa.com/could/entries/001210.php] * Webと

openwebdesign

複数のサイクルで構成されたプロセス

ブログエントリーをタイプ別に振り分け、どのような読者がサイトを訪れているのか漠然的ですがみえてきました。そして、ついにプロトタイプをそろそろ作って行くという段階に近づいて来たわけですが、ここでプロトタイプからテスト、もしくは公開までの進め方を紹介していこうと思います。 通常、上図のように分析、プロトタイプ、デザイン、コーディング、テストというプロセスが順に行われます。それぞれのフェーズにサイト全体を考慮しつつ進めて行くわけです。このプロセスは多くのサイト構築に使われていますし、特に問題もないと思いますが、別の方法も考えられます。特に様々なタイプのページが存在するところだと、全体を一気にデザインしたりコーディングするのではなく、細分化して進める方法もあると思います。 こうした進め方をするメリットは幾つかあります。 * 一部の機能やページに特化するのでフォーカスしやすくなるだけでなく、ビジョンの共有もしやすい * ひとつひとつ組み立てていくことで全体的な方向性も見えて来る可能性がある * 先に行われたサイクルが次のサイクルを進めて行く上で参考になるので、より洗練されていく *

MacBook Air の入れもの

PowerBook G4 12 inch を持っていたときは、それにピッタリはいるバッグのようなものがあったので愛用していたのですが、MacBook Air [http://www.yasuhisa.com/could/review/macbookair/] にしてから、そのバッグが形に合わせないので使わなくなりました。なかなか「これ!」というものが見つからず、結局保護するためのケースがないまま持ち歩いています。とはいうものの、そのまま持って行くのは嫌なので文房具屋やコンビニで買うことが出来る A4書籍用の角形2号の封筒に入れて持ち歩いていました。 見た目はどうかと思いますが、とりあえず保護してくれているのでそのまま使っているわけですが、打ち合わせに持って行くと「あー あの CM [http://www.apple.com/jp/macbookair/#ad] の真似してるのね」と言われて笑いのネタになることもしばしば。どうせなら CM のと同じのほうが良いのに中途半端に真似しているようで余計微妙というか・・・(笑 そんな中 CSS Nite [http://cssnite.jp

IA

今時のプロトタイピング

この記事は「PowerPoint を使ったプロトタイピング [http://www.yasuhisa.com/could/article/powerpoint-prototyping/]」の続きにあたります。 ページベースの Webサイトを制作するのであれば、多くの方が利用出来るということも含めて PowerPoint [http://office.microsoft.com/ja-jp/powerpoint/default.aspx] や Keynote [http://www.apple.com/jp/iwork/keynote/] といったプレゼンテーションアプリが最適だといえます。しかし、Ajax や Flash を利用したページを移動することなくデータにアクセスするサイトや Webアプリケーション、ショッピングサイトのような会員/非会員によって異なるコンテンツやフォームを必要とするサービスでは、ページベースで Webサイトを考えるのは困難です。 ユーザーテストをする際も PowerPoint や Keynote では難しい場合もあるでしょう。共に高度な描写が可能になり見た目

IA

拡張性のあるデータ配置を模索する

そろそろ大まかな形でワイヤーフレームを作っていこうと思っているわけですが、その前にいろいろ準備しておきたいことも幾つかあります。そのひとつが、拡張性を考えて、どのようなデータをどの辺りに配置するのがベストかを考えること。これは Webアプリケーション開発において特に重要になってくることだと思いますが、大幅な改変をしなくても、機能やミニコンテンツといったコンポーネントを付け加えることが出来るように設計しておく必要があります。もちろん、すべての可能性を考慮することは不可能ですが、あらかじめ拡張されることを考慮して設計を始めるか始めないかでは大きな違いがあります。 下の図はページを大まかに4つに別けて、異なる配置を考えたものです。 ※ ワイヤーフレームの基盤のような存在なので、実際のサイトのワイヤーフレームを作っているわけではありません。 ナビゲーションサイトのグローバルナビゲーションに当たるエリア。Webアプリケーションにおいては機能を示すことが多いコンテキスト / データセット 現在観覧しているページがどういったページが示していたり、サイト全体からみたページの位置を示しているエリア。

powerpoint

PowerPoint を使ったプロトタイピング

プロトタイプを作るソフトウェアは Visio [http://office.microsoft.com/ja-jp/visio/FX100487861041.aspx] のような高度な機能があるものを含めて複数あります。一番最初の段階であれば紙でも良いと思いますが、Webサイト上でのインタラクションを可能な限りリアルに再現して検証するにはパソコン上で行うのが最も適しています。どのツールが良いか迷っている方もいると思いますが、どうやら Microsoft では PowerPoint 2007 [http://office.microsoft.com/ja-jp/powerpoint/default.aspx] がワイヤーフレームを作るツールとして使っているそうです。 2007年、韓国で開催されたカンファレンスで PowerPoint 2007 を使ったワイヤーフレームに関するセミナーがありました (Silverlight ムービー [http://www.microsoft.com/expression/events-training/globalevent/player/Defa

google

Google の UX プロセス

今では小さなチームによるアジャイルソフトウェア開発はそれほど珍しくはないですが、Google は随分前からそれを実践している企業のひとつです。よりよいものを作ることであれば、時には今まで辿って来た道も変えてしまうこともあるダイナミックな環境でどのようなプロセスが存在するのでしょうか。 David Sherwin さんのブログ [http://changeorder.typepad.com/weblog/2008/03/secrets-of-ux-d.html]で、Google のユーザーインターフェイスデザイナーである Jake Knapp さんのセッションに関するレポートが掲載されています。 Knapp さんのセッション内で、ダイナミックに変わる環境化の中で、よりよいユーザー体験をもったサイトを構築するための8の対策を紹介したそうです(細かく別けると全部で17)。以下に簡単にですが紹介しておきます。 確固たるプロジェクトの基盤をもつチームが小さい分、フォーカスしなければならないプロジェクトのもつ影響力は?他のプロジェクトではなく、それを選ぶ理由を考える ビジネスインパクトを知るU

アート

クラフトっぽいアート作品いろいろ

Pete Goldlust [http://www.petegoldlust.com/carvedcrayons.html] クレヨンに凝った彫刻を施しています。なんとなくトーテムポールJennifer Maestre [http://www.jennifermaestre.com/pencil_show.html] 鉛筆を使って独特な形をした『彫刻』を作っています。海底の生き物のようですGesine Hackenbeg [http://www.gesinehackenberg.com/]食器から食器が出て来ていますYvonne Bavman [http://www.bavman.se/yvonne1.html]羊毛で出来たリアルな動物たちTricot Machine: Les peaux de lievres [http://www.youtube.com/watch?v=NO0-1GKXZEA"]ミュージックビデオが全編編みもので出来ています。

アイデア

コラボレーション・イノベーション

「コラボレーション」「イノベーション」という言葉はここ数年、日本でもよく聞くようになった言葉だと思います。Webを利用することによって場所も時間も関係なくコラボレーションが出来るようになってきました。年齢も立場も気にすることなく意見交換も出来るわけですから、良いですよねぇ。集団の知識をつかうことによって、ひとり、もしくは小規模では実現することが出来ないようなことも形になることもあります。より多くの方とコラボレーションすることが新たなイノベーションに繋がる可能性もありますね。 以前マイコミの連載で Behance Network を紹介 [http://journal.mycom.co.jp/column/lifehack/060/index.html] しました。ここは基本的にクリエイターと呼ばれる方の SNS で、自分の作品を公開するのに便利なサイトですが、ひとつユニークな部分もあります。「Circle」は同じ趣向をもった人たちが集まるグループ機能のようなものですが、ひとつのプロジェクトを進めるのに集まるスペースとしても使われています。例えば Webサイトを作るという Circle

openwebdesign

ブログでの会話を見えるようにするには

2005年なので少し前の資料になりますが、Noor Ali-Hasan という方がブログスフィアでどのように会話が始まってお互い繋がり合っているのかを調査した Analyzing the Social Patterns and Behaviors Associated with Blogrolls and Blog Comments [http://www.noor.bz/blogstudy/] という論文を発表しました。クウェート、アラブ首長国連邦、アメリカ・ダラス という異なる場所に住む 500人のブログと、それらに投稿されたコメント 4000通、サイドバーにある Blog Roll のようなリンク集を調べたそうです。 視覚的に表現されたもの [http://www.noor.bz/blogstudy/findings.html] もあるのでぜひ見て欲しいですが、論文で重要になってくるのが、場所や文化に関係なくブロガーは新しい人 (オフラインの世界で知らない人) と対話をする傾向にあるという点です。 試しに僕のサイトに投稿された過去 100以上のコメントから自分がまだ会ったこと

openwebdesign

コメントを残す8タイプの読者

「コメントリストで考えられるパターン [http://www.yasuhisa.com/could/article/commentlist-pattern/] 」では、ブログのコメントリストの見せ方から読者との関係を良いものに出来るかを考えて行きましたが、今回はもう少し突っ込んで読者にスポットを当てたいと思います。読者と一言でいってもブログに訪れる方は実に様々です。住んでいる場所も職種も年齢もすごく幅の広いです。それゆえ明確な切り分けは出来ませんが、コメントを残す方はある程度決まっていると思います。 もちろん人間なので、そのときのムードやちょっとしたことがきっかけで変化すると思うので明確な区別は出来ないですが、8つのタイプの方(もしくはモードになった方)がコメントを残したりコメントを残す可能性を秘めています。 友達・同僚 その人を個人的に知っているから読んでいる方も少なくないです。たとえ日常を書いた日記でもおもしろく読めるのは、文字だけでは伝わらない何かを読み取ることが出来るからかもしれません。今でも mixi 日記を書いたり読んだりするのは、この要素は大きいでしょうね。特に SN

ビジネス

お試しマーケティングいろいろ

消費者が選ぶことが出来る製品はあまりにも多く、どれが良いのか迷います。メーカーも認知してもらうために様々な種類の広告やマーケティングキャンペーンを行っていますが、やはり実物を見たり触ったりして買いたいのが消費者の本音でもあります。以前から、サンプルを試してもらうという手法は使われていたわけですが、近年その方法も実に様々でクリエイティブです。今回はそんなお試しマーケティングでおもしろいのを幾つか紹介します。 Matter [http://www.matterbox.co.uk/]無料で登録出来る会員になりと、不定期に Matter から様々なグッズが入った箱が送られてきます。会員登録時に記入した個人情報を元に、広告主がターゲットにしたい人たちに向けて箱が送られるそうです。中身はこんなかんじ [http://matterbox.co.uk/matterblog/?p=48]。Wyndham Hotels & Resorts + VTech Electronic [http://www.wyndham.com/specialoffers/programs/details/vtech.wnt

openwebdesign

コメントリストで考えられるパターン

Webサイトの基本3要素 [http://www.yasuhisa.com/could/article/site-direction1/] のひとつである「Relationship」。ブログでは重要な部分ですし、例え企業サイトを構築する際にも重要な要素になっていきます(もちろんブログと同じ見せ方ではないですが)。ブログで最も簡単に関係を築く方法がコメントです。それぞれのエントリーにコメントフォームを置いて読者がいつでも感じたことを自由に書き込むことが出来るようにします。コメントを通じて筆者と読者の関係がより濃いものになるだけでなく、そのコメントを読む他の読者とも共感という間接的な繋がりをもつことが出来ます。 ひとつの窓口としてコメントは良い機能だと思いますが、不満点がないわけではありません。コメント数が長いと見た目が単調になり、読み難いという印象もありますし、多くの方に読んでもらうべき貴重な情報もコメントにあるがために読まれないというケースがあります。自分のサイトは自分が管理しているので気にはなりませんが、コメント数が多くページが延々と続くと読む気が失せることもあります。 貴重なコ

ビジネス

フリーランス3700人に聞いた調査結果

フリーランスといっても完全にフリーランスの方から週に数時間だけフリーランスの仕事をこなすといった方もいるので様々です。このサイトに訪れている方の中でフリーランスの方もいると思いますが、 FreelanceSwitch [http://freelanceswitch.com/]のほうでフリーランスに関する興味深い調査結果 [http://freelanceswitch.com/general/3700-freelancers-surveyed-the-results-are-here/] がまとめられています。 世界中のフリーランサー3700人からの回答を PDF で購入することが出来ます。応えた人の81%が男性という偏った結果にはなっていますが、全体の9%はアジアの国の方なのでアメリカだけに特化した結果ではないようです。 50ページ以上もある貴重なデータなので、興味のある方はぜひ購入してほしいですが、以下に気になったデータを少しだけ紹介。 * 89%がフリーランスになって幸せになったと応えている。これは職種に関係なく高い回答率 * 50%がフリーランスになって働く時間が減った

意見

良いものを作りたいという思いの共有

昨日は百式の田口さん [http://www.100shiki.com]が主催したエンジニアとデザイナーの集まりに参加しました。あきやん [http://www.akiyan.com/]やサイドフィード [http://sidefeed.com/ja/]の赤松さんをはじめ 「ひとりで作るネットサービス」探訪 [http://www.itmedia.co.jp/bizid/hitori_index.html]に登場した面々、 エスカフラーチェ [http://www.escafrace.co.jp/]のお二人、つい最近一緒にポッドキャスト [http://www.yasuhisa.com/inflame/show.php?s=113]したまめこさん [http://blog.woopsdez.

ビジネス

Webマーケティングのホットスポット

Webサイトは立ち上がってからが勝負ですが、それはサイトのメンテナンスだけでなく、マーケティングの側面からみても同じです。オープン後どのようにサイトをプロモーションしていけば良いのか、どういった方法が最も効果的なのかマーケティング担当の方は日々考えていると思います。それでは、マーケティング担当の方は今の Web で、どのような手法が利用価値が高いと考えているのでしょうか。 MarketingSherpa [http://www.marketingsherpa.com/]が、「Top Web Advertisers Rate Best & Worst Online Tactics & Budget Plans Email to a Colleague [http://www.marketingsherpa.com/article.html?id=30337] 」という記事で、インターネットマーケティングを担当している 421人から得たアンケートの結果をまとめています。詳しい内容は記事を参照してほしいですが、気になった部分をピックアップしてみました。 検索とEメール * 57%が S

UCD

UCDではないもの

UCD (User Centered Design) / 人間中心設計プロセスは、ここ数年注目を浴びている言葉のひとつ。特に私が携わっている Webサイト制作業界でよく聞く言葉のひとつですし、エンジニアやプログラマーも UCD を意識している方も少なくありません。UCD について詳しく知りたい方は、棚橋さんが書いた「 User Centered Designが必要な理由 [http://gitanez.seesaa.net/article/36221098.html]」が参考になると思います。 今このサイトで行っているオープン Web デザイン [http://www.yasuhisa.com/could/tag/openwebdesign/]も UCD を考えてやっていることではありますが、他のバズワードと同様 UCD も扱いに気をつけなければならない言葉だと思います。利用者のことを考えてデザインしていますという意思のようなものが UCD という言葉から伝わってきますが、「利用者を中心とした」という言葉の真意は何処にあるでしょうか。ペルソナを作ったとしてもごく少数のためにデザインす

openwebdesign

手動と自動のバランスがサイトの質へと繋がる

カテゴリをエントリーのタイプと見なし、それぞれのエントリーに関するキーワードをタグとして書き込むという分類方法は多くの方にとってもしっくり来たといえるかもしれません。しかし、まだ考える余地が幾つかあるといえます。その代表格にあたるのが「 タグの役割を考えた見せ方 [http://www.yasuhisa.com/could/followup/role-of-tags/] 」でも話題になった「Follow-up」という分類。 Follow Up はサブタイプ > Toru [http://waviaei.com/]さん ArticleのFollow Upならば、ArticleとFollow Up。AnnoucementsのFollow Upならば、AnnouncementsとFollow Up。と言う具合に、両方にタイプ付けはどうでしょうか?個人的にはFollow Upは必要無いのでは? Toruさんが提案しているように、2つのタイプをチェックしておいたほうが良さそうです。また、「Follow Up」のリンクをクリックして、そのタイプのみを読むということはないでしょう。「Follow