WEBサイトに魅力的な動画を載せる〜「Cyta.jp」の事例紹介

動画は短く、テンポよく、そして字幕付き!

主に音楽関連のマンツーマンレッスンの仲介を行っている「Cyta.jp」というサイトが、魅力的なサービス紹介動画を作っていたのでご紹介します。
以下の動画は、体験レッスンの様子をダイジェスト版で紹介しているムービーです。

http://cyta.jp/movie/
体験レッスンムービー | サイタ


いかがでしたか?
思わず最後まで観てしまった人、音楽レッスンをうけてみたいと思った人が多いのではないでしょうか。これが魅力的な理由は以下の3つだと考えます。

  • 動画の長さが短い
  • シーンが切り替わるテンポが良く、飽きない
  • 字幕が効果的に使われている

特に字幕の使い方が絶妙ですよね!体験レッスンの様子からユーザが感じ取りたいであろう「レッスン現場の雰囲気」「講師の人柄」などがストレートに伝わってきて気持ちいいです。
音声を消しているユーザにとってもうれしい配慮ですので、アクセシビリティの観点から評価してもかなり出来がいいですよね。


余談ですが、ゲームセンターのドラムマニア以来楽器に近しいものに触れてすらいない私も、この動画でちょっとやってみたくなりました…。
WEBサイトに動画を載せたい方はぜひ参考にしてみてください!

beBitを卒業して独立しました

独立のご挨拶

このブログを更新するのも久しぶりになりますね。
ご報告が遅れましたが、5月いっぱいをもって私は前職beBitを卒業し、独立いたしました。


東京ドームを窓から望める古いビルに事務所を構え、一人でいそいそとサイト作りをしています。現在は個人事業主という肩書になりますが、タイミングを見て法人化も考えています。

Web関連のご相談も受け付けていますので、なにかありましたら気軽にご連絡ください。前職に不義理とならない範囲で、という形にはなりますが、基本無償でお役に立ちたいと思っています。
今後ともどうぞよろしくお願いいたします。


連絡先はこちら:pangea1204@gmail.com

WEBサイトがファッショナブルであることのリスク

WEBサイトは鑑賞するものではなく使うもの

ここ何年かで、デザインに凝ったWEBサイトが多くなったと感じます。特に海外サイトでは質感を紙や木のように変化させたサイトや、Flashでストーリーをなぞる様なサイトが多々見られます。
私自身、そういったサイトを鑑賞するにあたって「へぇ、おもしろいなぁ。きれいだなぁ。」と思うことはしばしばあります。

しかしながら、いざそのサイトを使えるかと言われると、正直ストレスとの戦いです。どこを押せるのか、どこを読めば良いのか、PCモニタに罵声を浴びせながら最終的には「まぁいいや」と離脱してしまいます。
そしてやはり、WEBサイトの多くは使うために訪れるものです。サイト自体を鑑賞するために訪れるユーザは少ないのではないでしょうか。(サイトにある文章や動画を鑑賞するユーザはいても、その鑑賞対象はサイト自体ではないはずです)

私の感覚で言えば、ファッショナブルなサイトであればあるほど正直「使えない」ことが多いです。もちろんそのデザインに楽しさを覚えるあまり、「使う意欲が増す」ケースもあります。されど、趣味に合わないデザインであればファッショナブルであるが故の「使えなさ」がより印象に残る形となり、結果本当にイライラします。

私はこれを「WEBサイトがファッショナブルであるが故のリスク」と捉えています。
今日はこれについて思うことをつらつらと…。

ファッショナブルなWEBサイトとは

ファッショナブルなWEBサイトというものは、以下3点で定義しています。

    • サイトの見た目が先進的かつおしゃれである。
    • 上記のようなサイトの見た目を達成するために各要素の配置、大きさ、質感を定義している。
    • その結果サイトを一つの美的作品として表現しようとしている。

これは私の勝手な定義であるため、この内容に異論のある方がいるかもしれませんが、一旦今回の対象サイトは以上のような条件に当てはまるものとします。

