website

nanapiリニューアルは単なるモダン化じゃなくて綿密に計算されたユーザ行動のリデザインだった

あのnanapiが2011年4月にリニューアルして、やれモダンだ、やれHTML5だ、やれFacebook連携だともてはやされてましたが、うーん、そういう話じゃなくね? だってあの(計算高い)nanapiがだぜ、そんなデザインやソーシャル連携の話題性のためにわざわざ手間のかかるリニューアル作業をするだろうか? と引っかかっていたのですが、1か月ほど経ってようやく分かりました。

ビフォーアフター

beforeafter

モヤモヤしていた部分は3つ。

UNIQLOのブランドサイトを集めてみる

最近、UNIQLO CALENDAR というサイトが公開されて、やっぱすげぇなぁユニクロ。違うよね。他とはね。っていう空気が一般化(?)してきた感があるんですが、同時に、サイト立ち上げすぎじゃねーの、とも思ってしまうのです。
だって、たくさんありすぎてよく覚えてないものもあるし。

なんでそんなことを続けるんだろう、と考えました。まぁ新商品が出れば新サイトを立ち上げるのは当然だとしても、とにかく作ること・話題になることが目的なんだろうか? それとも、今までばらばらにリリースされてたサービスが、実は一つの哲学に基づいていて、どっかのタイミングで俯瞰したときに一つの絵を描いていたりする?
江戸の町は風水的に計算されて作られているとか、そういう視点で。サイトごとに直接はつながりがなくても、鬼門となる地点やサービス名を繋げると星の形になって中心に位置する城を守るとか、そういう意図があるのか? 個人的にはそれが分かるとスッキリするからそうあってほしいとも思いつつ、現時点でのサイトを集めるのも意味があるかなと思ったので、とりあえず集めてみます。

ネスカフェ ドルチェグスト 私のカフェ

ネスカフェ ドルチェグスト 私のカフェ
ネスカフェ® ドルチェ グスト® 私のカフェ

ネスカフェのカプセル式ホームバリスタシステム(!?)こと「ネスカフェ ドルチェ グスト」のスペシャルサイトです。
コンテンツの「とびだすドルチェ グスト」では、FLARToolkitを使って(おそらく日本発の商用利用)、この機械を立体的に表示しています。
AR時代の到来を予感させるサイトです…なんつって、優等生的なコメントをしようかと思ってたんですが、やってみると、うまくいかない。

ネスカフェ ドルチェグスト 私のカフェ
このサイトではARを身近なものにするため、マーカーを印刷させるんじゃなくて、ケータイの画面に表示させるという手法を採用しています。これは挑戦的。これまでARといえば、とにかくマーカをプリントしないと始まらなかったんですが(なので一般的利用というよりは面白年賀状やびっくり名刺でFlasherの間に広まってた感じ?)、二次元バーコードをケータイで読み取ってアクセスするとマーカが表示されるという、誰でも使えることを優先としています。
ちなみにマーカはこんな感じ。マーカのシルエットがドルチェグストの機械の形なんですね。

はてさて、ケータイで試してみたものの、なかなか認識してくれません。角度によっては認識しやすい場合もあるんですが、どうやら画面の写り込みのせいで認識が働かない様子。もしくは、黒い部分も含めてマーカなので、ケータイが黒いと枠を認識しないのかも? さらに、ブラウザの前にケータイをプラプラさせていると、手とケータイのせいで写ったときに肝心のコンテンツが見えないというアクシデントが。

しょうがないのでマーカを印刷してみると、あら不思議あっという間に認識して立体機械が出てきました。こんなに認識率が高いのか!FLARToolkit!!

まとめ

ARコンテンツには2つのハードルがあって、ひとつは「webカメラがついていること」。もうひとつは「マーカを簡単に入手できること」。だと思うんです。前者は環境の問題なのでしょうがない部分は多々あるとして(なので、ARを使わないでも楽しめるコンテンツが必須で、ARはおまけという位置づけにするしかないのが現状ですよね)、後者はユーザの問題。これは改善できます。印刷用画像を表示して「プリントしてね」は、もっとも正しいんですが、ユーザに対してのハードルがメッチャ高い。
結果、ケータイにマーカを表示させてそれを読み取らせる、という導線は、一手間あるようで、実はユーザからすると最短距離なのかもしれません。これがイベント会場とかだと、最初にカードか何かで配っちゃえばいいんですがね。

サイトとしてはどうなのよ

コンテンツはともかくとして、サイトを開いた次の瞬間にソースをバリデータにかけるような使い方をしてしまう僕ですが、今回は気になるものがちょいちょいありました。

<meta content="Microsoft Visual Studio .NET 7.1" name="GENERATOR">
<meta content="C#" name="CODE_LANGUAGE">
<meta content="JavaScript" name="vs_defaultClientScript">

わーお。マイクロソフトやん!最新型のFLARを使うサイトなのでソースも最新のイケてるコードかと思ったらあんまりコダワリはなさそうです。

そもそもドルチェグストって何なのよ

サイトのあり方にばかり気をとられてはいけません。
この機械は、つまりはエスプレッソメーカーなんですね。小さいカップに入ったコーヒーカプセルをセットして、1分で本格エスプレッソができるとのこと。コーヒーメーカーを買おうかエスプレッソメーカーを買おうか、全部入りを買おうか、いっちゃんいいヤツを買おうかと思っていたところだったので、ちょっとグッと来ました。サイトからはセブンイレブンネットへリンクがあって、通販できます。
いちユーザとしては、これが気に入って買うのはいいんだけど、ドルチェグスト専用機だ、というところが購入のネックなのかな。1年後に販売中止になったら怖いし、コーヒーカプセルが気軽に買えないと気になるなぁ。というところですね。
僕はお金のない庶民なので、こんなケチなことを思いますが、コーヒー好きにはいいと思います。僕も毎日コーヒー飲んでますが、缶コーヒーのローテーションに飽きてるところなので、あったらいいなぁ、とは思います。1杯20円のドリップコーヒーを作るのが面倒なので、ワンタッチはいいなぁ。と思います。
なんてことをブログに書いてたらうっかり本体がプレゼントされないかな。