ネットで試せる驚異の3Dヒゲシミュレーションサイト ヒゲチェンが生まれるまで

「ちょっとヒゲを生やしてみようかな?」――見た人をその気にさせるサイト、それがヒゲチェンです。同サイトは、シック・ジャパン株式会社が運営するユーザ参加型のWebサイトです。単なるプロモーションサイトではなく、明確なコンセプトを軸に、はっきりとした戦略および最新の技術が盛り込まれているのが特徴です。本記事では、サイトの本質、サイトの魅力について取り上げます。

ヒゲチェン

ヒゲチェン

ヒゲチェン―単なる商品紹介ではないプロモーションサイト

ヒゲをプロモートする

ヒゲチェンにアクセスしてみると、イントロのシーンとともにインパクトのある「ヒゲチェン」のロゴが登場した後、モデル写真にさまざまなヒゲが付き、3Dでリアルに動きます。初めて見る方は、不思議でもあり、おもしろいサイトだと感じるのではないでしょうか。

今回紹介するヒゲチェンは、カミソリメーカのシック・ジャパン⁠株⁠が運営するプロモーションサイトです。といっても、具体的に同社の商品を紹介するのではなく、商品の対象となる「ヒゲ」にフォーカスを当てています。

ここでは、どのようなサイトなのか、特徴とともに紹介します。

手軽に試せるヒゲ体験

ヒゲチェンの一番の特徴は、手軽に試せる「ヒゲ体験」です。ヒゲを付けたい写真イメージを1枚用意するだけでOKです。仮に手元にイメージがなければ、あらかじめ用意されているモデル写真を利用することもできます。

あとは、サイト上でデータをアップし、付けてみたいヒゲを選べば準備完了です図1⁠。

図1 ヒゲを選択。選択できるヒゲの数はなんと1,000種類!ヒゲは「タイプ別」⁠個性別」⁠テーマ別」にカテゴリ分けされており、自分のイメージしたヒゲを探し出すことができる
図1 ヒゲを選択。選択できるヒゲの数はなんと1,000種類!ヒゲは「タイプ別」「個性別」「テーマ別」にカテゴリ分けされており、自分のイメージしたヒゲを探し出すことができる
 タイプ別
① タイプ別
 個性別
② 個性別
 テーマ別
③ テーマ別

2Dが3Dに!しかも動き付き!!

ヒゲの種類を選択した後、GO! 3Dボタンを押します。すると、2Dだった顔のイメージが3Dに、しかも動き出します図2⁠。これはモーションポートレート⁠株⁠が開発した2Dイメージを3D化する「モーションポートレート」と呼ばれる技術を利用しています。

この技術は、2Dの特徴点から3D化を行い、さらにマウスなどのデバイスの動きに対して、特定の部分(ヒゲチェンで言えば、顔写真の目)が動くようになるものです。詳しくは、モーションポートレートのサイトをご覧ください。

モーションポートレート
http://www.motionportrait.com/about/

この3D自動化技術の採用が、ヒゲチェンの一番の特徴です。このように、顔写真を元に3Dに、しかも動きを与えるイメージに変換することで、ユーザのイメージを膨らませることを実現しているのです。

blogやメールを使ったBuzz展開も可能

サンプルではなく、実際に画像を使って試した場合、そのデータをメールによる知人への紹介、画像/ムービー形式での保存、blogパーツへの変換ができます。サイト内で楽しむだけではなく、そこから外部へ広げるBuzzを意識した仕掛けが取り込まれているのもヒゲチェンの特徴の1つです。

また、試したデータを元に、ユーザによるコンテストも実施されており⁠、バイラル展開まで意識したプロモーションサイトと言えるでしょう。

ヒゲ×人×テクノロジー

ヒゲチェンは、⁠ヒゲ」というテーマを軸に、最新の技術を使ってユーザのアテンションを高めています。ヒゲ×人×テクノロジーが組み合わさることで、製品を利用するきっかけを提供し、新しいスタイルのユーザ参加型プロモーションサイトです。今後のサイトプランニングのヒントの1つとして、ぜひ注目したいサイトです。

図2 ヒゲチェンで気になるヒゲのスタイルにトライ! 3D化したイメージはマウスの動きに目線が動く。また、ヒゲを付けたときの印象について「ワイルド」⁠スマート」⁠ユニーク」⁠セクシー」の4項目による採点を行う他、後述するように登録すれば、友人・知人から「似合う」⁠似合わない」のアンケートを取ることができる
図2 ヒゲチェンで気になるヒゲのスタイルにトライ! 3D化したイメージはマウスの動きに目線が動く。また、ヒゲを付けたときの印象について「ワイルド」「スマート」「ユニーク」「セクシー」の4項目による採点を行う他、後述するように登録すれば、友人・知人から「似合う」「似合わない」のアンケートを取ることができる
 さらに、シック製品を使って、実際にトライしたヒゲの形にするための方法についても解説してくれる