さて、とはいえ文章で定義したところで具体物がなければイメージもし難いと思います。私がファッショナブルなサイトだと思ったサイト例を以下に2つ紹介します。(海外モノは英語がわからない人に正確に評価していただけない可能性があるため、勇気を出して日本のサイトを選びました。)

  • 事例1:隙間広告社 SKIMA


会社のイメージをそのまま世界観にしてサイトを作っていますね。この雰囲気が好きな人にはたまらなく面白いサイトですし、どこを押したらどうなるのかワクワクしながら利用できるかと思います。
しかし、この会社の名刺をもらって「サイトで会社概要を確認してみよう」と訪問したユーザにとって、この世界観が好みでない場合は「目的が達成できない使えない(その上、好みでもない)サイト」と酷評されてしまう可能性が高いでしょう。
>>隙間広告社 SKIMA


こちらはiPhoneメタルギアソリッドの紹介サイトでしょうか。デザインも世界観も面白いのですが、やはりそのために生じているわかりにくさ、操作の難解さを打ち消すほどにこの作品を好きでない限りは多少イライラしてしまうでしょう。
もちろんそういったコアユーザのみを相手にしている、という話なら言うことはないのですが。
>>METAL GEAR SOLID TOUCH


つまり、上記のようにファッショナブルなサイトは、ユーザにとって「特別気に入られる」か「使いにくくてイライラする」かを「ユーザの趣向性との親和性」に依存しすぎているケースが多いように感じられます。
もちろんその世界観を気に入ってくれるユーザにとっては、印象に残りやすいおもしろいインターフェースや質感によってプラスの影響も大きくなるでしょう。
しかし、おもしろくて斬新な世界観であればあるほど、それを気に入ってくれるユーザのセグメントも狭まってしまうのではないでしょうか。そして「該当サイトの世界観を気に入ってくれるセグメント」は「該当サービス・商品・会社を気に入ってくれるセグメント」と必ずしもイコールではないと思います。

対象となるサービス・商品・会社を気に入ってくれるであろうユーザに最大限アプローチできること、使ってもらえることが目的であるならば、ファッショナブルなサイトを作ることは大きなリスクを抱えていると言わざるを得ません。
それでいてそのリスクを代償に得られるメリットは「ファンをもっとファンにする」といったユーザからの深い支持を得られるといった点でしょうか。
ファッショナブルなサイト制作を検討する際には、上記のようなリスクとメリットを理解しておく必要がありそうです。

目的を考えて方針を検討しよう

一部の親和性の高いユーザのファン化を一層推し進めたい場合、ファッショナブルなサイトはありということでしょうか。事例のうち、コナミのサイトについてはこの方針にあてはまる戦略的サイトであると言えるかもしれませんね。
しかし隙間広告社のケースは、サービスのターゲットユーザを一部取り逃してしまっているのではないか、と不安を感じずにはいられません。(仕事相手を選べるほどに依頼者が殺到しているなら別ですが)

ある程度のマスユーザを相手にサービスを考えているなら、無難に「すっきりとした使いやすいサイト」を制作するほうが成果を生むのだろうな、と私は思います。

Web上でリズム良くサービス説明を行うためのUI事例

わかりやすくサービスを説明したい

複雑なサービスをWebサイトの1ページで説明するのは大変ですよね。かといってページを遷移させると離脱が増えてしまう・・・。
そんなもやもやを動的なUIで解決出来ているサイトを2つ紹介します。

事例1:Shelfari!のトップページ


トップページ上でオレンジのボタンを押すだけで、小気味良く次々とサービス説明が表示されます。
ページ遷移なしに、限られたスペースでサービス説明が出来ていますよね。この形式で見せられると複雑なサービスもなぜか簡単に感じられます。

サービス説明が表示されるリズムが良くて気持ちがいいな、と思いました。
>>Shelfari!

事例2:三幸エステート株式会社の物件サーチ


これも限られたスペースの中で複雑なサービスを比較的わかりやすく説明できている例です。上手にSTEP分けがされているため、何をして良いか迷うことなく物件を検索できます。

