Yasuhisa Hasegawa

Yasuhisa Hasegawa

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

Iconic : A Photographic Tribute to Apple Innovation
apple

Iconic : A Photographic Tribute to Apple Innovation

イノベーションを『誰よりも先にすること』と捉えられることがありますが、それだけではないと思います。実際、アップルが誰よりも先に製品化、サービス化したものはごくわずかです。iPod が出る前に HDD 内蔵の MP3 プレーヤーはありましたし、マルチタッチスクリーンも消費者向けではありませんでしたが、既に存在していました。アップルの魅力は、機能や仕様に捕われない、今やるべきこと、未来にできることを考慮してデザインしているところだと思います。 ハードウェア、ソフトウェア、サービスを、他にはできない連携を実現することで独自の価値観を生み出しているアップル。いずれかを抜き出して語るのは、アップルのほんの一部を語るに過ぎないかもしれませんが、それをあえて実践し、魅力を最大限に引き出している本が「 Iconic : A Photographic Tribute to Apple Innovation [http://iconicbook.com/]」です。 これは書籍というより、図鑑と言ったほうが良いかもしれません。非常に大きく重たい本なので、ソファでじっくり眺めるのに適しています。アップ

未来

dConstructで学んだWebの仕事に関わる責任

先週はイギリス、ブライトン [https://www.google.co.jp/maps/place/Brighton,+The+City+of+Brighton+and+Hove,+UK/@50.837418,-0.1061897,13z/data=!3m1!4b1!4m2!3m1!1s0x48758509f6294167:0x9cc6af7a727d0ef9] を訪問していました。目的は dConstruct [http://2014.dconstruct.org/] へ参加するためです。 あまり日本では知られていないイベントですが、今年で 10 年目になる Web と未来をテーマにした老舗カンファレンス。イベント開始当初は Web サイト制作寄りのテーマが多かったですが、ここ数年にかけてスケールが大きくなった印象があります。今年は「ネットワークに住むわたしたち 」をテーマに、

デザイン

カスタマージャーニーマップが使える理由と注意点

デザインに使えるマーケティングツール カスタマージャーニーマップ(Customer Journey Map, CJM)は、顧客がどのように製品やサービスと関わるかを視覚化することによって、課題を共有することができるツール。デザインプロセスの一部として採用されるようになりましたが、マーケティングでは顧客との接点を俯瞰して見ることができるということで 5, 6 年前くらいから注目を集めています。(外来語をそのままカタカナ表記にしたくなかったということで「体験のマッピング [http://www.yasuhisa.com/could/article/dh-prototyping-course/] 」と名付けて以前から実践しています。) オンラインでもオフラインでも顧客との接点は劇的に増えました。しかし、接点が増えたことにより利用者行動の多様化が進んだだけでなく、接点になる場所・媒体の浮き沈みも激しくなりました。また、企業やブランドに関わる利用者の心理や行動も変化してきているので「A と B と C でコンテンツやサービスを発信すれば良い」といった一方通行のメッセージ配信では伝わり難くな

デザイン

デザインが分からない人とデザイン話をするコツ

良いって何ですか? デザインの話をするのは、たとえ本業をしている方にとっても難しいことがあります。それが他分野の方ということになると、なおさらです。目的に沿って議論することで、デザインがより洗練されるわけですが、別の部署、他の役職の方との会話になると、なかなかうまくいかないことがあります。 その理由は、彼等がデザインのことを理解していないからというより、お互いが考える「正しい」を理解していないからということがあります。 Webサイトやアプリを設計・開発されている方全員「良いものを作りたい」と考えています。ただし、その「良い」のニュアンスは立場によって少し異なることがあります。「良い=売れる」と解釈する人もいれば「良い=使いやすい」と捉える方もいます。それぞれがもつ「良い」という価値観が、その人の意見や考え方に大きな影響を及ぼしています。 言葉だけでは理解ができない デザイン案を見せると、以下のようなリアクションが戻ってくる可能性があります。 * 青がどうも好きになれない * このボタンはもっと大きく見せるべきだ * 必須情報が他にもあるので、上のほうに表示させたい

コンテンツ

コンテンツワークシートを公開しました

課題が多いコンテンツ設計 昨年、マルチデバイスを見据えたコンテンツ設計 [http://www.yasuhisa.com/could/article/visualize-content-process/] というセミナー&ワークショップを全国5カ所で開催しました。未知のデバイスも考慮し、特定の見た目に捕われないコンテンツ設計と管理をするための考え方や手法を紹介した講座。参加者から高い評価をいただきましたが、幾つか課題が見えてきました。 * マルチデバイス以前にコンテンツが設計できる状態とは言い難い * 制作ワークフローのどこからどのように始めるのか不透明 * コンテンツ設計・開発には時間がかかるが理解されていない 受講者の中には、講座の内容は十分に理解できたものの、どのように活用すれば良いのかが分からない方がいました。特にビジュアルデザインから始める制作行程だと、コンテンツは(なぜか)あるものとして進んでいることがあります。実際につかうコンテンツを入れたあとに、細かなデザイン修正が何度も発生してしまうのも、原稿がないまま雑誌の表紙を作るような行程が原因ということがあります

Webデザイン

今のデザインに必要とされるコントロール

本当にコントロールできないのか WD101シリーズ [http://www.yasuhisa.com/could/tag/wd101/]の最初に、Webデザインは見た目のコントロールができない [http://www.yasuhisa.com/could/article/wd101-nocontrol-in/] という話をしました。スクリーンの大きさが多種多様なだけでなく、利用者が見た目や操作性を自由に変えることができる Web。DTPのような感覚でサイトをデザインしても、誰かの Web アクセスの利便性を損なうと指摘しました。 デザイナーはある種、混沌とした状態から秩序を生み出す能力をもっていると思います。バラバラになった情報を整理して一貫性のあるメッセージを伝えたり、混雑した Web の世界に明確な道筋を示す仕事をしています。秩序を作り出すということは、ある程度のコントロールはなくてはならないわけです。 コントロールすることがデザイナーの仕事であるとすれば、『コントロールができない Web』との相性がよくないように見えますし、デザイナーにとって非常に仕事が難しい環境のように

デザイン

道具の選び方、関わり方を考えるためのヒント

間違ったツールの選び方 ペーパープロトタイプは、紙に書き込むというアナログなアプローチであることから、作るための敷居が低いだけでなく、アウトプットも早く改善がしやすいです。メリットが多いペーパープロトタイプですが、 時間の無駄 [http://www.gv.com/lib/paper-prototyping-is-a-waste-of-time] という意見もあります。紙で作られていることから再現性が低く、的確なフィードバックを利用者から得るには難しいからです。 それでは、ペーパープロトタイプが使えないのかといえば、こたえは「No」になります。こうした「○○は使えるのか?」という疑問は制作の方からよく聞かれる質問ですが、回答に困ることがあります。ペーパープロトタイプだけではありませんが、手法や技術そのもので使えるかどうかの判断はできません。採用する前に以下の 4 点を考慮して選ばないと上手くいかないですし、手法や技術へ責任転換をしてしまう恐れがあります。 誰とつくるのか 誰がその手法を使うことになるのか。自分ひとりだけなのか、それとも組織外の方も関わる可能性があるのか。彼らの背

コンテンツ

シングルカラムから始める情報設計

横並びは複雑化の第一歩 Webサイトの設計をする際、必ずといっていいほど縦にコンテンツを並べて構成を考えるようにしています。どのような人が、何を求めて Web サイトに訪れているのかというシナリオを基に構成を考えていく [http://www.yasuhisa.com/could/article/content-we-need/] わけです。詳細なレイアウトを考えるのではなく、情報の流れが適切であるかどうかを判断するための工程にしています。 パソコン向けの Web サイトデザインの悪い癖 [http://www.yasuhisa.com/could/article/wd101-pc-brain/] のひとつに、「同じくらい重要だったら、横に並べる」というのがあります。広いスペースがあったパソコンが主流の時代ならではのアプローチですが、今は状況が大きく異なります。配信者側にとっての『重要』を出すことは間違っていません。しかし、あれこれ重要だからという理由で隣り合わせにしてしまうと、様々なデメリットが生まれます。 訪問者に迷いが生じる 直接関係のないコンテンツが横に並ぶことで視点の

デザイン

クリエイティブとデータの間にあるもの

危ういバランス Webサイト制作でも、アプリの開発でも、いつも気にしているのがデータとクリエイティブのバランスです。この 2 つの理解が、デザインには不可欠だと考えています。いずれも「重要」と言われていますが、企業の規模や、文化によって重きを置くバランスが異なると思います。 データを重要視する企業成熟したプロダクトやサービスをもつ企業。エンジニア文化が浸透しているところや、営業の力が強いところ。クリエティブを重要視する企業 発展途上のプロダクトやサービスをもつ企業。起業家の文化や、戦略としてのデザインに強く感心があるところ。Google Analytics のようなツールを使えば手軽にデータを解析できるようになりましたし、A/Bテストをするのも難しいことではありません。データから最適だと思われる改善策を提案することができますし、とても説得力のあるように見えます。 講演 [http://www.yasuhisa.com/could/tag/%E8%AC%9B%E6%BC%94/] で「数字はストレートで分かりやすいから、多くの人に理解してもらえる」と話すことがありますが、すべてを数

google

Material Designから学ぶデザインと技術の共通項

Google I/O 2014 [https://www.google.com/events/io] では様々なデバイスが発表されて、ますます Google が日々の生活へ入り込んでいくのだなという印象を受けました。幾つかのプロダクトは興味深かったですが、プロダクトより気になったのが Material Design [http://www.google.com/design/] の発表です。現在 Android L [http://developer.android.com/preview/index.html] と称されている次期バージョン Android で採用されているデザイン言語のガイドラインです。 Skeuomorphism [http://www.yasuhisa.com/could/article/design-issues-2012/] が全面的に使われていたときは、画面上にあるオブジェクトを触っているような感覚を見た目で演出していましたが、Material Design ではアニメーションを通して触れているような感覚を作り出しています。

デザイン

ペルソナ設計に人間像は重要ではない理由

人間像ではなく動機や文脈を明確に プロジェクトを本格始動する前にペルソナを設定することがあります。様々な背景の方がデザインプロセスに参加すると、何をもって『良い』と判断すれば良いのか分からなくなることがあります。ペルソナは、このプロジェクトにおいて適切な『良い』を判断する際に役立ちます。 ペルソナには「人/登場人物」という意味が含まれていることから、表層的な人間像(性別、年齢、出身地など)を描かなければいけないと考えがちです。しかし、それはペルソナを設定することにおいて、それほど重要ではないと思います。私はペルソナを1枚のシートにまとめることがありますが、見た目やライフスタイルといった属性は、詳細まで掘り下げていません。ほとんどの場合 2 〜 3 つくらいのリストにして省略しています。 代わりに「なぜ、人はプロダクトやサービスと触れ合うのか 」という部分を、ペルソナを通して語るように心がけています。その理由は、人口統計学的な属性によって、達成したい目的や道筋が大きく変わることがないからです。 例えば、ある人が アマゾン [http://www.amazon.co.jp/?_e

コンテンツ

データ解析で終わらない提案型分析のコツ

文脈で変わるデータの素顔 効果測定が必須の時代だからこそ、様々なデータをみて検証をする必要がでてきました。アクセス解析で難しいのは、データの切り口や、評価できる数値を見つけることではなく、次のアクションへ繋げることができる提案をすることだと思います。「 脱PVで見えてくるコンテンツの質 [http://www.yasuhisa.com/could/article/no-pageview/] 」という記事で、ページビュー(PV)だけでコンテンツの善し悪しを評価してはいけないという指摘をしました。PV だけでは、サイト訪問者の『質』を判断するのが難しいだけでなく、企業が求めている(ロイアリティの高い)顧客と接点を持てているのかも判断できません。分かりやすいからという理由で PV を評価指標の主軸にしていると、「ページビューを獲得する」という短期的かつ具体性のない目標を立ててしまうことになります。 意味のあるデータを見つけだすヒントは、アクセス解析から導き出された数字の外にあります。コンテンツの評価は、アクセスしている利用者の文脈によって大きく変わるからです。 例えば、中小企業で働く

デザイン

コードが教えてくれるデザイン思考

今プログラミングを教育に取り組もうという声が高まっています。CODE.org [http://code.org]のようなサイトも立ち上がっていますし、 Scratch [http://scratch.mit.edu] のような子供から楽しめるビジュアルプログラミングもあります。 デザイナーの中でもプログラミングを始めたい方もいると思います。WWDC 2014 で発表された Swift [https://developer.apple.com/swift/] は、スクリプト言語のような感覚でコードが書けるので、始めるには良い機会なのかもしれません。 ただ、デザイナーの立場からみると、プログラミングは遠い存在に見えることがあります。しかし、「問題解決のため」という視点からみると、デザインとプログラミングには共通点がたくさんあります。人間中心デザインに基づいた発想にも、実装可能なところまで落とし込んで模索しないと、夢心地なアイデアになることがあります(もちろん自由な発想が必要なときもありますが)。コードを書くひとの考え方を取り入れることで、アイデアを洗練させることができるようになり

デザイン

デザインの会話にあるぶつかり合いのメリット

ぶつかるから良くなる 文脈や話し手の背景により「デザイン」の意味合いが変わることがあります。先月のセミナー [http://www.yasuhisa.com/could/article/how-we-talk-about-design/]では、デザインには 葛藤やぶつかり合いが含まれていると話しました。ぶつかり合いと書くと、負のイメージが先立つかもしれませんが、デザインプロセスにおいて欠かせない要素だと思います。 デザインを語る場において、参加者が考えを述べることがアイデアを検証する(ぶつける)ことになります。『考えを述べる』ということは、自分の考え方がひとつの解になるということを証明しなければいけませんし、そうしなければ聞き手には理解できないことがあります。時には意見の相違がありますが、自然なことですし違いを歓迎するべきです。アイデアを出し合うからこそ見つかる課題もありますし、アイデアがより洗練することもあるからです。 良い会話ができたと思う瞬間は、誰のアイデアか分からないけど、皆が理解して先に進めることができる状態。「○○さんの意見が通った」「リーダーの意見でまとまった」と

デザイン

デザインを決めて進めるために必要なこと

先月は東京 [http://www.creativevillage.ne.jp/PR/seminar123.html]、そして今月は大阪 [http://www.creativevillage.ne.jp/PR/seminar133.html] で、クリーク・アンド・リバー社が主催する Web ディレクター向けのセミナーで登壇しました。私自身、Web ディレクターと名乗っていないので、依頼を受けたときは半信半疑でした。しかし、Web ディレクターをはじめとした「作り出す人」にある共通の話題があると考え、登壇を決めました。 点をどのように線にするか ツールの使い方。マークアップの仕方。コードの管理方法。ペルソナの作り方。コンセプトを固めるためのワークショップの仕方 … などなど。こうした行程の中にある『点(作業)』は、書籍や Web でたくさん見つけることができます。どれも重要ですが、行程全体からみたとき、

コンテンツ

全面リニューアルの幻想と、取り組むときの注意点

リニューアルでは何も変わらない Webサイト制作の仕事で、いつの間にか当たり前になっているのが『リニューアル案件』。2, 3 年おきに見た目の衣替えをしたり、使い勝手の向上のためナビゲーションや情報構造の見直しをします。 テクノロジーだけでなく、Web を取り巻く文化や社会が目まぐるしく変わるので、定期的なリニューアルをして『追いつく』ことは必要なのかもしれません。しかし、ただ見た目を変える、情報構造を変えるといった「作る」「作り直す」ということが目的になることがあります。リニューアルをすれば何かが変わるという淡い期待感が寄せられることがありますが、費用対効果が良くないことがあります。 第一印象はとても重要です。 全面リニューアルを通して見た目がよくなれば、印象は良くなるかもしれません。しかし、デザインを変えたからといって、コンテンツも自動的に良くわけではありません。最初の印象がよくても、訪問者のニーズが満たされていないのであれば、金メッキはすぐに剥がれてしまいます。 また、リニューアルが話題性があるのかというと、それほどではないことがあります。刺激的なグラフィック、先進的な

UI

デバイスと利用シーンへの最適化から学べること

Web サイトデザインでは 2, 3 年くらい前から モバイルファーストでデザインをする [http://www.yasuhisa.com/could/article/responsive-design/] という考え方が浸透し始めていますが、最近アプリでも似たような傾向が見られるようになってきました。先週 Foursquqre が チェックインとショップガイドを分ける [http://techcrunch.com/2014/05/02/foursquare-swarms-over-swarmly/] と発表しました。一方、Facebook は、メッセージアプリを分断 [http://techcrunch.com/2014/04/09/facebook-messenger-or-the-highway/] しようとしています(Google+ は、Hangout を分断してしばらく経ちます)。 デスクトップ版の使い勝手に慣れ親しんでいる方にとっては『改悪』なのかもしれません。しかし、モバイル(又はスマートデバイス)中心で活用している方には、

UX

欲求段階と体験の質

人はなぜ、Web サイトへ訪れるのでしょうか。 なぜ、アプリをダウンロードして使うのでしょうか。 そこには、知識、娯楽、快楽、名声など様々な欲求が根底にあると思います。人が感じる「良い体験」というのは、その欲求と深い関わりがあるはずです。 米国の心理学者アブラハム・マズロー [http://ja.wikipedia.org/wiki/%E3%82%A2%E3%83%96%E3%83%A9%E3%83%8F%E3%83%A0%E3%83%BB%E3%83%9E%E3%82%BA%E3%83%AD%E3%83%

デザイン

デザインの仕事にある成熟と熟練

デザインの意味とは … といった禅問答のような質問をときどき耳にします。語源まで辿って「記号を表す」といった説明をする人もいれば、「設計をする」と応える方もいます。装飾という意味合いをデザインから離す人もいますが、装飾もデザインの一部として捉えることもできます。 デザインの定義は読者ひとりひとりに委ねますが、デザインを学習したい場合「人それぞれだから頑張って」で済ますわけにはいきません。デザインの『入り口』が必要ですし、どこへ向かっていくのかという目的地も必要だと思います。 デザイナーの成熟度は、以下のような UI を見たときの反応で判断することができます。 あるサイトの UI を基にしてつくったスケッチ デザイナーによって、この UI に対するリアクションは異なります。大きく分けると 4 つあります。 見た目を変えたいインプットフィールドの見た目が良くない。タイポグラフィの選択が良くない。色彩を変えたいといった、見た目をデザインしたいという方。 作り方を見直したいどの技術を使えば実装できるのか。何かツールを活用することで、UI を改善できるのか。どのような技法を採用すれば、

コンテンツ

脱PVで見えてくるコンテンツの質

PVが人気を証明しているとはいえない ページビュー(PV)は、とても気持ちいい数値です。自分が作ったコンテンツの反応を分かりやすい数値で示してくれます。また、多くの広告モデルが PV を基に価格が設定されているので、ビジネスに直結している数値といえると思います。しかし、PV が高いから、訪問者が満足しているとは限らないですし、顧客ロイアリティに繋がっていないかもしれません。そこで、ソーシャルメディア … という意見もありますが、そこの評価指標も RT 数、Like 数といった PV と似たような数字に留まっている場合があります。 特にブログのようなメディア配信をしていると、PV 至上主義になりがちです。PV を稼ぐために釣りタイトルを付けたり、手軽なお菓子コンテンツ [http://www.yasuhisa.com/could/article/what-is-reading/] で、人を集めようとしてしまいます。もちろん、それをひとつの『戦略』といってしまえば、そうかもしれません。しかし、それで欲しい読者が獲得できるのかというと、疑問を感じることがあります。 1度訪問するだけの

UI

Webらしいニュース配信UIとは

紙的な情報配信 新聞記事は、印刷されたらそれで終わりです。後の紙面で修正・注釈が入る場合がありますが、記事が世に出た瞬間、そのままのかたちで残ります。また、配信できるタイミングと回数が限られているので(朝・夕、時々号外)、期限までにどれだけ記事の質を高めるかが勝負になることもあると思います。新聞社の Web サイトは、こうした『新聞の性質』を強く残したまま Web コンテンツを配信しているように見えます。 カテゴリやキーワード(タグ)を活用した情報分類をするなど、 Web の特性を活かした手法を取り入れているものの、記事を集めた書庫のような存在です。以前紹介した 公共施設の Web サイト [http://www.yasuhisa.com/could/article/content-webaccessibility/] と似たような状況といえるでしょう。新聞社の Web サイトの記事の特長をみると、記事の形状は、紙の時代とほぼ変わりないことが分かります。 * 配信された記事は、そのままの形で残る * 訂正や追加情報が入る場合はあるが、別記事として配信されることがある * キー

デザイン

デザインにある繋げること、導くこと

行程の先にあるもの コンテンツ [http://www.yasuhisa.com/could/tag/%e3%82%b3%e3%83%b3%e3%83%86%e3%83%b3%e3%83%84/] の仕事ばかりしていると、利用者のことを考えていないように思われてしまうかもしれませんが、そんなことはありません。コンテンツと利用者は切っても切り離せない関係です。以前は 電子書籍としてまとめることができるくらい [http://www.yasuhisa.com/book/exp/] UX のことを書き続けてたわけですから、利用者のことを無視するなんて考えられないわけです。しかし、最近は意図的に取り上げないようにしています。 UX について頻繁に書いていたときからそうですが、「UX デザインを実践したけど、そのあとどうするの? 」という疑問を常に感じていました。プロセスを踏めば、ワイヤーフレームが描けるのかといえば、そうではないことがあります。そのあと、

コンテンツ

なぜ緊急時になるとデザインが崩れるのか

本日話題になった銀行サイトの緊急メッセージ。このように緊急時になるとサイトデザインからかけ離れたコンテンツエリアを貼付けるサイトは少なくありません。 サイト運営は大事業 コンテンツの仕事に携わる海外のプロフェッショナルと情報交換をすることがありますが、最初驚いたことが運営人数が圧倒的に違うところ。日本で、ひとりかふたりの「Web担当者」が運営しているサイトの規模だと、海外(特に欧米)の場合、 10 人前後のチームを抱えていることがあります。10人前後の Web チームが存在するのは、メディア・パブリッシングのようなコンテンツの掲載頻度が高いサイトに限らず、様々なジャンルで同じことがいえます。大企業の Web サイトだとおもっと多くの人を抱えていることがあるそうです。 Web チームの仕事は企業によって異なりますが、共通して以下のようなタスクがあります。 * コンテンツ制作から掲載までのワークフローの調整 * Web へコンテンツを掲載するための最適化(マークアップ含) * 掲載に必要な写真や図などの素材制作 * ガイドラインに合わせてデザインを調整 当然、日本の Web