logmi・ログミー

世界をログする書き起こしメディア

「250個以上のプロトタイプを作った」AbemaTV制作裏にあった、サイバー・藤田社長の“ユーザー目線”

「250個以上のプロトタイプを作った」AbemaTV制作裏にあった、サイバー・藤田社長の“ユーザー目線”

グッドデザイン=いいUXなのか?――近年のグッドデザイン賞では、有形無形問わず、広義のデザインが評価されています。「グッドデザイン=良いUX?なのではないか」という観点から、2016年12月1日にグッドデザイン賞を受賞したプロダクトの裏側や観点を探るイベント「グッドデザイン賞受賞プロダクトのUX開発手法 UX & Service Sketch」が開催されました。本パートでは、「AbemaTV」のクリエイティブ・ディレクター・鬼石広海氏が登壇。2016年11月には1,000万ダウンロードを突破し、快進撃が止まらないAbemaTV。その裏側には、サイバーエージェント・藤田晋氏の徹底したこだわりがありました。

シリーズ
グッドデザイン賞受賞プロダクトのUX開発手法 UX & Service Sketch > AbemaTV立ち上げの泥臭い話
2016年12月1日のログ
スピーカー
株式会社AbemaTV クリエイティブ・ディレクター/デザイナー 鬼石広海 氏

AbemaTVは「インターネットテレビ局」

鬼石広海氏 みなさん、こんにちは。「AbemaTV」の鬼石と申します。AbemaTVの立ち上げからおよそ半年ぐらい経ちました。本日は立ち上げ時期を振り返って、立ち上げの裏側の話をご紹介させていただきたいと思っています。 IMG_4932 「AbemaTV立ち上げの泥臭い話」と書きましたが、スライドを作ってみたところ、それほど泥臭い話にはなっていないんですけれど、みなさんお聞きいただければと思います。よろしくお願いいたします。 f233a274197fe5cd832d4643ea026bc3 簡単に自己紹介させてください。鬼石広海と申します。今、AbemaTVでクリエイティブ・ディレクターとデザイナーを兼任しております。簡単な経歴としては、2006年から2012年にかけてWeb制作会社で、主にWeb制作に携わっていました。デザインとFlashをやっていて、実際にコードも書いていました。 a48f52e76cb9bad25511d9eb9685a0d4 2012年、株式会社サイバーエージェントに転職いたしまして、主にSNSサービスの立ち上げやリニューアルに携わっておりました。職種としては、基本的にはUIデザイナーというところと、あとは複数のサービスのクオリティを担保する、クリエイティブ・ディレクターという立場でやらせていただいていました。 2015年4月に、AbemaTVに出向というかたちでジョインいたしまして、立ち上げのときはデザインから、いろんなことをやっていたんですけれど、現在は僕の下にデザイナーが何名かついていて、クオリティを担保する立場でクリエイティブ・ディレクターをやらせてもらっています。 簡単にAbemaTVのサービスをご紹介させてください。AbemaTVは「インターネットテレビ局」という打ち出しをしています。ニュース、音楽、スポーツ、バラエティ、釣りと、かなりチャンネル数が多いんですけれど、約30チャンネルが主にスマートフォンなどのデバイスで、無料で楽しめるテレビサービスになっています。 AbemaTVはサイバーエージェントとテレビ朝日、この2社で共同運営をしております。主な役割としては、サイバーエージェントはプロダクト開発、それからコンテンツの調達をしています。テレビ朝日さんは主にニュース番組の制作、オリジナルで「AbemaNews」という番組を制作しております。あとは、オリジナルでバラエティも制作しています。 d76be0c493827f702fde4f8a40d322e4 AbemaTV、先日、テレビデバイスのアプリをリリースいたしました。現状はスマホとタブレット、PCブラウザ、あとはテレビデバイスということで、スマートデバイスに関してはすべて網羅している状況になっています。

2016年11月に、1,000万ダウンロードを突破

