Yasuhisa Hasegawa

Yasuhisa Hasegawa

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

コンテンツ

認知の違いから分かる効果的な情報の見せ方

情報は単に配信すれば伝わるというわけではありません。仕様書を読んで理解できる人もいれば、噛み砕かれた解説書を読むことで理解できる人もいます。また、文章を読んで論理的にアイデアを組み立てる人もいえば、絵から全体像を掴みながらアイデアを考える人もいます。 伝えるための情報デザイン、文章デザイン [http://www.yasuhisa.com/could/article/be-rhetoric/] で、情報(文章や絵図)をいかに構成することで人に伝わりやすくなるという話をしました。今回は情報を受け取る人に注目し、人が情報をどのように認知しているのかを考えてみます。 今回、Cognitive style and learning strategies [http://www.monografias.com/trabajos16/learning-styles/learning-styles.shtml] という文献を参考にしました。認知の視点から人がどのように学習をするのかを簡潔にまとめています。その文献によると、段階的に学習する Serialist と、メタな観点から学習する Holi

ゲーム

ゲームが作る新たなクリエイティブとコミュニティ

有名なゲーム会社が作った超大作ゲームも魅力ですが、個人がつくった小さなゲームも今や無視できない存在。Nintendo Wii や Facebook で多くの方にゲームが楽しまれるようになったひとつの要因として、ゲームがカジュアル化してきたところにあります。大作ゲームは高いスキルと時間を必要とされていましたが、カジュアルゲームの敷居は低く、10分くらい遊んでもそれなりに楽しめるものが少なくありません。 利用者の視点からいえば気軽に遊べるのがカジュアルゲームの魅力ですが、作り手にもメリットがあります。小さなアイデアをゲーム化して販売するための土壌が固まってきていますし、始めるためのコストも低くなってきました。もしウケが良くなかったら別のゲームを開発することは大作ゲームでは難しいですが、小さなゲームであれば可能です。 [http://www.humblebundle.com/]Humble Indie Bundle [http://www.humblebundle.com/] のようにインディゲームをお得な価格でセットで購入出来るサイトがあります。こうした企画が立ち上がるくらい今インディ

ソーシャルメディア

公共機関が必要なのはWebサイトではなく配信チャンネル

[http://www.city.takeo.lg.jp/]佐賀県武雄市が市のページをFacebookへ移行する [http://www.itmedia.co.jp/news/articles/1107/29/news054.html] ことで話題になっています。ニュースは「市長がはまっている 佐賀県武雄市、市のページをFacebookに完全移行へ」というキャッチーなタイトルが付いていますが、現在の Web サイトの情報は今後アーカイブとして残るみたいですし、会員登録をしなくても Facebook の情報は観覧出来るので、利用者・住民には大きな隔たりはないかもしれません。 公共機関が Facebook を中心とした活動をする、というのは武雄市が最初ではありません。インド デリー市の警察署 [https://www.facebook.com/pages/Delhi-Traffic-Police/117817371573308] は、住民から交通ルール違反をしている車・バイクの情報を募集しています。摘発した乗用車の登録番号を発表して、活動を随時知れるようになっています。

デザイン

モバイルにある3つのモノレイヤー

モバイル向けに設計する場合、場所は重要なキーワードです。「今、渋谷駅にいる」といった具体的な場所だけでなく、モバイルでは 3つの場所レイヤー [http://www.yasuhisa.com/could/article/mobile-layers/] を考慮しなければいけません。しかし、モバイルコンテキストを理解する上で、場所の理解だけでは不十分です。 モバイル機器におけるインタラクションはとてもパーソナルです。特定の場に居ざる追えない従来のデバイスに比べると、自由に動き回れて自分だけの時間をつくりやすいモバイル機器。スクリーンサイズも利用者とモバイル機器の1対1の関係をつくるのに丁度良い大きさです。パーソナルな関係が築き上げられているからこそ、1対1の関係で楽しめるゲームやエンターテイメントがモバイルでは人気ですし、家族・友人との対話に役立っています。 パーソナルな関係を築くのになくてはならないモバイル機器。利用者が触れるモノ(機器)にも、場所と同様3つのレイヤーが存在します。 デバイスレイヤー モバイル機器はさらに細分化することが出来ます。ハードウェア、OS、アプリ、バッテリ

ソーシャルメディア

ソーシャルメディアは扉を開けるただの鍵

Social media Screw Ups – A History [http://www.slideshare.net/socialmediainfluence/social-media-screw-ups] は、2004年〜2010年にあったソーシャルメディアを使った失敗を集めたスライド。海外の動向を見ているのであれば、知っている話も幾つか見つけることができると思います。従来、企業は送りたいメッセージやイメージを完全にコントロールすることが出来ました。しかし、ソーシャルメディアの登場でそれが大変難しくなってきたということをこのスライドは示しています。 もちろん、失敗談だけでなく成功も数えきれないほどあります。しかし、ソーシャルメディアを使えば成功に繋がるというわけではありません。ソーシャルメディアは TV や企業ページに代わる新しい情報配信チャンネルとは言い難いですし、Facebook や Twitter のようなツールが広く使われる前からソーシャルメディアの失敗はたくさんあり、今後も数は増え続けることでしょう。 ソーシャルメディアは信頼がなけば何も響かない場 [htt

デザイン

多側面ある一貫性と理解の共有

サイト全体の設計をするときに、必ずといっていいほど考える課題のひとつが一貫性 。GUIや情報の配置など一貫性を保ちたい要素は様々です。サイト全体の見た目だけでなく使い勝手や感覚的な印象を統一させることで、利用者にひとつの場にいるという安心感を提供すると共に、一定のブランドイメージを提供することが可能になります。 一貫性というのは単にすべてを同じにしたり、一定の基準を満たせば良いというわけではないところが難しいところ。ソフトウェア、Webデザインにおいて一貫性をつくるということはとても複雑なことだったりします。一貫性とひとことで言っても以下のように細分化することができます。 * 人の認知とシステムの振る舞いの一貫性 * OSのインターフェイスガイドラインを基にした一貫性 * 類似製品にある一貫性(ブラウザの進む・戻るボタンはどれを選んでも左上にあるなど) * ビジュアルの一貫性 * インタラクションの一貫性 * 操作上の一貫性 (ページレイアウトやフォームなど) * 用語の一貫性 * クロスメディアの一貫性(Webと紙媒体で同じ振る舞いをしているかなど) 実のところ

UX

体験について考えるとは

UXでは見えてこない側面 ひとつの考え方として UX (User Experience) は今日のデザインでは無視をすることが出来ません。デザイナーだけでなく、今やビジネスシーンでも耳にする「体験」という言葉。しかし、この体験という言葉は非常に曖昧な表現です。体験というのは主観的かつ内面的に感じ取るものであることから、良い体験の定義の仕方も異なる場合があります。 ところで「体験」ってなんですか? [http://www.yasuhisa.com/could/article/what-is-experience/] という記事で紹介したように、体験には「Experience Self」という今この瞬間を経験する自己と「Remembering Self」という記憶を辿る自己があり、どちらの体験を話しているかで話がズレてしまうことがあります。 体験について考える上で、「U(ユーザー)」が必要なのだろうかと疑問に思うことがあります。もちろん、ユーザーを無視してデザインしようと言いたいわけではありませんが、このユーザーという要素が入ることで体験そのものとはズレた議論になりやすいのではないかと懸

コンテンツ

青森で今必要とされるコンテンツとWebサイトのあり方について講演しました

7月9日、青森にてWeb サイトの運営について、改めて考えてみる [http://yes-aomori.jp/?p=1746] というテーマでセミナーが開催されました。今回は、IA Thinking [https://www.amazon.co.jp/dp/4862671063/ref=as_li_ss_til?tag=could-22&camp=1027&creative=7407&linkCode=as4&creativeASIN=4862671063&adid=1YX97767SM2XFPZ2DXPR&"] の著者・坂本貴史さん [http://bookslope.jp]と一緒に講演。

サービス

イマドキの電子出版プラットフォームいろいろ

電子書籍であれば、様々な方法で出版できるようになった現在。日本国内でも Puboo [http://p.booklog.jp/] が好調ですし、類似サービスも数多く出揃ってきました。もう出さない理由はないといってもいいくらい、自分のニーズに合わせて電子書籍が出せる状態になってきました。ファイル形式も分裂状態ですし、ソフトウェア UI も発展途上ですが、まずは電子書籍の世界に飛び込むための土台は作られているといえます。 テキストを流し込むと ePub のような比較的汎用性の高いフォーマットに変換・その場で販売というサービスであれば幾つかありますが、他にどのようなサービスがあるのでしょうか。中には独自のネットワークやビジネスモデルをつくっているサービスがあります。また、こうした電子書籍の時代だからこそ紙の書籍を軸にしたサービスもでてきています。 今回は最近注目されている出版プラットフォームを幾つか紹介します。 24Symbols [http://www.24symbols.com/] 無料で読める電子書籍プラットフォーム。Webブラウザとアプリで書籍が読めるようになっており、クラウ

モバイル

SwapSkillsでモバイルを意識したWebコミュニケーションの講演をしました

7月2日、野村カンファレンスプラザ日本橋にて SwapSkills doubbble01 [http://swapskills.info/2011/doubbble01.html] というセミナーが開催されました。7 人のスピーカーから、概念的なところからコーディング、UI設計、パフォーマンスという様々な側面からモバイス向けの Web サイト制作の今を検証しました。私は 「Mobile First:モバイルファースト」が意味する今後のWebコミュニケーションデザイン という題名で話をしました。技術的な話は少なめで、今私たちはどのような人たちに向けてサイトを作っているのか、そして彼等のニーズに応えるには何が課題なのかという話をしました。 最近、国内でも耳にするようになった「モバイルファースト」という言葉。これは元 eBay / Yahoo! のデザイナー Luke Wroblewski が提唱した [http://www.lukew.com/presos/preso.asp?26] と言われています。モバイル機器を使う人の割合が圧倒的に高くなるということ、そしてそこでの体験は非常

デザイン

デザイン、コード、マルチスキルの世界と私たち

比較は実はナンセンス デザイナーはコードが書けたほうが良いのか? ハイブリッドなのか専門家なのか・・・長く議論されてきているトピックのひとつです。Webデザインの分野でもデザイナーは HTML / CSS / JavaScript くらい出来た方が良いのでは?という意見がありますし、最近では UI デザイナーが Object-C や Java を学んだほうが良いのでは?という意見もあります。 デザイナーがコードの領域に踏み込めるようになることで、インタラクションや画面遷移など、見た目だけでなく細かい動きの制御の設計に直に触れることが可能になります。コードから物事が見れるようになることで、初めて視覚化・具体化できるアイデアもあるでしょう。では、コードも書けるハイブリッドデザイナーのほうが優れているのかといえば、答えは「YES」であり「NO」でもあります。多くの技能をもつということは、何でも屋になる可能性もありますし、特徴のない制作者になる可能性もあるからです。 コードも書けるデザイナーが求められているのか、それともデザインを突き詰めている人材が必要とされているのか?実際のところ

WD101

WD101: Webは見た目のコントロールがきかない

このシリーズでは Web Design101(WD101)と名付けて、ウェブデザインをより深く理解するための最初の一歩になる知識やノウハウをコラム形式で紹介していきます。 DTPという名の足かせ Webデザインはよくも悪くも DTP のノウハウを受け継ぎながら徐々に成長してきた領域です。今でも根強く残っている「ページ」という概念。タイポグラフィ・グラフィック・レイアウトなど DTP が培ってきたノウハウは CSS と HTML (ときどき JavaScript)を使って再現されたりしています。DTPの概念とノウハウがなければ Dreamweaver [https://www.amazon.co.jp/dp/B003F7831I?tag=could-22&camp=1027&creative=7407&linkCode=as4&creativeASIN=B003F7831I&adid=14E6WW5MR5ZFNY1RQ6MB&

UI

Kinectから始まる新しいインタラクション

既に 1000 万台が販売されていると言われている Microsoft Kinect [https://www.amazon.co.jp/dp/B003T9VDJQ/ref=as_li_ss_til?tag=could-22&camp=1027&creative=7407&linkCode=as4&creativeASIN=B003T9VDJQ&adid=18CVSS3GS5PZPPHH7QMH&] 。コントローラーを持たなくても身体を動かすだけで様々な操作を実現するこのデバイス。USB接続を使用していることもあり、発売開始直後から、PC や Mac に接続をしてハッキングをする方が続出。プログラミングのためのプラグイン・アドオン・ライブラリが続々と登場しました。久々にモノ作り魂に火が付いた方も少なくないと思います。 Kinect と AR を組み合わせたデモこうした開発者達の草の根活動を禁止することは出来たはずですが、

Automagic Book Club がはじまります

結構前から「ブッククラブ」やりたいなぁと思っておりまして、運営に便利なシステム(サービス)を立ち上げようと人に持ちかけたことがあるくらいです。日本ではあまり馴染みのないフレーズですが、読書会と言われるケースもありますね。定期的に会って課題として出した書籍について感想や意見を交換する集まりです。もちろん、ブッククラブ自体は新しいアイデアでもなく、 UX Book Club Tokyo [http://uxbookclub.org/doku.php?id=tokyo] という集まりもあったりします。最近だと NB Reading [http://nbr.business.nikkeibp.co.jp/] がソーシャルメディアと組み合わせて「雑誌を読む」という行為をソーシャル化しています。 今回、Automagic Book Club [http://automagicbc.tumblr.com/] というブッククラブを始めることにしました。デザイン系、Web/IT系の書籍を一緒に読むことを目的にした Web 上のブッククラブです。北海道にいても、

UI

マルチデバイスUI設計で注目したい5つの要素

2011年 UI/UX トレンド [http://www.yasuhisa.com/could/article/ui-ux-2011-trends/] という記事で、モバイルWebデザインのノウハウがデスクトップにも影響し始めているという指摘をしました。Mac OSX Lion [http://www.apple.com/jp/macosx/] や Windows 8 のような OS だけでなく、Web サイトにも変化が見られています。スクリーンの大きさを活用してモバイル環境では再現が難しいダイナミックで動きが多いレイアウトも出て来ている一方、モバイルアプリの血を受け継いだかのような目的にフォーカスしやすく、目的までのステップと選択肢が少ない Web サイト / アプリケーションも次々と出て来ています。 Windows Phone 7 をそのまま受け継いだかのような Windows 8 の UI今後デスクトップOS がモバイルOSのようになり、利用者がシンプルな操作と体験を求めやすい環境になれば、Web サイトも次第にシンプルになる可能性がありますし、そうしなければならない状況も出て

UI

2011年 UI / UX トレンド

2011年の1月。まだ年が始まったばかりでしたが、今年の Web デザイントレンド [http://webdesignledger.com/tips/web-design-trends-in-2011] という記事が発表されたりしていました。その後、数々のトレンド記事が国内外で数多く紹介されていますが、ルック&フィールに関する話題、又は技術的な側面から見た話題が多くを占めています。こうしたトレンドを知ることは重要ですが、トレンドの全体像として捉えるには多少偏っていると思います。そこで今記事では、UI / UX デザインの側面からみた 2011 年のトレンドを幾つか紹介していきます。 To Do アプリ Flow [http://www.getflow.com/] は、まるでデスクトップ向けの Mac アプリを使っているかのような UI デザインを Web 上で再現しています。この記事で挙げる幾つかのトレンドが現れるキッカケを作ったのは、テクノロジーと Web が今まで以上に強い連携が可能になったからです。デスクトップ(又はオフライン)アプリケーションと同等の能力を Web で実現出来

facebook

SNSにある自己表現とFacebookが見出した人の欲求

以前 脱テンプレートなFacebookの難しさと関係の変化 [http://www.yasuhisa.com/could/article/facebook-and-networkdesign/] という記事で、SNS の構造や仕組みから見た Facebook の独自性を解説しました。今回は SNS と利用者との関わり方を重点において解説します。日本でこれからどうなるか分からないですが、海外では学生からお年寄りまで魅了している Facebook。なぜ彼等は他の SNS ではなく Facebook にハマるのでしょうか。 ハマるといえば、最近ではゲームの要素を盛り込むという話がよく出てきます。私も昨年末に ゲームをテーマにした講演 [http://www.yasuhisa.com/could/diary/wcan2010-gamedesign/] をしましたし、そこでもゲームの要素を加えることで楽しさを増幅させることが出来ると解説しました。しかし、そうした要素を追加する前にソーシャルアプリやサービスの本質を見極める必要があります。そこの理解をなしにしては、たとえゲーム的な要素を加えたり

セミナー

7月は2カ所で登壇します

昨年末からセミナーで話すという機会に恵まれていませんでしたが、7月は2つあります。ひとつは7月2日、東京で開催される SwapSkills doubbble01 [http://swapskills.info/2011/doubbble01.html]。こちらはモバイル制作から見る次世代の Web のカタチを、コンセプト的な話から実践的なところまで幅広くカバーするセミナー。もうひとつは7月9日、青森市で開催されるIT活用サポーター活動事業セミナー [http://yes-aomori.jp/?p=1746]。こちらは Web サイト運営の見直しをテーマに私がコンテンツ戦略、坂本さん [http://bookslope.jp]が IA の視点から話をします。 [http://swapskills.info/2011/doubbble01.html]SwapSkills doubbble01 では、「Mobile First:モバイルファースト」が意味する今後のWebコミュニケーションデザインと題して、モバイル機器向けの Web サイトを作るという意味と、今後それがパソコンを含めた他デ

Order and Chaos
ゲーム

Order and Chaos

Gameloft [http://www.gameloftjapan.com/]が出すゲームは、どこかで見たようなゲームが多いという印象があります。 モダンコンバット [http://www.gameloftjapan.com/products/000637/index_iphone.html]や ヒーロー・オブ・スパルタ [http://www.gameloftjapan.com/products/000537/index_all.html] などコンソールや PC にあるゲームの類似品を幾つか見つけることができます。では、Gameloft がパクリゲームを作っているのかというと、そうではありません。Gameloft は、どこかで見たことあるゲームをモバイル環境に最適化し、誰でも気軽に楽しめる本格派ゲームを作り続けているところが魅力です。今回紹介する Order Chaos [http://itunes.apple.com/jp/app/

インターネット

境佑司さんとフラグメンテーションをテーマに対談をしました

対談が続いている Podcast 「Automagic」ですが、今回は音声、映像、テキストで幅広い情報を配信している境佑司さん [http://admn.air-nifty.com/web_design/]との対談。今年で2回目になります。2月に [http://www.yasuhisa.com/could/announcement/automagic-podcast/]境佑司さんと対談 [http://admn.air-nifty.com/web_design/2011/02/file-6372010--2.html] をしたときは、電子書籍や今後のWeb制作をしている人が入れる領域について話をしました。今回は、デバイスや情報のフラグメンテーション(分断)をテーマから入り、いつの間にやらゲームの話までしてしまうというという内容。1時間半くらい話していたのですが、アッと言う間に時間が過ぎ去ってしまいました。 過去10年くらいに登場したモバイル機器を並べながら行われた今回の対談。Android で起こる統一感のないインタラクションやインターフェイス、Webアプリとネイティブアプリの

TV

ロングテール化するTVと4つの展望

Apple TV [https://www.amazon.co.jp/dp/B004BR2CL8/ref=as_li_ss_til?tag=could-22&camp=1027&creative=7407&linkCode=as4&creativeASIN=B004BR2CL8&adid=1SKXA5YKF6N8T9HXH85A&] で見たい海外TVドラマや映画を好きなタイミングですぐに見れたり、自分がお気に入りの購読チャンネルを iPad や iPhoneで気軽に見れたりするようになった現在。HDDレコーダーが出たあたりから、CM をスキップして番組が見れる環境が整い始めてきましたが、今はクラウドからのストリーミング、オンラインサービスとの連携でいつでも何処でも見れたり、予約も何処からでも簡単にできます。TV が TV 局の番組を受信・映写する機械から、クラウドに通じるモニターに変化しているんだなとシミジミ思います。 Hulu

UI

GIMPが提案するソーシャルUI

着実に機能を増やし続けているオープンソースの Photoshop [https://www.amazon.co.jp/dp/B003F783CW/ref=as_li_ss_til?tag=could-22&camp=1027&creative=7407&linkCode=as4&creativeASIN=B003F783CW&adid=06T97V7BAYT1H3AXJMQD&] 代替プログラム GIMP [http://www.gimp.org/]。他アプリケーションとの連携を考えると Adobe 製品で揃えた方が有利ですが、機能だけみると Photoshop のライバルと見なしても良いくらい充実しています。GIMPは Photoshop と同様、プラグインやアクションが共有されている [http://registry.

ポッドキャスト

3pandaさんとコーディングについて話しました

Web関連ポッドキャスト Automagic [http://www.yasuhisa.com/could/announcement/automagic-podcast/] も無事 10 回目を迎えました。 今回は大阪でコーディングの仕事をされている @3panda [http://twitter.com/#!/3panda] さんとコーディングの魅力を中心にお話をしました。彼はパンダの会 [http://pandanokai.net/]という勉強会を 2010 年から続けており、そこでの活動内容や今後の展望についても語ってもらいました。 コーダーという仕事をしている方にとってコーディングをするということの魅力は何でしょうか?専門性がより一層必要とされているものの、多角的な視点が必要とされる現在の Web 設計。コーダーという仕事はこれから何処へ向かうのでしょうか、そして何が必要とされているのでしょうか。仕事やパンダの会を通じて様々なスキルセットをもつ人たちとコミュニケーションをとっている 3panda さんの意見は貴重だと思います。 Automagic #10 [http://

インターネット

Webから始まる教育パラダイムシフト

Sir Ken Robinson Changing Paradigms Creativity expert Sir Ken Robinson will ask how do we make change happen in education and how do we make it last? 教育システムと教育に対する考え方に鋭い疑問を投げかけるサー・ケン・ロビンソンの講演。同講演のイラスト版はこちらから [http://www.youtube.com/watch?v=zDZFcDGpL4U]。 MIT が講義を無料で公開する OpenCourseWare (OCW) をはじめて 10年になります [http://ocw.mit.edu/about/next-decade/