こちらが何をすべきか感覚的にわかるため、特別な説明なしにリズム良くサービスを利用できますね。
>>三幸エステート株式会社

リズムをつくる

ユーザに気持ちよくサービスを理解・利用してもらう上で必要な要素のひとつに「リズム」があると思います。無駄に動的なUIはユーザのリズムを狂わせるだけですが、逆にユーザを気持ちよくさせるリズムを生み出す動的なUIも存在します。
そのような動的なUIを実現するためのポイントを整理してみました。。

    • 動作契機がユーザに委ねられている
    • 次にとるべきアクションが明確
    • 立ち位置がブレない(ページ遷移やスクロールが不要)

音楽を聴いているときに気持ちよくリズムに乗れている自分を思い浮かべてみてください。Web上でも同じ環境を作ってあげれば良いのです。
自分が好きなときに音楽をスタートでき、次にどんな音がやってくるかを把握できる状況。それでいて、足場がしっかりしてリラックスができる状況。そういった状況さえ用意してあげれば、多少複雑なサービスだったとしてもユーザに気持ちよく理解・利用してもらえるのだと上記の事例から学びました。

シュレーディンガーの猫に見る“観測者”のパワー

はじめに

最近「ねこ耳少女の量子論」を読みました。いや、決してふざけた本ではないです。なんとねこ耳少女が量子論について熱く且つわかりやすく語ってくれる、量子論入門書としてはすばらしい本でした。おすすめです。
さて、この本の中でシュレーディンガーの猫”という有名なたとえ話が出てきます。
簡単に言うと、

    • 前提として量子の状態は観測してみないとわからないとする(量子の不確定性)
    • 箱の中に放射性物質と猫を入れる
    • 放射性物質が崩壊すると猫は死んでしまう
    • 放射性物質が崩壊するかどうかは事前に分からない(量子の不確定性により)
    • よって箱を開けてみないと猫の生死はわからない
    • つまり箱を開けるまで、猫は半分死んで半分生きていることになる

という話です。これによってシュレーディンガーって人が「量子の状態が確率で解釈されるなんてバカげてる!」という話を伝えたかったらしいのですが、私の注目したい点はこの事例における“観測者の影響力”です。
今日はこれについて少し思うところを整理してみたいと思います。

Webサービスのユーザを観察する

Webサービスでは特にですが、実際に行動を起こしているユーザを捉まえて「なぜあなたは今この商品を買ったのですか?」と問うことは非常に難しいです。
店舗なら、商品片手にレジ前に並ぶ人の肩をたたき、「すいませんが…」と数分時間をもらえば済むことですが、Webサービスの場合ユーザはどことも知らないモニタの前に座っています。苦肉の策としてアンケートやインタビューを実施しても、結局行動を起こした時のことを完全に覚えているわけでもないですし、所詮その場の意見に留まってしまいます。

そこでアクセスログ解析の出番です。ユーザがサイト上でどのように行動していたかを実際のデータを見ながら分析し、このユーザはこう思ってここをクリックしたに違いない、などと推測します。しかし、これもやはりデータを見て推測するに留まるため、ユーザが本当に考えていたこと、やりたかったことがはっきりとわかるわけではありません。

ユーザ像は観察者が作る

そんなこんなでユーザビリティテストという手法(その場でサイトを利用してもらい、行動を観察する手法)が重宝されます。私も既に数える気が起こらないほどの人数を相手に調査を実施してきました。
しかし、やはりいつも解せないのが「横に私がいることや、私がしゃべる言葉一つ一つがこのユーザに大きな影響を与えて結果を曇らせてはいないだろうか」という点です。
シュレディンガーの猫の話に触れたことでより思いを強くしたのですが、Webにおいては「結果を解釈する観測者(観察者)が力を持ちすぎているな」と思うのです。