さっそくストアにアップしたところ、ランキング1位をいただきまして、かなり好調にリリースができたかなと思っておりますので、ぜひみなさんにも使っていただければと思います。本当にテレビと遜色ないというか、むしろテレビよりもチャンネル切り替えがサクサクできて、新しい体験を感じられるんじゃないかなと思っています。 AbemaTVはアプリのダウンロード数が、先日1,000万ダウンロードを突破しました。かなり早いスピードで、ダウンロードが進んでいるんですけれど、目標としましては、マスメディアというところを狙っています。 d7b70bcfb4343fdc21148113456dec5e マスメディアと言いますと、「WAU1,000万」という指標があるんですけれど、ウィークリーのアクティブユーザー、週に1回以上立ち上げるユーザーが1,000万人いる状況を作ると、マスメディアと呼ばれるような影響力を持つサービスになります。 AbemaTVはそこを狙って、現在開発を進めています。最近の主な施策として、例えば現状のテレビサービスですと、『金曜ロードShow!』だったり、朝ドラ、あとは、お昼にやっていた『笑っていいとも!』みたいな視聴習慣がある番組のように、「この曜日のこの時間に、なにをやっているか」ということをユーザーに植えつけて、継続率を上げていく施策をたくさん打っている状況です。 AbemaTVは、ありがたいことにアワードをいろいろ受賞させていただきました。先日、「GOOD DESIGN AWARD」を受賞したり、『DIME』さんのトレンド大賞をいただいたり、あとは「#Twitter Awards」ですね。日本ではサイバーエージェントのみなんですけれど、この賞をいただきました。 3f28581fa673b19ca65007cc9b2e5c72 アプリのレビューとしては、iOSが星の数4.5以上、Androidが4.4以上ということで、ユーザーさんに非常に好評をいただいています。 先日、僕、Wantedlyでブログを書かせていただきました。「グッドデザイン受賞の理由」ということで、書かせていただいたんですけれど、そのなかで、いわゆるアカデミックなUI/UX理論にもとづく設計はやっていないということを書きました。今回はその点を詳しく知りたいということでお声がけいただきました。今日は、その点を交えながらお話したいと思っています。

AbemaTVがグッドデザイン賞を受賞した2つの理由

「グッドデザイン受賞の理由」ということなんですけれど、ポイントは大きく2つあります。1つは、開発者全員がUXデザイナーになるということ。もう1つは、経営者がプロダクトにフルコミットするということ。この2つが非常にポイントになってくるかなと思っています。 37e5e8751b6c32542e70a4dfcfd0c11a まず、1つ目の「開発者全員がUXデザイナーになる」ということなんですけれど、開発を始める際の前提として、非常に難しい点がありました。それはなにかと言いますと、AbemaTVは地上波のテレビと同じように、リニア配信のアプリなんですけれど、昨今、オンデマンドサービス、Netflix、Hulu、YouTubeもそうなんですけど、オンデマンドサービスはたくさん数が出ているかなと思います。 非常に成功事例も多いなかで、AbemaTVはそこを狙わずに、あえてリニア配信アプリを選択してやっているということで、成功事例が今までにないところが非常に難しい。参考になるサービスがないということで、ゼロベースで生み出す必要があります。なんとかこれを成功に導いていくというところが、非常に難しい点でありました。 1c3b9da7cdb10eb064a510816fa8db32 逆に、開発者にとって追い風になるポイントとしては、そもそもサービス自体が非常にシンプルであるということ。地上波のテレビを見てもわかると思うんですけれど、テレビサービス自体は非常にシンプルだと思っています。 dcecb4eab08790dddff950bd6f840ff0 電源をつけたら、すぐに番組を見ることができます。リモコンを見ると、非常にボタンが多くて複雑なUIをしていると思うんです。けれど、基本的に日常使っているボタンは、チャンネル切り替えが主なところになってくると思います。そう考えると、サービス自体は非常にシンプルだというところが、小さいスマートフォンでそれを表現するところにおいて、かなりメリットであると考えました。 もう1つ、開発者にとって自分が利用シーンを非常に想像しやすいというところが、追い風になっていると思っています。基本的に地上波テレビを見たことがない開発者はいないと思いますので、自分が実際にテレビを見るということが想像しやすい。モチベーションも非常に高く開発できるというところが、開発するうえで追い風になった点かなと思っています。 40f12841506a659a879089c54c81be10 この2つ、ゼロベースで作らなきゃいけないというところと、機能が非常にシンプルであるということを踏まえると、卓上の議論でブレストをするよりも、プロトタイプで実際にものを作って、そのプロトタイプをベースにしてブレストしたほうがいいんじゃないかと。

