Yasuhisa Hasegawa

Yasuhisa Hasegawa

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

コンテンツ

ところでコンテンツは誰がする仕事なの?

専門的だが、専門でする人がいない 昨年は、1 年を通して各地で コンテンツ関連の講演やワークショプ [http://www.yasuhisa.com/could/announcement/content-seminar-workshop2/] をしてきました。アンケートの評価が高い人気講座になりましたが、多くの課題を残すことになりました。「よかった」と仰ってくださった参加者のソーシャルメディアやブログを追っていますが、学んだことを実践に繋げたり、今の仕事との関連付けに苦労しているという印象があります。これは参加者のスキルが足りないのではなく、 そもそも誰がする仕事なのか分かり難いというところに問題があると思います。 コンテンツを扱う講座では、以下のような仕事があると説明しています。 * 自社における『良いコンテンツ』を定義する * そのために、サイトへ訪れる人々の姿や文脈を明確にする * 現状のコンテンツを見直し、品質チェックを行う * 足りないコンテンツはなにか、必要なコンテンツはなにかを洗い出す * 掲載までのワークフローを見直し、必要であれば設計もおこなう * 運

デザイン

変わりゆく利用者行動と情報の流れ

縮小する Search & Find Google 以後の Web 利用は「Search & Find(検索して見つける)」が根底にありました。情報を見つけるために、キーワードを入力して検索したり、ディレクトリを掘り下げて目的の情報へたどり着くという行動です。 今や『当たり前』となった利用者行動ですが、Web の黎明期からそうだったわけではありません。90年代は、検索するといっても、欲しい情報が見つかる検索エンジンはなく、使わないほうが良いという考えもありました。そうしたなか、Google という優秀なアルゴリズムを実装した検索エンジンが登場したことで、広大な Web の中から情報を探し出すことが出来るようになりました。 このように技術が『当たり前』を作りだすことがあります。私たちの行動や思考は、技術に大きく左右されることがあるわけです。Google のような検索エンジンが登場したことで、Search & Find という行動が助長されたといえるでしょう。このように、技術に影響されるのは私たちの行動だけではありません。広告もマーケティングもすべてそうです。 Search &

UI

カードUIとコンテンツのパッケージング

小さなパッケージとしてのカード 前回の記事 [http://www.yasuhisa.com/could/article/message-card-ui/] で、メッセージのやりとりという文脈にカード UI が組合わさることで、新たな利用者体験を提供できるのではないかという話をしました。コンテンツを『ページ』としてではなく、『小さなパッケージ [http://www.yasuhisa.com/could/article/content-package-design/] 』にして利用者に配信することが主流になりつつある現在。これは、Web 上の情報のあり方を再考せざるを得ないと同時に、利用者にとって理解しやすい(ページに代わる)メタファが必要とされているのだと思います。小さなパッケージの表現方法としてカード UI は、無視できないデザインパターンのひとつです。 カード UI の可能性を最初に感じたのは、2010 年に登場したPinterest [http://pinterest.com/] 。たくさんの画像を全面に出しつつ、概要や操作を統一感を持たせてコンパクトに表現しています。P

ポッドキャスト

ポッドキャスト、再び配信中です

2011年2月から名前を変えてスタートをした Automagic Podcast [http://automagic.fm/]。2014 年 1 月からは、誰かと雑談するという形式で、ほぼ毎週のペースで配信しています。 昨年度は仕事のリズムが変わったことと、さすがに一人で話すのが辛くなてきたので、半年ほど小休止していました。以前から 何人もゲストに来てもらっていますが [http://www.yasuhisa.com/could/announcement/automagic50/]、Q & A 形式のインタビューになりがちで、躍動感のようなものが少ないことがありました。 これは、ひとりでポッドキャストをしているときにもいえることです。台本を作って、それを読み上げているわけではありませんが、話をしている途中で新しいアイデアが生まれたり、予想もしていなかった展開になるといった、不確定要素が少ないのが個人的に物足りないところでした。誰かと対談すときは、(相手によりますが)きちんと質問のリストを作ってから始めることがありました。質問リストは、対談を進める上での安心材料になるものの、特に

UI

カードUIと会話化するデザイン

LINE [http://line.me/ja/], WhatsApp [http://www.whatsapp.com/], Facebook Message [https://www.facebook.com/about/messages/] のようなメッセージアプリの魅力のひとつに「情報の流れが制御できる」ところがあると思います。1対1の会話が中心なので、ノイズが少ないですし、情報を追いかけるのも容易です。 Jelly [http://jelly.co/] のように、メッセージアプリのような表現がメッセージアプリ以外で見られるようになってきているのも、今の利用者に求めらている情報の形だからなのかもしれません。 今、UI デザイン [http://www.yasuhisa.com/could/article/no-border-design/] という観点で注目しているのは、この『メッセージ型 UI [http://www.yasuhisa.com/

コンテンツ

今CMSで本当に必要とされているもの

今の CMS の現実 ここ数年で、CMSは劇的に変化しています。 マイクロCMS [http://www.yasuhisa.com/could/article/before-implimenting-cms/] が注目を集めているのは、その兆候のひとつですが、こうした変化の要因は、従来の CMS では今の利用者に届ける仕組みを作るのが困難だからです。自分の好きなデバイスでアクセスする利用者。より柔軟な表現。どのサービスを経由してアクセスされるか分からない情報経路の複雑化。 WordPress [http://wordpress.org/], Drupal [http://drupal.org/], Movable Type [http://www.sixapart.jp/movabletype/] をはじめ、5 年以上経っている CMS の多くは、パソコン向けの『ページ』や構造に最適化された設計になっていることから、今後登場するかもしれない未知のデバイスやサービスまで見据えたマルチデバイス対応が難しいわけです。 実は、従来からある CMS でも「

コンテンツ

嫌われないスマホサイトを作るための第一歩

2013年12月21日に WCAN Winter 2013 [http://wcan.jp/event/2013winter/] が開催されました。CSS Nite Shift [http://www.yasuhisa.com/could/article/making-is-great/] と同様、WCAN [http://www.yasuhisa.com/could/article/modern-times/] も毎年招待していただいている年末イベント。今回は「 スマホサイトが嫌われる理由と改善方法」と題して講演をしました。今年は全国各地でコンテンツ関連の講演・ワークショップ [http://www.yasuhisa.com/could/announcement/content-seminar-workshop2/] を行ってきましたが、そのダイジェスト版のような内容。『スマホサイト』という制作者であれば身近なキーワードと合わせて話をしました。講演の詳細は 鈴木 健太郎さんの記事 [http:

デザイン

ポストPC時代のWebで注目している2014年のキーワード

タブレットの販売台数が PC を超えた [http://www.idc.com/getdoc.jsp?containerId=prUS24314413] 2013年第四半期。(スマートフォンは 2011 年で超えています [http://tech.fortune.cnn.com/2011/02/07/idc-smartphone-shipment-numbers-passed-pc-in-q4-2010/] )。スマートフォンやタブレットはもちろん、情報へアクセスするための『ガラス』は、今後ますます増えていきます。2014年は、Web へアクセスするための手段が文字通り多様になるといっても過言ではありません。iPhone をはじめとするマルチタッチのスマートフォンが出回りはじめた頃は『モバイル Web』という言葉が用いられていましたが、これからは『The Web(これが Web)』と言い換えたほうが良いでしょう。PC がなくなることはありませんが、「まずはパソコン版を前提」という考え方はいちはやく拭い去らないといけなくなります。 自動的に取得した睡眠のデータを、いつでもアクセスでき

ゼロ・グラビティ
映画

ゼロ・グラビティ

映画「Gravity (邦題 ゼロ・グラビティ)」のあらすじは、「事故に見舞われた宇宙飛行士が、無重力空間のなか、地球への帰還を試みる」というシンプルなもの。アクション映画と思って劇場へ向かった人もいるかもしれませんが、まったくそうではなかったと気付くと思います。 映画の設定もハリウッド映画ではあまり見ないものでした。登場人物はわずか 2 人(アポロ13 [https://www.amazon.co.jp/dp/B006QJT0C8/ref=as_li_ss_til?tag=could-22&camp=1027&creative=7407&linkCode=as4&creativeASIN=B006QJT0C8&adid=1HKZMDGXE2DNSK5ZD97V&] でも司令室に立っていたエド・ハリスが声で出演しています)。舞台もほぼ一カ所で、

アイデア

作れることは正義である

撮影:飯田昌之 12月14日に CSS Nite Shift7 [cssnite.jp/lp/lp31/] が開催されました。基調講演ということで、少し先の未来を話すようにしていましたが、今回は未来に備えるための『今の話』をしました。「スクリーンの先、私たちの仕事の先 」という題名で話した今回の講演。スクリーンの外を見ようというメッセージは伝わったと思いますが、仕事の先の意味が捉え難かったかもしれないので、この記事で解説しようと思います。 アイデアと完成品との間 アイデアがあるからこそ、新しいサービスやプロダクトが生まれます。しかし、この間には大きな溝があって、なかなか繋がらないことがあります。素晴らしいアイデアでも製品にしてみるとそうでもなかったり、どこかで質が低下してしまったり、アイデアが製品にうまく反映していなかったり、いろいろです。 Web サイト制作の世界では、この溝が広く深いことがあります。アイデアを生み出したり、設計に関わる「考える人」と、実際手を動かして構築する「作る人」が完全に分離(分業)していることがあります。作るひとが、考える側に立ち入る余地がないこともあ

ガイドライン

問題解決のためのスタイルガイド入門

定義が広いスタイルガイド フロントエンド開発者からスタイルガイドという言葉を耳にするようになりました。効率的、かつ一貫性のある見た目とコードをつくるための共有ツールとして、スタイルガイドが使われることがあります。一見、目新しくみえるスタイルガイドですが、最近生まれた新しいアイデアではありません。 ロゴやコーポレートカラーの使い方を記したスタイルガイド [http://www.logodesignlove.com/brand-identity-style-guides]は昔からありますし、 ライターにもスタイルガイド [http://web.calstatela.edu/library/styleman.htm]があります。 このように、開発者も、デザイナーも、ライターも同じように「スタイルガイド」という言葉を使っています。人によって、その言葉から受ける印象も異なれば、必要としている要素も異なります。 YUI 並の UI アセット [http://yuilibrary.com/] をスタイルガイドに含めることを期待している人もいます。アプリや Web サイト開発におけるスタイルガイ

アクセシビリティ

コンテンツからみるWebアクセシビリティの課題と提案

コンテンツは本当にアクセシブルか Webアクセシビリティは、大きく分けて 2 つの『デザイン』があります。ひとつは、情報を分かりやすく整理し、目的の情報へた辿り着くための Web アクセシビリティ。この要素は、色、形状、動き、スピードなど、UI デザインの課題と重なるところが多いです。もうひとつの要素は、情報の構成や文章のスタイルといった「編集」とも呼べる Web アクセシビリティです。 前者の情報構造や操作性は、明確なガイドライン化がしやすく、チェックもしやすいですが、後者の編集の部分は、パッと見では判断がしにくいだけでなく、ガイドラインとして共有するのも難しいです。 Webアクセシビリティにある 2 つの『デザイン』 もちろん JIS X 8341–3:2010 [http://waic.jp/docs/jis2010-understanding/] でも「利用者が理解できるコンテンツ」を制作・維持できるようにすることが重要であると書かれていますが、

コンテンツ

核の共有がデザインやコンテンツ設計に役立つ理由

撮影: 田中舘 一久 10月19日、CSS Nite in SENDAI, Vol.7 [http://cssnite-sendai.info/vol07/] が仙台で開催されました。今までありそうでなかった こもり まさあき [http://twitter.com/cipher/] さんと一緒に講演できました。私と彼の切り口も話し方も異なりますが、共通のメッセージが含まれているなと、勝手に親近感を抱いております。 無言語の言語化 今回は、Webサイトの核をデザインするための最初の一歩 と題して、ニュアンスがなんとなく伝わっているだけのコンセプトを、共有できるように言語化してデザインに繋げていこうという話をしました。最近コンテンツ設計 [http://www.yasuhisa.com/could/tag/%E3%82%B3%E3%83%B3%E3%83%86%E3%83%

ほんとに使える「ユーザビリティ」
ユーザビリティ

ほんとに使える「ユーザビリティ」

エリック・ライス氏が 2012 年に刊行した「Usable Usability [https://www.amazon.co.jp/dp/1118185471/ref=as_li_ss_til?tag=could-22&camp=1027&creative=7407&linkCode=as4&creativeASIN=1118185471&adid=0NFMFB122BE38QYPFW5S&] 」の訳書です。 この種類の専門書は原書で読むことが多いので、久しぶりの訳書になりました。訳書の魅力は、日本語で読めるのはもちろん、原作者の住んでいる国の文化やニュアンスを理解していないと、伝わり難い部分を補っているところです。世界中を飛び回っているライス氏なので、世界のユーザビリティに興味をもつ読者に向けて執筆しているはずです。しかし、それでも『日本から』という視点では見え難いこと、分かり難いことは少なくありません。

ソーシャルメディア

Blendtecが今でもソーシャルメディア活用のお手本になる理由

ミキサーを製造・販売をしているアメリカの Blendtec [http://www.blendtec.com/] 。名前は聞いたことなくても、あらゆる製品をミキサーで破壊する番組 Will It Blend? [http://www.willitblend.com/] を見たことある人は多いと思います。ソーシャルメディアや動画配信の事例で、必ずといっていいほど Blendtec が紹介されることがあります。とても有名なので、事例として紹介するのはベタ過ぎるという意見もありますが、改めて Blendtec を見直してみると、他がやっているようでやっていないことがたくさんあります。 Will It Blend でもパーソナリティを務めている Blendtec の創業者 Tom Dickson さんは、今年の3月に Slashdot ユーザーの質問に自ら応える企画に登場しました。詳しくは、Interviews: Blendtec Founder Tom Dickson Answers Your Questions [http:

コンテンツ

人々のためのコンテンツをつくるという視点

利用者ニーズへのフォーカスは成功する 利用者が求めているコンテンツや機能を提供する。 とてもシンプルかつ当然のコトのように思えますが、実践が難しいことがあります。多くの Web サイトは、配信側のニーズ(製品を売りたい、プロモーションを見てほしい、など)を優先して配置することがあります。配信側のニーズではなく、利用者のニーズにフォーカスしたコンテンツ配信をはじめなければいけません。 プロモーションやアピールを中心にしている Web サイトデザインとは真逆の考え方ですが、良い結果に繋がっているサイトも幾つかあります。例えばノルウェーの The Norwegian Cancer Society [https://kreftforeningen.no/] (ノルウェーがん協会)は、自分たちのニーズ(寄付金を集めたい)ではなく、人々のニーズ(がんの症状や治療方法を知りたい)を優先して配信したことで、人の動きが大きく変化しました。( 参照 [http://www.slideshare.net/idaiskald/content-against-cancer-csforum13-hel

モバイル

スマートフォンは実生活のためのリモコンである

Techcrunch で、「Great Mobile Apps Are Remote Controls For Real Life [http://techcrunch.com/2012/09/21/great-mobile-apps-are-remote-controls-for-real-life/] (すばらしいモバイルアプリは実生活のためのリモコンである)」 という記事が公開されています。リモコンは、ただボタンを1回押すだけでチャンネルを変えたり、利用者が求めている操作を実現することができます。すばらしいアプリも同様に、面倒な操作や画面遷移を辿ることなく、リモコンのように1タップで済むものであると解説しています。その一例として、最近日本でもサービスを開始した Uber [https://www.uber.com/] が挙げられています。サイトに「ボタンをタップするだけで、Uber アプリはお客様のドライバーを探します。」と書かれているとおり、リモコンのような手軽さが、人気の秘密なのかもしれません。 昨年の記事ですが、今のスマートフォンの存在を上手に表現していますし、スマ

コンテンツ

必要なコンテンツを見つけるシナリオつくり

すべてのコンテンツが重要ではない 「コンテンツは既にある」「当然コンテンツは重要だから、きちんと見せる」という考えは珍しくありません。しかし、すべてのコンテンツが重要とは限りません。 リニューアル案件だと、コンテンツが既に揃っているかのように見えますが、実は削除すべきコンテンツが幾つか隠れています。きちんと作ってあるかのように見えるコンテンツも、調べてみると、利用者にもクライアントにも望まれていないコンテンツがそのまま残っていることがあります。コンテンツを一望することができる、 コンテンツ インベントリー [http://www.yasuhisa.com/could/article/content-communication-points/] をつかえば、古いコンテンツ、重複しているコンテンツ、誰もアクセスしていないコンテンツが見つけやすくなります。また、現行のブランド戦略や伝えたいメッセージと合わないコンテンツも削除か、編集・結合の対象になります。 Web は無限にコンテンツを保管しておくことができるので、何でも『とりあえず』掲載しておくことは可能です。しかし、明確なガイド

UI

利用者モードとUIの関係

タッチデバイスを視野にいれた UI パターンの事例がかなり出そろってきました。使いやすいと定評があるもの、流行なもの、採用例が多いものなど様々ですが、実際のところどの UI パターンを採用すれば良いか迷う場合がでてきます。「○○の場合は、このパターン」と一発で決めることが出来なくても、考慮したいパターンを絞ることができます。絞り込みの際に利用者のモードが役に立ちます。 モードとは、人がアプリケーションやサービスと向き合うときの状態のことを指します。利用者の意図、環境、時間、向き合っているデバイスに応じて、モードがダイナミックに変化することがあります。モードを理解することで、利用者のニーズに近いインターフェイスを提供することができます。同じ系統のアプリケーションでも UI が全く異なる場合がありますが、それは利用者のモードの捉え方の違いからだと考えられます。 モバイルアプリケーションの多くは以下の 5 つのモードに振り分けることができます。 1. Explore(探索): 全貌を見渡したり、新しいものを見つけ出す 2. Consume(消費): コンテンツ観覧にフォーカスする

コンテンツ

CMS導入前にしておきたい質問

今注目されている Micro CMS 従来は Joomla [http://www.joomla.org/], WordPress [http://wordpress.org/], Drupal [http://drupal.org/], Movable Type [http://www.sixapart.jp/movabletype/] 辺りから制作者の肌に合うツールを選ぶ場合がありました。これらは今でも十分に使える高機能 CMS ですが、機能が多過ぎることから、メンテナンス、運営、ワークフローをしっかり設計していないと、複雑で扱い難いものになることがあります。無料から使える小中規模 CMS は出そろった感がありますが、ここ 1, 2 年ほど新しい CMS を幾つか見かけるようになりました。 * Pico [http://pico.dev7studios.com/] : 静的ファイルを管理する CMS * Dunked

デザイン

模擬のWebから特性を活かしたWebへ

2013年10月5日に WebSig一日学校 2013 [http://1ds.websig247.jp/2013/] が開催されました。普通のセミナーとは異なり、廃校をリノベーションした独特の会場をつかって Web に関わる様々な分野の方が集まるイベントです。2011年も 一日学校で講師 [http://www.yasuhisa.com/could/article/design-is-politics/] をさせていただいたので、2回目の登壇になります。 WebSig一日学校は、毎回視野の広いテーマで開催されることから、日々の仕事にすぐ役立つ情報は少なめです。しかし、仕事にある制約や事情という縛りを一旦抜けて、自由に思考できる場なのが良いなと思っています。今年も1日学校の最後に開催されるワールドカフェに生徒の一員として参加しましたが、ひとりの Web の仕事に携わる人間として平等に語り合えるのは素晴らしいことだと思います。 模擬の時代の終焉 今年は「未来へ繋ぐWeb系デザイン思考」という題名で講演。作るだけでは価値がない時代に、どのように Web をデザインすれば良いのか

apple

iOS 7 UI 考察(前編)

発表当時から賛否両論の意見が飛び交っていた iOS 7 [http://www.apple.com/jp/ios/] 。普通に使えるようになってしばらく経つので、改めて Apple (特に ソフトウェアエンジニアリング担当の Craig Federighi と デザイン担当の Jony Ive)が何を目指しているのかを私の中で考えてみました。今回は特に色にフォーカスしてデザインコンセプトの分析です。こういう見方もあるんだという、ひとつの視点として見ていただけると嬉しいです。 人間性を持たせること 人間性(Humanize)は、Apple の歴史からみて重要なキーワードだと思います。1984 年に発表された Machintosh 128K は当時のコンピュータの概念を覆す色・形でした(コンピュータの宣伝をスーパーボールで放送するというのも革命的でした)。一部のテクノロジーに強い人たちだけが使う、どこか冷たくて突き放しているイメージがあったコンピュータを一気に一般消費者のほうへ近づけた製品です。 Machintosh 128K は、ハードウェアだけではなくソフトウェアも大きな注目を

デザイン

偽デザイナーが送るデザインに関するメッセージ

素敵なデザインだなと思った人もいるかもしれませんが、実は全部『ウソ』。 アーティスト Amy West [http://amywest.ie/] が立ち上げたデザイナーをあざ笑うかのようなプロジェクト。「Grafik BS [http://www.behance.net/grafikBS]」へアクセスすると、他にもたくさんの作品をみることができます。 本質を追求せず、見た目やスタイルがすべてだと考える架空のクリエイティブエージェンシー GrafikBS。Behance Network のほうで本物のデザイナーと混じって作品を公開しています。わざわざ Twitter アカウント [https://twitter.com/GrafikBS] を作ったり、インタビュー映像まである懲りようです。インタビュー映像ではデザイナーらしからぬ危険な言葉を次々に発しています。 * スタイルがデザインで最も重要。見た目が良いものに人は反応する * インターネットで調べれば、今のトレンドが分かる。それを真似れば良い * デザインは見た目を良くすることであり、それ以上のものではない *

仕事

サービスに携わるデザイナーが少ない理由を考えてみた

先日開催された [http://www.yasuhisa.com/could/article/vision-ux-ui/] イベントの登壇者のうち 2 人はサービスに携わるデザイナーでした。ひとりは Stores.jp [http://stores.jp/] のデザインを手がける河原さん。もうひとりは ココナラ [http://coconala.com/home] のデザインと運営をされている新明さんです。素晴らしいサービスには優秀なデザイナーがいるにも関わらず、デザイナーが集まらないという声をよく耳にします。サービスでデザイナーをしている方を何人か知っていますが、彼等も同じように「デザイナーが見つからない」と言います。 デザインの仕事 … と一言でいっても様々な形が存在します。 Web やアプリを手がけるサービス系のデザイナーも、他の Web 関連の仕事と同じようにみえて随分異なります。恐らくサービスを手がけるデザイナーは、今までにない新しいタイプのデザイナーなのかもしれません。今までにないからこそ見つかり難いですし、知られていないからこそ分かり難いタイプのデザイナーなのでしょう