Return to Video

あなたの(そして何十億人の)ための巨大なウェブデザインの方法

  • 0:01 - 0:04
    「デザイン」という言葉から
    何を思い浮かべますか?
  • 0:04 - 0:07
    こういうモノですか?
  • 0:07 - 0:10
    手に取れる
    お洒落な工芸品だったり
  • 0:10 - 0:13
    ロゴやポスター
    地図など
  • 0:13 - 0:15
    視覚的に訴える
  • 0:15 - 0:18
    流行り廃りのないデザインではないでしょうか
  • 0:18 - 0:21
    でも今日 私がお話ししたいのは
  • 0:21 - 0:22
    そのようなデザインではなく
  • 0:22 - 0:24
    おそらく毎日
    使っているのに
  • 0:24 - 0:26
    あまり考えたことがないモノ
  • 0:26 - 0:28
    デザインがよく変わるのに
  • 0:28 - 0:31
    持ち歩いている物についてです
  • 0:31 - 0:33
    私がお話しするのは
  • 0:33 - 0:35
    デジタル体験のデザイン—
  • 0:35 - 0:37
    特に システムデザインについてです
  • 0:37 - 0:39
    それらはとても大きいので
  • 0:39 - 0:41
    規模を把握しづらいのです
  • 0:41 - 0:43
    例えば Googleは毎日
  • 0:43 - 0:47
    10億件以上の検索を処理しており
  • 0:47 - 0:49
    毎分100時間以上の映像が
  • 0:49 - 0:52
    YouTubeにアップロードされています
  • 0:52 - 0:53
    これはアメリカの大手放送会社3社の
  • 0:53 - 0:56
    過去5年間の放送分を超えた映像が
  • 0:56 - 0:59
    1日でアップロードされている計算です
  • 0:59 - 1:02
    Facebookでは
  • 1:02 - 1:03
    12億3千万人以上の
  • 1:03 - 1:06
    写真やメッセージやストーリーが
    発信されています
  • 1:06 - 1:09
    これはネット人口の約半数で
  • 1:09 - 1:11
    世界の人口の6分の1にあたります
  • 1:11 - 1:12
    私のキャリアを通じて
  • 1:12 - 1:15
    デザインに携わった製品もありますが
  • 1:15 - 1:17
    規模がとても大きいため
  • 1:17 - 1:19
    これまでに無い デザイン上の
  • 1:19 - 1:21
    課題が生じています
  • 1:21 - 1:23
    しかし 規模が大きなデザインの
  • 1:23 - 1:26
    本当に難しい点とは何でしょうか
  • 1:26 - 1:28
    難しい部分は
  • 1:28 - 1:31
    2つの組み合わせで
  • 1:31 - 1:34
    「大胆さ」と「謙虚さ」です
  • 1:34 - 1:37
    大胆さとは 全世界が欲して
    必要とする何かを
  • 1:37 - 1:41
    作っていると信じることです
  • 1:41 - 1:44
    そして 謙虚さとは
    デザイナーとして
  • 1:44 - 1:46
    自分や自分の作品集のためではなく
  • 1:46 - 1:49
    誰かのためにデザインすること
  • 1:49 - 1:51
    また デザインを通じて
    人々の暮らしを
  • 1:51 - 1:52
    いかに良くするかということです
  • 1:52 - 1:55
    残念なことに
    「人類のためのデザイン入門」を
  • 1:55 - 1:59
    教えてくれる学校はありません
  • 1:59 - 2:01
    これらの製品に関与している
  • 2:01 - 2:02
    私や他のデザイナーは
  • 2:02 - 2:06
    模索しながら作品を生み出し
  • 2:06 - 2:07
    切磋琢磨することで
  • 2:07 - 2:09
    規模の大きなデザインの
    ベストプラクティスを
  • 2:09 - 2:11
    見出そうとしています
  • 2:11 - 2:13
    今日は私達が数年かけて
  • 2:13 - 2:15
    学んだことをお話ししたいと思います
  • 2:15 - 2:17
    規模の大きなデザインで
  • 2:17 - 2:18
    まず知っておくべきことは
  • 2:18 - 2:21
    細部が本当に重要だということです
  • 2:21 - 2:23
    これは とても小さなデザインの要素の
  • 2:23 - 2:26
    影響が いかに大きいかを
    示した良い例です
  • 2:26 - 2:29
    Facebookで
    「いいね!」ボタンを
  • 2:29 - 2:31
    管理しているチームは
  • 2:31 - 2:34
    デザインの変更を決めました
  • 2:34 - 2:36
    ボタンは
    私達のブランドの進化と共に
  • 2:36 - 2:38
    まとまりがなくなったので
  • 2:38 - 2:39
    最新のものにする必要があったのです
  • 2:39 - 2:41
    小さなボタンに過ぎない
  • 2:41 - 2:43
    かなり単純で簡単なデザインだと
  • 2:43 - 2:46
    思われるでしょう
    それが違うんです
  • 2:46 - 2:48
    このボタンには
    デザイン上の
  • 2:48 - 2:50
    様々な制約がありました
  • 2:50 - 2:54
    縦横の決まった設定値内で
    作成する必要があるのです
  • 2:54 - 2:56
    多言語で機能するよう
  • 2:56 - 2:58
    気を配る必要もありました
  • 2:58 - 3:01
    また お洒落なグラデーションや
    ボーダーも要注意です
  • 3:01 - 3:03
    昔ながらのウェブブラウザの
  • 3:03 - 3:05
    優雅さを損なうからです
  • 3:05 - 3:07
    ですから この小さなボタンのデザインには
  • 3:07 - 3:10
    大変苦労しました
  • 3:10 - 3:12
    そして これが新しいバージョンです
  • 3:12 - 3:14
    このプロジェクトのデザイナーは
  • 3:14 - 3:18
    280時間以上
    つまり何か月もかけて
  • 3:18 - 3:21
    このボタンのデザイン変更に
    取り組みました
  • 3:21 - 3:24
    なぜ こんなに小さなものに
  • 3:24 - 3:26
    膨大な時間を費やすのでしょうか?
  • 3:26 - 3:28
    規模が大きなデザインを作る場合
  • 3:28 - 3:31
    些細なものなどないからです
  • 3:31 - 3:32
    この他愛のない 小さなボタンが
  • 3:32 - 3:36
    1日に平均して220億回
  • 3:36 - 3:40
    750万以上のウェブサイトで
    閲覧されているのです
  • 3:40 - 3:44
    今までに最もよく見られた
    デザインの1つです
  • 3:44 - 3:46
    小さなボタンにしては
    とてつもない重圧で
  • 3:46 - 3:48
    その裏にはデザイナーがいますが
  • 3:48 - 3:49
    この種のデザインは
  • 3:49 - 3:52
    細部まできちんとする必要があるのです
  • 3:52 - 3:55
    次に理解すべきことは
  • 3:55 - 3:57
    データを伴うデザインの方法です
  • 3:57 - 3:59
    このような製品を作る時は
  • 3:59 - 4:02
    その製品がどのように使われるかという
  • 4:02 - 4:04
    膨大な情報を集めることが
  • 4:04 - 4:05
    デザインを決める際に
  • 4:05 - 4:07
    有用になります
  • 4:07 - 4:10
    でも数に従えばいい
    というものではありません
  • 4:10 - 4:11
    ご理解いただくために
  • 4:11 - 4:13
    例を挙げて説明します
  • 4:13 - 4:15
    Facebookは長い間
  • 4:15 - 4:18
    私達のコミュニティ基準に
    違反する写真—
  • 4:18 - 4:20
    スパムや嫌がらせを
    報告できる
  • 4:20 - 4:23
    ツールを持っています
  • 4:23 - 4:25
    報告を受けた写真は大量にありましたが
  • 4:25 - 4:27
    蓋を開けてみると
  • 4:27 - 4:28
    コミュニティの基準に違反したものは
  • 4:28 - 4:31
    実際は わずかしかありません
  • 4:31 - 4:34
    大半は典型的なパーティーの写真でした
  • 4:34 - 4:37
    ある例を紹介しましょう
  • 4:37 - 4:39
    私の友人のローラが
    —仮にですが—
  • 4:39 - 4:41
    カラオケの飲み会での
  • 4:41 - 4:44
    私の写真をアップロードするとします
  • 4:44 - 4:47
    あくまで例です
    念を押しておきます
  • 4:47 - 4:49
    (笑)
  • 4:49 - 4:50
    ちなみに
  • 4:50 - 4:52
    Facebook上で
  • 4:52 - 4:53
    上司や同僚に
  • 4:53 - 4:55
    自分の恥ずかしい写真を見られることを
  • 4:55 - 4:57
    心配する人もいます
  • 4:57 - 4:59
    Facebookで働いている人間には
  • 4:59 - 5:02
    避けて通れません
  • 5:02 - 5:04
    とにかく 誤って
    スパムや嫌がらせと
  • 5:04 - 5:08
    報告された写真は多いのです
  • 5:08 - 5:10
    チームの技術者の一人には
    先見の明がありました
  • 5:10 - 5:12
    本当にこれから起こることを
  • 5:12 - 5:14
    正しく見通していたのです
  • 5:14 - 5:16
    彼が多くのケースを検証したところ
  • 5:16 - 5:17
    自分が写っている写真を
  • 5:17 - 5:19
    削除してほしいという
  • 5:19 - 5:22
    要望が大半だったのです
  • 5:22 - 5:24
    これはチームが考えたこともない
  • 5:24 - 5:27
    シナリオでした
  • 5:27 - 5:28
    そこで 友人にメッセージを送って
  • 5:28 - 5:31
    写真の削除を依頼するという
  • 5:31 - 5:33
    新しい機能を追加しました
  • 5:33 - 5:34
    でも うまく行きませんでした
  • 5:34 - 5:35
    20%しか友人に
  • 5:35 - 5:38
    メッセージを送らなかったのです
  • 5:38 - 5:40
    そのため チームは
    行き詰ってしまいました
  • 5:40 - 5:43
    そこで 調停の専門家に相談し
  • 5:43 - 5:46
    婉曲表現の普遍原理についても
  • 5:46 - 5:48
    学びました
  • 5:48 - 5:49
    私は婉曲表現というものを
  • 5:49 - 5:51
    この研究が行われるまで
    知りませんでした
  • 5:51 - 5:54
    そして 面白いことを見つけたのです
  • 5:54 - 5:56
    友人に写真の削除依頼をする以上の
    手助けをしたのです
  • 5:56 - 5:58
    友人に写真の削除依頼をする以上の
    手助けをしたのです
  • 5:58 - 6:01
    その写真でどんな気持ちになったかを
  • 6:01 - 6:03
    友人に伝えることにしたのです
  • 6:03 - 6:05
    その経験が今に役立っています
  • 6:05 - 6:08
    例えば私がこの写真を見つけたとします
  • 6:08 - 6:11
    スパムでも嫌がらせでもありません
  • 6:11 - 6:14
    でも 私はFacebookに載せて欲しくありません
  • 6:14 - 6:17
    そこでFacebookに報告するのは
  • 6:17 - 6:19
    「この写真に自分が写っているのが好ましくない」
  • 6:19 - 6:22
    それから更に掘り下げます
  • 6:22 - 6:25
    なぜこの写真が
    好きではないのでしょうか?
  • 6:25 - 6:27
    「恥ずかしいから」を選択します
  • 6:27 - 6:31
    すると 友達にメッセージを送るよう促されます
  • 6:31 - 6:33
    これが大きな違いを生むのです
  • 6:33 - 6:36
    奨励される特定の言葉を選んで
    この写真によって
  • 6:36 - 6:39
    私がどう感じたかを
  • 6:39 - 6:41
    ローラに伝えることができます
  • 6:41 - 6:44
    私のチームは このちょっとした変化の
  • 6:44 - 6:45
    影響力が甚大なことに気づきました
  • 6:45 - 6:48
    以前は20%の人しか
  • 6:48 - 6:49
    メッセージを送らなかったのに
  • 6:49 - 6:51
    今では60%の人が送っています
  • 6:51 - 6:52
    各種の調査によると
  • 6:52 - 6:54
    双方の会話で
    結果的に良くなったと
  • 6:54 - 6:56
    感じていることが分かりました
  • 6:56 - 6:58
    同じ調査で
  • 6:58 - 7:00
    友人の90%が
    どうして怒らせたのか
  • 7:00 - 7:03
    知りたいと思っていることも分かりました
  • 7:03 - 7:05
    残りの10%については分かりませんが
  • 7:05 - 7:07
    「友達解除」機能が
  • 7:07 - 7:08
    役立つかもしれません
  • 7:08 - 7:10
    ご覧の通り
  • 7:10 - 7:13
    これらの決定は非常に微妙なのです
  • 7:13 - 7:15
    もちろん 決定を通知するために
  • 7:15 - 7:16
    沢山のデータを使いますが
  • 7:16 - 7:19
    私達が多いに頼るのは
    反復
  • 7:19 - 7:23
    研究 テスト
    直感 人情などです
  • 7:23 - 7:25
    アートであり
    科学なのです
  • 7:25 - 7:28
    さて このような製品を作るデザイナーを
  • 7:28 - 7:30
    時に「データ駆動型」と呼びます
  • 7:30 - 7:32
    私達を完全に虜にする言葉です
  • 7:32 - 7:35
    私達は自分達のデザインを厳密に
  • 7:35 - 7:38
    テストする責任があります
  • 7:38 - 7:40
    多くの人々から
    きちんとするよう
  • 7:40 - 7:41
    期待されているのですから
  • 7:41 - 7:43
    でもデータ分析は
  • 7:43 - 7:46
    デザインのインスピレーションにはなりません
  • 7:46 - 7:50
    データは良いデザインを
    素晴らしいものにできますが
  • 7:50 - 7:53
    悪いデザインを良くすることは
    できないのです
  • 7:53 - 7:56
    次に原則として
    理解すべきは
  • 7:56 - 7:58
    変更を導入する時で
  • 7:58 - 8:00
    非常に注意を払う必要があります
  • 8:00 - 8:02
    私がよく使う冗談ですが
  • 8:02 - 8:04
    変更自体に掛ける時間と
  • 8:04 - 8:06
    同じくらい
    変更を導入する時の
  • 8:06 - 8:08
    デザインに時間を費やします
  • 8:08 - 8:11
    それは私達がよく使う物が変化し
  • 8:11 - 8:13
    慣れる必要がある時と
  • 8:13 - 8:15
    すべて繋がっているのです
  • 8:15 - 8:17
    実際 私達は悪いデザインを
  • 8:17 - 8:20
    とても効率よく使うことができます
  • 8:20 - 8:23
    長期的には 変更が良いことであっても
  • 8:23 - 8:26
    変更されると 物凄くイライラします
  • 8:26 - 8:28
    ユーザーが内容を作るものなら
  • 8:28 - 8:30
    なおさらです
  • 8:30 - 8:34
    持ち主が自分のものだと
    主張できるからです
  • 8:34 - 8:37
    事実 ユーザーが書いた内容なのですから
  • 8:37 - 8:40
    何年も前 YouTubeで働いていた時
  • 8:40 - 8:42
    もっと多くの人に
    ビデオを評価してもらう
  • 8:42 - 8:44
    方法を模索していました
  • 8:44 - 8:47
    データを見て面白いと感じたことは
  • 8:47 - 8:50
    大半の人が
    最高の5つ星評価だけを使い
  • 8:50 - 8:52
    大半の人が
    最高の5つ星評価だけを使い
  • 8:52 - 8:54
    一握りの人が
  • 8:54 - 8:56
    最低の1つ星評価をしたのです
  • 8:56 - 8:57
    そして 実際
    誰一人として
  • 8:57 - 8:59
    2つ星、3つ星、4つ星を
    使いませんでした"
  • 8:59 - 9:01
    そこで デザインを単純化し
  • 9:01 - 9:05
    良いか悪いかの2つで
    投票するようにしました
  • 9:05 - 9:08
    誰でも参加できるよう
    単純になりましたが
  • 9:08 - 9:10
    ユーザーは5つ星評価の方に
  • 9:10 - 9:12
    馴染みがありました
  • 9:12 - 9:14
    ビデオ製作者は
    評価されるのが大好きでした
  • 9:14 - 9:16
    何百万人もの人が
  • 9:16 - 9:18
    従来のデザインに馴染んでいました
  • 9:18 - 9:20
    そのため ユーザーに
  • 9:20 - 9:21
    変化に適応し もっと早く
  • 9:21 - 9:24
    新しいデザインに慣れてもらうため
  • 9:24 - 9:26
    データやグラフを
  • 9:26 - 9:28
    コミュニティと共有しながら
  • 9:28 - 9:30
    何をしようとしているのかを
    説明しました
  • 9:30 - 9:33
    この会話を通じて
    大きな業界と関わることができ
  • 9:33 - 9:34
    結果的に 私の一番お気に入りの
  • 9:34 - 9:37
    TechCrunchの見出しになりました
  • 9:37 - 9:41
    「YouTubeが5つ星評価について
    下した評価は—
  • 9:41 - 9:44
    『役立たず』だった」
  • 9:44 - 9:46
    さて 多くの人々が使う製品のデザインを
  • 9:46 - 9:49
    変更する時
    それに伴う反感から
  • 9:49 - 9:51
    完全に逃れることはできません
  • 9:51 - 9:53
    どんなに正しいことをしたくても
  • 9:53 - 9:55
    お決まりのビデオ抗議や
  • 9:55 - 9:57
    怒りのメール
    セキュリティチェックが必要な
  • 9:57 - 10:02
    小包さえ
    大量に送られて来ます
  • 10:02 - 10:04
    私達が覚えておくべきは
    ユーザーが
  • 10:04 - 10:06
    この手の変更に
    非常に繊細だということです
  • 10:06 - 10:09
    なぜなら これらの製品が
    この作品が—
  • 10:09 - 10:12
    彼らにとって 非常に大切だからです
  • 10:12 - 10:15
    さて デザインの細部にわたって
    気を配る必要があることを
  • 10:15 - 10:17
    ご理解いただけたと思います
  • 10:17 - 10:19
    デザインする過程で
    どのようにデータを使うのかを
  • 10:19 - 10:21
    認識しなければなりません
  • 10:21 - 10:23
    そして 非常に注意深く
  • 10:23 - 10:25
    変更を導入しなければいけません
  • 10:25 - 10:27
    これらは すべて役に立つのです
  • 10:27 - 10:30
    規模の大きなデザインをするには
    うってつけの手法です
  • 10:30 - 10:32
    ただし より基本的なものを
  • 10:32 - 10:33
    理解していなければ
  • 10:33 - 10:35
    何の意味もありません
  • 10:35 - 10:40
    誰のためにデザインするのかを
    理解しなければなりません
  • 10:40 - 10:41
    全人類のために
  • 10:41 - 10:43
    デザインする目標を立てたなら
  • 10:43 - 10:46
    真剣にその目標に向かって
    努力し始めると
  • 10:46 - 10:49
    ある時点で
    現実の壁に
  • 10:49 - 10:51
    突き当たります
  • 10:51 - 10:53
    例えば サンフランシスコで
    携帯が圏外になった時
  • 10:53 - 10:55
    私達は少々苛立ってしまいます
  • 10:55 - 10:57
    携帯のナビで
    新しくできた
  • 10:57 - 10:59
    お洒落なコーヒーショップに
    行けないからです
  • 10:59 - 11:02
    でも 安定した電気がないので
  • 11:02 - 11:04
    携帯を充電するために
  • 11:04 - 11:07
    4時間運転する必要があれば
    どうでしょうか?
  • 11:07 - 11:10
    公共図書館へのアクセスがなかったら?
  • 11:10 - 11:13
    皆さんの国で報道の自由がなかったら?
  • 11:13 - 11:17
    これらの製品はどんな意味を
    持ち始めるのでしょうか?
  • 11:17 - 11:20
    これが 世界の大半の人達が見る
    Google
  • 11:20 - 11:21
    YouTube Facebookです
  • 11:21 - 11:22
    そして ネットを始める
  • 11:22 - 11:24
    次なる50億人の大半が
  • 11:24 - 11:26
    それを見ることになるのです
  • 11:26 - 11:28
    低価格の携帯のデザインは
  • 11:28 - 11:31
    魅力的なデザインの仕事では
    ありませんが
  • 11:31 - 11:33
    全世界のためにデザインしたいなら
  • 11:33 - 11:35
    自分がいる所ではなく
    人々がいる所のために
  • 11:35 - 11:36
    デザインをしなければなりません
  • 11:36 - 11:40
    この巨大な構想を
    どうやって心に留めて置きますか?
  • 11:40 - 11:43
    私達がデザインするための人々を
    見たり 聞いたり
  • 11:43 - 11:45
    理解するために
    外に飛び出すことです
  • 11:45 - 11:48
    私達の製品が
    これまでと同じように機能するよう
  • 11:48 - 11:50
    非英語圏にも対応させます
  • 11:50 - 11:53
    彼らの現実を把握するため
  • 11:53 - 11:56
    時には携帯電話で連絡を取ります
  • 11:56 - 12:00
    地球規模でデザインする意義は
    何でしょうか?
  • 12:00 - 12:04
    製品を改善・発展させることは
    難しく
  • 12:04 - 12:08
    時として腹立たしい仕事です
  • 12:08 - 12:11
    そこに「大胆さ」と「謙虚さ」を
    求めることは
  • 12:11 - 12:12
    かなり骨が折れるでしょう
  • 12:12 - 12:14
    謙虚さの部分では
  • 12:14 - 12:16
    デザインする際のエゴが
    少し厄介です
  • 12:16 - 12:18
    なぜなら これらの製品は
    常に変化し
  • 12:18 - 12:21
    私のキャリアにおいて
    デザインしたモノすべてが
  • 12:21 - 12:22
    瞬く間に無くなり
  • 12:22 - 12:25
    これからデザインするモノのすべてが
    いずれは廃れていくからです
  • 12:25 - 12:27
    しかし 残るものもあります
  • 12:27 - 12:29
    自分でも理解できないほどに
  • 12:29 - 12:32
    大きな何かの
    一部になれるという
  • 12:32 - 12:35
    終わりなき感動や
  • 12:35 - 12:38
    世界を変えることができるという
    望みです
  • 12:38 - 12:40
    ありがとうございました
  • 12:40 - 12:43
    (拍手)
Title:
あなたの(そして何十億人の)ための巨大なウェブデザインの方法
Speaker:
マーガレット・グールド・スチュワート
Description:

Facebookの「いいね!」や「シェア」ボタンは1日220億回使われ、これまで作られたデザインの中で最もよく閲覧されています。Facebookのプロダクトデザインのディレクター、マーガレット・グールド・スチュワートが大規模なデザインのための3つの法則を説明します。規模があまりに大きいので、わずかな変更が世界規模の反感を買ってしまう反面、規模があまりに大きいからこそ、わずかな改良で多くの人々にポジティブな影響を与えることができます。

more » « less
Video Language:
English
Team:
closed TED
Project:
TEDTalks
Duration:
13:00

Japanese subtitles

Revisions Compare revisions