つい最近ハックルベリーさんが「なんではてな運営側は自分に話を聞きに来ないのか」とおっしゃっていましたが、おそらくその話も“観測者(観察者)の影響力”で説明できます。
ハックルベリーさんがたくさんのはてなブックマークはてなスターを稼いできたことは事実ですが、その間ハックルベリーさんがおこなったユーザ観察は「ハックルベリーさんのユーザ観察結果」と解釈されてしまう可能性が高いと思われます。
一方はてな運営側も、もちろんアクセスログ解析やユーザビリティテストでユーザ観察を行っているはずです。はてな運営側としては、その結果を「はてなのユーザ観察結果」として今後活用していきたいでしょう。

これは私の意見ですが、Webサービスの評価やユーザ像は誰が観測(観察)したかによって多少なりとも変化すると考えています。多くのサービス運営側も私と同様のことを考えていると仮定するなら、どうせバイアスがかかるなら管理できる身内のバイアスに留めたいと考えるのではないでしょうか。
はてな運営側の方々がハックルベリーさんの話を聞きにこない理由がこれだとは言い切れませんが、もし私がはてな運営側にいたとしたなら、あまり知りもしない他人の解釈に意味を持たせて活用することよりも、今まで自分たちが行ってきた観察結果の活用を優先するだろうなと思います。
※とはいえ、ハックルベリーさんにあいさつや友好的なインタビューを実施することは、サービスの一環として大きな価値があると思うので、私的にも現状には疑問がありますが。
【追記】後日、はてなの副社長川崎さんが会いに行かれたようで、私としても安心しました。


シュレーディンガーの猫からいつのまにかハックルベリーさんの話になってしまいましたが、言いたかったことは単純で、「Webサービスにおいては観察者がユーザ像に大きな影響を及ぼしてしまっているなぁ」ということです。

今後どうすればいい?

それなら今後どうなっていくべきなのでしょうか。私は今のままで良いかなと考えています。
バイアスというのは傾向がありますから、サービス運営側でバイアスを認識し、管理している以上、ある段階でそのバイアスを調整する方法が導出されます。
私の仕事場でもそのような方法論が存在しますし、それのおかげで徐々にバイアスによる結果の振れ幅は小さくなっています。

シュレーディンガーが猫をたとえに使って伝えたかったことも、「観測するまで存在自体が不安定になるような事例があってはおかしいだろ!もっと量子論はしっかりしたものであるべきだろ!」というお話のようです。結局観測者が量子の状態を決めてしまうほどの力を持ってしまうような話は科学者として受け入れられなかったのでしょう。

Webサービスにおいても、実際に存在するユーザのユーザ像を観察者が勝手に解釈してしまってはまずいと思うので、調査時に存在する小さなバイアスを今後徐々に無くしていきたいな、と思います。
結局観察者の力なんて適切な方程式に数字を放り込む程度がちょうど良いんですよね。


参考リンク
>>ねこ耳少女の量子論
>>シュレーディンガーの猫wiki
>>ハックルベリーに会いに行く(ハックルベリーさんのブログ)

おわりに

最近仕事が忙しかったことや、新しい分野の勉強を始めたこともあってブログ更新をお休みしていました。申し訳ないです。少し余裕も出てきたので、週2くらいのペースでゆるく再開したいと思います。お付き合いいただける方はどうぞよろしくお願いします。
また、これを機に文体やレイアウト、文言ルールなどを今日以降のエントリから少し改善しようと思います。過去のものは手を入れたくないのでそのままですが。
もし見難い部分や気になる点がありましたら、是非コメントにてお知らせ下さい。すぐに検討したいと思います。

「ネットで手軽に購入予約」⇒「キャンセル率増加」への対応法とは

■きっかけ

つい先日、人気アニメ「けいおん!」OP/ED曲CDのAmazon予約数が大幅に減少するといった事件があった。この出来事を受けてニコニコ市場で怒りのコメントがちらほら。

「遊びで予約すんなよ!1000枚以上キャンセルって何だよ!」
「ノリでの予約はやめようぜ」

……などなど。

実はこの事件、本当の原因は大量キャンセルではなく、Amazonにおける「人気商品は1人1商品まで制限」が発動しただけとのことらしい。