コンテンツを見るまでの距離を最短にしたい

AbemaTVでは、当時、開発者が5人ぐらいいたんですけれど、それぞれ職種は違ってもそれぞれが考えるいいものを、自分たちの使い慣れたツールを使ってプロトタイプを作ろうじゃないかということで進めました。デザイナーだったらAfter EffectsとかFlashとか、エンジニアだったらXcodeとかAndroid Studioというところはあると思うんですけれど、ツールはなんでもよいと。 e186ef0634f9e871fd0ceb4d86c1d8e2 とにかく目的としては、それぞれ自分が本当に使いたいと思える最高のテレビアプリを作ってこよう。そして、それをベースにして議論をしようという話を決めました。日々の開発の夕会というところで進捗を夕方に共有するんですけれど、そこで各々が作ってきたプロトタイプを共有し合って、それをベースにして議論してブラッシュアップしていくということを、ずっと開発当時は繰り返していました。 06147a1fa4df0b2c436219f61adee4b8 プロトタイプの総数なんですけれど、合計で250を超えるぐらいの数を作りました。要は、「もう、考えうるパターンはすべて作った」と言えるぐらいの数を作ったということになります。 そのなかで共通してエンジニア、デザイナーが考えていたことが、やはり会員登録はなしにして、コンテンツまでを最短にするということが重要なんじゃないか。地上波のテレビと同じように、起動したら即番組が始まるというところが一番大事なんじゃないかと。 4ff86e9463e91aa541ee3dd59b7b740a それをやるために問題になるのが、複数デバイス間の情報共有をログインをしない前提で考えなければいけないことで、これをどうしたかというと、ワンタイムパスワードという一時的なパスワードを発行することによって、デバイス間の共有を可能にしました。目的としては、「会員登録をなしにしたい」というところから始まって、エンジニアからの案で、その目的を達成するための方法を考えていったということになります。 もう1つは、両隣のチャンネルの先読みということなんですけれど、AbemaTVは起動したときに流れている番組の両サイドの番組、これを先読みしております。 edb7322a3de0175f55ff0ba307601ae3 こうするとなにがいいかと言いますと、チャンネルをザッピング、切り替えるときにスワイプをするんですけれど、すでに両隣のチャンネルを先読みしているので、切り替えた瞬間にもう次の番組が始まっている状況になるんですね。そうなると、待ち時間なく、サクサクと自分が見たいものを探せて、非常にストレスがなく視聴ができるので、これを実現したいというところがありました。 もう1つ、スワイプ位置と音量・スケール・明度を同期ということなんですけれど、これは、自分が操作している指の動きに対して非常に従順な動きを返してもらうために、細かく指の位置に応じてこれらのステータスを変えていくということをしました。そうすることで、自分の動きに対して従順な動きを返す帰属感というものが生まれます。そういった細かいことの積み重ねで、非常に心地よいインタラクションが実現できたのかなと思っています。 9f23efd6843ac1f86e384dab731bcc98 これらが、開発者の全員がプロトタイプを作って、自分でUI/UXを考えて自分ごと化していくことで生まれました。今、ご紹介したものは、ほとんどがエンジニアからの発案だったりもするんですけれど、「こうしたい」というものに対して、エンジニアが「これをやったら、これは解決できるんじゃないか」ということで、開発者全員が目的に向かって解決方法を考えるということができました。 そういった意味で、全員がUXデザイナーになるということで、さまざまなアプローチで使い勝手を向上することができたことが、まず1つのポイントかなと思っています。

「開発者に嫌われてもいいから、妥協は一切しない」という覚悟

