Tweet

連載インデックスへ

テレビでYahoo!
デバイスが変わればUIデザインも変わる

SVGとJPEGをベースにした独自プラットフォーム

　Yahoo! JAPAN for AQUOSは、AQUOSが備えるSVG（Scalable Vector Graphics）の処理エンジンを使って実現されている。AQUOS側はあくまでもデータを処理するのみであり、Webサービスとして後からサービスの追加や入れ替えができる仕組みになっている。専用のブラウザ機能が備わっていると考えると分かりやすいだろう。

　サービス制作者はビジュアル要素としてJPEGを用意し、それをSVGを使って動作を記述する。ワークフローとしては次のようになる。

1. ラフとしてワイヤーフレームを作成
2. どのボタンを押すとどう遷移するかなどフローを設計
3. 仕様が決まったらJPEG画像を描く
4. JPEGを動かすためのSVGのソースコードを技術担当者が書く
5. それらを組み合わせて開発環境でテスト＆調整

　清水田氏がプロジェクトへ参加したのは、過去にソニーのBRAVIAで提供されているアプリキャストでの経験を買われてのもの。また、もともとコーディングのスキルもあるため技術スタッフとの調整が円滑に行えるという。

　「SVGの部分は技術担当者の役割なので、清水田が書くことはありません。しかし、技術を理解していて話が早いというのは、特に終盤の工程では大事になってくるんです」と徳應氏はいう。

　SVGはXMLが基盤となっているし、JPEGやページ遷移といった概念はWeb制作に近いものがある。

　とはいえ、先述の徳應氏の言葉にあるように、テレビ向けのサービスにはPC向けとは異なるニーズがあるのも事実。それらのノウハウは、ヤフー内ではこのYahoo! JAPAN for AQUOSチームにしか蓄積されていない。

　今後は、このノウハウと経験を生かして、サービスの事業部にアドバイスをしたり、新たなデバイスへ進出することが役目となる。一方で、この分野はまだまだこれからだともいう。

　「まだまだ現状のサービスには満足していません。現時点ではこの程度しかできないというのが率直なところです。これまでPCの世界にあった引き出しからおもちゃを持ってくると、まだこんなもんにしかならないよというのが実際なんですね。

　逆に、テレビのことを想定してPC向けサービスの企画を考えると、もっとテレビの世界にもいろいろなものを持ってくることができるはず。あらかじめ設計のところでテレビやほかのデバイスのことを想定していれば、もっとユーザーのかゆいところに手が届くコンテンツやサービスが提供できます」（徳應氏）

コンテンツの何が幹で何が枝葉かを考えることが重要

　Yahoo! JAPANといえば、日本のネットユーザーで知らない者はいないほどのメジャーサイト。誰でも1つくらいはサービスを使ったことがあるはずだ。 あらゆるユーザー層を相手にしているのだから、日本のネットユーザーにとっての最大公約数的なデザインを知り尽くしているといっても過言ではないだろう。しかし、このテレビ向けサービスでは、そのことをあらためて考えるきっかけになったという。

　「日本のネットユーザーは5000〜6000万。 Yahoo! JAPANの視聴率は八十数パーセントですから日本人の3人に1人が使っていることになります。 それだけ多くのユーザーに使っていただくとなると、われわれもみんなに嫌われないようにという価値観に支配されてきます。

　そうすると、何かしらサービスを始めるときに、あれもこれもと要件がてんこ盛りになってしまいがちです。あらためて大切だと思ったのは、全部を盛り込めるわけではないので、不要なものをそぎ落としていったときの幹はどこか、あると便利だねという枝葉の部分はどこか考えるということです。

　これは、情報量やインターフェイスで制約のあるデバイスにかかわったからこそ再認識できたことですね。ですから、要件定義から上流工程に時間をかける。そうすると、後で破綻することもないです」（徳應氏）

　テレビでネットというサービスは、セットトップボックスなどの製品が昔から存在していたものの、なかなか成功したとはいえなかった。しかし、ここ数年はブロードバンドの普及とネット機能の低コスト化、そして大画面テレビの高精細化によって、テレビでのネット利用があらためて期待されている。ここで重要なのは、PC向けのサービスをテレビで利用できるようにするだけでは不十分で、テレビならではのコミュニケーション様式が求められるということだ。

　Yahoo! JAPAN for AQUOSの試みは、PCのWebとは異なる領域でのデザイン／UIを模索することでもある。今後、ネット対応デバイスは増えていくにつれ、デザイナにはデバイスごとの特徴に沿ったデザイン能力も求められてくることになる。

【関連情報】

●Yahoo! JAPAN for AQUOS
●Yahoo! JAPAN for AQUOS対応製品　

新しいユーザーインターフェイス向けのコンテンツ作りは全社で取り組んでいます！

3/3

INDEX
WebとUIをつなぐトリックスター （2）　 テレビでYahoo!―デバイスが変わればUIデザインも変わる
	Page1 テレビでYahoo!―デバイスが変わればUIデザインも変わる PCとは異なるテレビならではのUIデザインを探る PC版やケータイ版と異なるチームがテレビ版サービスを担当 新しい取り組みであるが故にノウハウの蓄積と一元化を目指す まずは「何のデータが使えるか」からスタート
	Page2 たどり着いた結論は「PCコンテンツともテレビ番組とも違うもの」 リビングでの利用に適したデザインとUIを模索
	Page3 SVGとJPEGをベースにした独自プラットフォームで開発 コンテンツの何が幹で何が枝葉かを考えることが重要

「デザインハック」コーナーへ

＠ITメールマガジン　新着情報やスタッフのコラムがメールで届きます（無料）

RSSフィード