アマゾンでは人気商品の場合、1人、1商品という制限があり、それにより半減されたのではないかと見られているようだ。
「けいおん!」人気やばい アマゾン全てのCDランキングで1位2位独占 …

ということはニコニコで怒りのコメントの矛先となっていた「予約キャンセルした人」はいなかったということか。いや、ニコニコ動画の「けいおん!」関連動画を観てノリで予約したは良いが、後々冷静になってキャンセルしました、ってな人も少なからずいるような…。もしいるとして、対策は必要なのか。どんな対策が必要なのか。
良い機会なので、今までなんとなく抱えていたある疑問について向き合ってみようと思う。

「ネットで手軽に購入予約」⇒「キャンセル率増加」という現象にどう対応すべきなのか?

■基本ガチ攻め

いろいろ考えた結果、基本は「ガチ攻め」が良いと思う。

「ガチ攻め」とは、予約フローでキャンセルに関する告知はせず、キャンセル時のペナルティも課さないといった対処法である。
その場の勢いで予約をするユーザを邪魔する要素は最大限排除し、「どうぞノリでもなんでも予約してくださいな」と道をあける。勢いで予約したユーザの多くは、金銭的に大きな問題が生じない限りいちいちキャンセル手続きを行ったりしないだろう。
そして数少ないキャンセル実行ユーザのために対応コストを割くのも馬鹿らしいので、クレームが発生しないようにキャンセルペナルティは設けない

■キャンセルされない工夫

「ガチ攻め」だけではひねりがないので、キャンセルを防止するTipsをいくつか。

    • キャンセル導線は商品画像や内容詳細を確認できるページに配置する

   ⇒「あ〜……やっぱりこれいいわぁ」と思わせる最後のチャンス

    • リマインドは最小限に

   ⇒予約後に商品について検討する機会を無駄に与えない

    • 思い切って「キャンセル」という文言を「あきらめる」「お別れする」などに変えてみる

   ⇒すいません。半分ネタ。

■その他

その他諸々の事情には以下のように対応すべきと考える。

    • キャンセルペナルティを外すと個人の大量予約による攻撃があるのでは?

   ⇒Amazonのように一人当たりの複数予約制限で対処

    • 在庫が限られている時はどうなの?

   ⇒これも一人当たりの複数予約制限で対応

    • コンプラや法的な問題でキャンセルに関する告知を非表示には出来ない場合もあるよ?

   ⇒告知要素を出来るだけ殺す画面設計をする

まだまだ細かい粗はあるが、あとは商材にあわせてケースバイケースで対応していくしかないだろう。大枠は上記の方針で問題ないのではないか。

■つまり

けいおん!のCD予約騒動に見られるように、Amazonでは「ガチ攻め」方針がとられている。「ノリで予約すんなよ!」などといった批判はニコニコユーザにおまかせして、ビジネス側ではAmazonのような「ガチ攻め」体制でユーザを迎えてあげればよいと思う。
特にCDのような単価の低い商材は予約数表示が更なる予約を刺激する効果も持っている。どんどん予約させてしまえばいいのだ。
あ、ちなみに今回の話は購入予約に限った話。セミナーや結婚式場下見といった体験予約は別の対応が必要なので注意して欲しい。これについても機会があれば言及してみたい。

「クリックさせること」が行き過ぎるとユーザをもてなせなくなる

■目的が違う


C-team
C-teamを考案したリクルートさんは、バナーの目的を「とにかくクリックさせること」と考えているのだろう。
エンタメサイトやメディアサイトでは、広告枠を主な収入源としているためにUU数が価値を持つ。このようなサイトでは「とにかくクリックさせること」を主目的としてバナーを選定することがお金を生むといってよい。この場合C-teamを使ったアプローチは正解といえるのかもしれない。

しかしながらこの世には、エンタメサイトやメディアサイト以外にもサイトは存在する。
例えばEC系や会員登録系のサイト。この場合、運用者はバナーの目的を「最終的にコンバージョンさせること」と捉えるだろう。つまり、サイトを訪れてくれるだけではなく「最終的に商品を買ってくれること」「会員登録をしてくれること」を期待してバナーを選定する。
もしあなたがAという会員登録系サイトを運用していたとして、ともに10万円で手に入るバナーなら以下のどちらのバナークリエイティブがほしいか考えてほしい。