「グッドデザイン受賞の理由」のもう1つのポイントが、「経営者がプロダクトにフルコミットする」ということなんですけれど、先ほど、プロトタイプを250個作ったというお話をしました。では、なぜ250個作ったのかと言いますと、これは弊社の藤田(晋)社長が徹底的に妥協を許さなかったということが一番かなと思っています。 今回のAbemaTVに関しては、藤田が人生をかけたプロジェクトだということで、開発、主にプロダクトのところにはかなり時間をかけてコミットしていました。具体的な藤田とプロダクトの関わり方をご紹介したいと思います。 AbemaTVは毎週、週次で藤田と開発者が実際にコミュニケーションして、進捗共有をして、直接議論を繰り返すということをしていました。そこで藤田は、ユーザー視点でフィードバックをするということを心がけていました。クリエイティブのディレクションをする、解決策を提示するということではなくて、あえてユーザーの視点で、これが最高の品質であるかどうかをジャッジするということをしていました。 なので、藤田が「これではダメだ」と思ったら、きっぱりと「これはダメなので、また別の案を考えてくれ」と。解決案を提示するのではなくて、ジャッジするということをやっていました。藤田も、非常に勇気を持って「開発者に嫌われてもいいから、妥協は一切しない」ということを言っていました。 もう1つは、これは藤田の特徴的なところなんですけれど、説得をすることを非常に嫌います。プレゼンテーションされることを、藤田は非常に嫌うんです。これはなぜかと言うと、僕たちが作っているものはサービスであって、最終的にはユーザーが使うものであるといったときに、サービスを使ってくれるユーザーに対して、プレゼンテーションや説得、説明をすることはできないですよね。 ユーザーが実際にそのサービスを使ってみて、触ってみて、その価値を感じなかったら、もう次には起動してくれないという、かなりシビアな世界なので、藤田を説得をしてもなんの意味もない。そういった意味で、藤田も実際にプロダクトを見て触って判断ということを徹底していました。仕様やデザインに関しても、非常に細かいところまで見ていました。 週次の定例で共有できなかったところ、あとスピードをもって開発していかなければならないところもあるので、そういうところは、FacebookのMessengerとかで直接やりとりをして、非常にスピーディーに決裁をもらって開発を進めていくことができました。

藤田社長がユーザー目線でジャッジ

もう1つは、藤田が開発メンバーの一員になるというところが非常に大きかったかなと思っています。これはなにがいいかと言いますと、AbemaTVは非常にたくさんの人が関わっておりまして、現在ですと、関わっている人数としては300名近くいます。そのなかで各部署、いろんな部署がありますが、やはりそこからいろんな要望がきます。 IMG_4978 例えば、「広告を入れてほしい」「マネタイズを早くしたい」「リンクを入れたい」とか、「この機能がほしい」みたいなことは、非常に多く上がります。それが開発者に直接届いてしまうと、僕たちもお互いの妥協点を見つけなければならない。そこで追加機能してしまうと、どんどん複雑になっていってしまう。それを徹底的に藤田がユーザー目線でジャッジし、必要のないものは排除することで、シンプルさを保つということを非常に重視しておりました。 シンプルさを保たないと、やはり地上波のテレビのリモコンみたいになってしまう。非常にボタンがたくさんあって、結局はチャンネル切り替えしか使わないんだけど、複雑なUIになってリリースされてしまうということが一番良くないと。そういった点で、徹底的に排除するということを決めていました。 藤田も、先日ブログに「権力が最高品質のクリエーティブを生む」ということを書かれていたんですけれど、まさにそのとおりかなと思います。Appleのスティーブ・ジョブズを例にとって話していたんですけれど、これだけの巨大なプロジェクトでたくさんの人員を動かしていて、さらにプロジェクトを率いて突き進んでいくためには、それだけの権力と妥協を許さないということが非常に大事だということを、僕も開発を通して非常に実感しました。 この2つ、開発者がUXデザイナーになるということ。あと、もう1つが、経営者がプロダクトにフルコミットするということ。この2点が、AbemaTVが非常にクオリティの高い品質を保つことができた理由かと思っています。私からは以上になります。ありがとうございました。 (会場拍手)

  
×
×
×
この話をシェアしよう!
シェア ツイート はてブ
「250個以上のプロトタイプを作った」AbemaTV制作裏にあった、サイバー・藤田社長の“ユーザー目線”

編集部のオススメ

無料で求人掲載できる!エン・ジャパンの採用支援ツール、engage(エンゲージ) PR

おすすめログ

人気ログランキング

TOPへ戻る