※ さらに、シック製品を使って、実際にトライしたヒゲの形にするための方法についても解説してくれる
※)
ヒゲチェンコンテストは、取材時に開催されていました。結果は、ヒゲチェンのサイトをご覧ください。

インタビュー:ヒゲチェンが生まれた理由(わけ)
―コンセプトは「ヒゲ人口を2倍に!」

今回、⁠株)アイ・エム・ジェイの協力のもと、ヒゲチェンの企画・制作・開発を担当した⁠株⁠イグジスト・インタラクティブ、J.ウォルター・トンプソン・ジャパン(株⁠⁠、シリコンスタジオ⁠株⁠の3社に、ヒゲチェン誕生の舞台裏について伺いました。

目標は「ヒゲ人口を2倍に!」

J.ウォルター・トンプソン・ジャパン⁠株⁠
RMGコネクト事業部 Webプロデューサー
松田 秀作 氏
J.ウォルター・トンプソン・ジャパン(株) RMGコネクト事業部 Webプロデューサー 松田 秀作 氏

松田氏:今回のサイト制作は、シック・ジャパンから発売されるヒゲ剃りの新商品がきっかけでした。

それまで、ヒゲ剃りというのは刃の枚数で比較されてくることが多く、ユーザコミュニケーションの対象が「ヒゲを剃る」ことだったのに対し、これからはそれとは異なる基準、具体的には「ヒゲをデザインする」ことに方向転換をしたいという要望をいただいたのです。さらに、単純に製品を宣伝し売っていくのではなく、その土壌となるヒゲを生やす人をどのぐらい増やせるかが大事だということにも気付きました。

その後、シック様とミーティングを重ねながら出た課題が「ヒゲ人口を2倍にすること」だったんです。これが、ヒゲチェンのコンセプトとなりました。

現在ヒゲを生やしていない人のインサイトを調査したところ「自分に似合うかどうかわからない」⁠自分にどういうヒゲが似合うかわからない」という点がバリアとなっていることがわかりました。

ユーザ目線になって考えたとき、ただ格好良い俳優を使って、ヒゲを生やそうと訴えるだけでは共感は得られない。

そこで、ユーザが気軽にヒゲを試せるツールを用意すれば可能性が広がるのではないか、と考えました。そして、そのツールに最も適した媒体がWebということになったんです。

2Dではなく3Dの世界を

⁠株⁠イグジスト・インタラクティブ
シニアプロデューサー
望月 靖史 氏
(株)イグジスト・インタラクティブ シニアプロデューサー 望月 靖史 氏

望月氏:実際に制作のオファーを受けてからは、まずさまざまなアイデアを出すことから始めました。その中で、我々Web屋としてできることは何かということをふまえつつ、ここにいる小西がヒゲシミュレータの存在を知っていたので、そこを切り口にプランを立てることにしました。

ただ、世の中にあるヒゲシミュレータの多くはすべて平面、すなわち2Dだったため、ユーザに対してそれほど説得力がないと感じたのです。実際、自分がヒゲを生やす姿を想像するには、横から見た様子や顔の周りまで見られるようにしたほうが絶対に良い、と。そこで3D表現を盛り込むことにしました。

一方で、じゃあ3D表現をするにはどうするかと考えたとき、日本で担当できるのはシリコンスタジオさん以外にいないという判断をし、開発のオファーを出したんです。

シリコンスタジオ⁠株⁠
ソフトウェアエンジニア
柴田 守良 氏
シリコンスタジオ(株)ソフトウェアエンジニア 柴田 守良 氏

柴田氏:今回の案件ではモーションポートレートという技術を採用することを考えていたのですが、オファーをいただいたときには、開発案件が1つあるだけで公開事例がありませんでした。こういう状況もあり、新しいものへ取り組める⁠期待感⁠を感じていました。

制作裏話―1,000のヒゲをどう作るか

松田氏:実際に制作が始まったのが2007年9月ごろです。このとき、我々とイグジスト・インタラクティブさんとでアイデア出しやプランニングを行い、アプリケーションの開発はシリコンスタジオさんが担当するという分担で行っていました。

私たちの中では、サイト自体をコンテンツの量ではなく、ヒゲシミュレーションに絞り込んで表現したほうがインパクトがあるのではないかと判断し、極力コンテンツ要素を減らしました。その代わり、ヒゲを試すツールとしての機能を数多く実装しています。その1つが、ヒゲのサンプル数を1,000にしたことですね。正直なところ、非現実的なヒゲもありますが、数のインパクトでユーザに響かせたかったんです。

望月氏:あとは、どのぐらいユーザにとって使いやすいか、操作感についてはいろいろとテストし検討を重ねました。2Dを3Dに変換するためのサーバ処理速度の向上だったり、あとはサンプルのヒゲをダウンロードするときの処理速度についても考慮しました。

シリコンスタジオ⁠株⁠
クリエイティブディレクター
脇本 亮 氏
シリコンスタジオ(株) クリエイティブディレクター 脇本 亮 氏

脇本氏:今、望月さんがおっしゃったように、開発側で一番苦労したのが、ヒゲデータのダウンロードと検索処理です。今回のサイトではFlashを利用しているのですが、サイトにアクセスするたびにデータをすべてダウンロードしていては、立ち上げ時間がものすごく遅くなってしまい、ユーザにとってストレスとなります。そこで、Flashのキャッシュを利用してクライアント側の処理を増やすことにより、処理速度を向上しています。また、この仕組みは低スペックのマシンも考慮できるメリットがあります。

望月氏:あとは2Dから3Dにしたときのリアル感も検討を重ねました。当初、ユーザが登録した画像に関しては背景をすべてグレーにしていたのですが、この方法だと画像のクオリティによって、できあがる3Dイメージの品質が著しく低下してしまう場合が見られたのです。

そこで、背景はそのままにして、元画像を利用して人間の目の錯覚を利用することで、リアル感を保てるようにしています。

ティザーサイトからのユーザ導線作り

⁠株⁠イグジスト・インタラクティブ
小西 仁介 氏
(株)イグジスト・インタラクティブ 小西 仁介 氏

松田氏:いよいよオープンという時期になり、ティザーサイトからベータ版の形でオープンしました。というのも、このサイトはたくさんのユーザに実際に使ってもらうことが目的であり、そのためにはティザーで単なる告知だけでは不十分と判断したからです。さらにそのサイトをアルファブロガーの皆さんに試してもらえるように展開しました。

その他にも、TVCMにも起用されているチュートリアルの2人を含めた、ヒゲチェンサンプルの動画をYouTubeにアップするなど、公開前から積極的にバイラル展開を行いました。

望月氏:そうですね。とくにYouTubeへアップした動画については、人間だけではなくモナリザや新幹線、オムライスなど、非現実的な画像に対してヒゲを付けたりして、Buzzを生み出す仕掛けをしました。ただ、再生回数で見ると、チュートリアルの2人の動画がダントツに多かったのですが(笑⁠⁠。

みんなに見てもらえるサイトに

望月氏:今回のサイトに関して、プロデューサーの立場から見ると従来考えられていたWebの枠をうまく超えられたと思っています。一般的にWebというとアーカイブ性を求めてしまいがちですが、あえて情報量を制限し、見せたいものだけをきちんと見せられたと思っています。その結果として、公開後からたくさんのユーザ(取材時Visit数:83万、hige-chen数33万)の獲得につながったのではと思います。

モバイルサイトもきっかけ作りという目的で、非常に貢献してくれているのではないかと考えています。

松田氏:私たち代理店の立場から、今回のサイトはこれからの指針にもなると思っています。これまでにもすごいサイトはたくさんあったと思うのですが、その多くが業界内の評価でとどまってしまっていました。しかし、2007年に入り、脳内メーカーや顔チェキといったように、Webに精通していない人にも見られるサイトが増えてきています。ヒゲチェンもぜひ、そういったサイトと同じくたくさんの方に見てもらって、日常会話で「あのCM見た?」というのと同じ感覚で「あのサイト見た?」と言われるようにしていきたいですね。

⁠株⁠イグジスト・インタラクティブ
URL:http://xist-i.co.jp/
J.ウォルター・トンプソン・ジャパン⁠株⁠
URL:http://www.jwt.co.jp/
シリコンスタジオ⁠株⁠
URL:http://www.siliconstudio.co.jp/

企画・デザイン

Xist&IMJモバイル:18名
⁠企画・デザイン3名、ヒゲ制作10名、コンテンツ制作3名、イラストレータ2名)
J.ウォルター・トンプソン・ジャパン:10名

おすすめ記事

記事・ニュース一覧