■バナー1:月間10,000人がクリックしてくれたが、そこからサイトを訪れた人の中で会員登録をしてくれたのは100人だけ。
■バナー2:月間5,000人しかクリックしてくれなかったが、そこからサイトを訪れた人の中で会員登録をしてくれたのは200人。

どうだろう?10万円を払うべきバナーは明らかに後者のはずだ。なぜなら最終的なコンバージョン数が後者のほうが多いから。

C-teamを有効に活用できるサイトもあれば、全く無価値と捉えるサイトもある。
目的が違うのだ。
盲目的に「C-teamすげー」と思っている人は是非立ち止まって冷静になってほしいと思う。

■とは言ったものの

実は私の主張は上記に留まらない。
私は、広告枠を主な収入源としているエンタメサイトやメディアサイトだろうと「バナーはユーザをもてなすための一パーツでしかない」と考えている。そして「とにかくクリックさせること」を目的としてバナーを作ることはほぼ99%悪だと考えている。ビジネス的にもユーザ的にもだ。

理由は以下2点。

    1. ユーザをもてなす気持ちが薄れ、ターゲットユーザにとって居心地が悪いサイトとなる
    2. サイトに集るユーザの特徴が薄れてしまうために広告枠としての価値も薄まる

続けて詳細を説明したい。

■ユーザをもてなす気持ちが薄れる

「とにかくクリックさせること」を考えてバナーを選ぶと、ユーザをもてなす気持ちが薄まってしまう。
例えば集合住宅を考えてほしい。
住んでもらう人を適切な基準で選定していれば良い環境の集合住宅が出来るかもしれないが、「とにかく誰でもいいから住ませてしまえ!」とだれかれかまわず入居させれば、集合住宅としての価値も下がるし、住んでいる人たちも気持ちよく暮らせなくなってしまう。


さて、サイトに置き換えてみよう。
ビジネスユーザが集うサイトに高校生ユーザは集ってほしくないし、アニメ好きの集うサイトに冷やかし半分のユーザなど邪魔でしかない。新たに訪れるユーザにとっても、自分が歓迎されていないサイトにわざわざ誘導されたときのイライラといったらない。
Youtubeのようなサイトを期待して訪れた40代主婦が、アニメ色満載のニコニコ動画を目にした場合、気分を害してブラウザを閉じるだろう。(私はニコニコ動画大好きだが)

■広告枠の価値も薄まる

年収が高めなビジネスマンが集うNIKKEI NETの広告枠は、高校生やフリーターが集うサイトになった瞬間多くの広告主から見放されるだろう。年配が集う趣味人倶楽部に高校生が集りだしたら広告枠を売っている営業マンは何をして良いか分からなくなるのではないか。
このようにビジネス視点をもってしても、「とにかくクリックさせること」に引っ張られ「どのようなユーザをつれてくるべきか」を見失った集客施策は価値が低いと言える。

■つまり

だれでも連れてくれば良いといったサイトであれば例外的にC-teamが機能するかもしれないが、多くの場合「クリック率のみを追いかけること」はビジネス的にもユーザ的にも悪い環境を生み出してしまう。
サイトの目的を考え、

    • どのようなユーザにサイトに来てもらいたいのか
    • どのような気持ちで来てもらいたいのか
    • サイトに来て何をしてほしいのか
    • その後、継続してそのユーザにどうサイトに関わってほしいか

といった「ユーザをもてなすためのシナリオ」を描いた上で、そのシナリオを達成させる一パーツとして適切なバナーを選定すべきなのだ。
大変おこがましいことを言うが、是非C-teamには今後「コンバージョンで評価する仕組み」や「コンバージョン自体を定義できる仕組み」を追加する方向でサービスを改善してほしいと思う。
その時は是非利用してみたい。