最近「ドコモ・コレクション」というサイトを作りました。
最新ケータイを、機能・スタイル別に並び替えて選べます。
＋ http://www.nttdocomo.co.jp/collection/
機能はシンプルなのですが、
ドコモの機種変更をお考えの方、最新機能をチェック
したい方には、ちょっとお役に立てるかも知れません。
ALL FLASHのコンテンツながら、商品画像変更、
スペック変更に加え、ロケーション情報（位置）、
カラー情報（配色）も担当者が簡単に変更できるようにも
なっているので、WEBマスターフレンドリでもあります。
イマジナティブの今年のテーマ
「デザインと情報を切り分ける」プロジェクトの一つです。
下記、考えをまとめておきました。
--------------------------------------------------------------------
（概要）
＋ サイトのねらい
１．各シリーズのオフィシャルサイトの入り口的な役割
２．多岐にわたる機能／特色をユーザ自身が並び替えをして比較できる。
＋ プロジェクトのポイント
１．最新ケータイの入り口ページとしての高いデザイン性、華やかさ
２．単発サイトではなく、
今後の新シリーズ追加＋入替えに迅速対応できる更新サイト構成
上記の課題に対して、
「デザインとデータを切り分ける」という情報デザイン面での工夫を
して、サイト構築しています。もう少し詳しく説明すると、
＋ データ： XMLベースでのデータ構成抽出
本サイトで、更新性が高いことが予想され、
共通してまとめる（抽出する）ことができる要素を
下記の４つに絞り込む。
１．商品情報（画像＋スペック等）
２．ロケーション情報（並び替え）
３．カラー情報（色分け）
４．セレクション情報（メニュー選択）
＋ デザイン： グラフィック制御はFLASHを使用
上記４つのXMLのデータ構成をベースに
グラフィックとしてダイナミックにサイト上で生成する。
並び替えの際のトランジッションやハイパーテキストとしての
情報デザインに柔軟性を持たせるためFLASHにより制御する。
といった方法をとりました。
＋ 得られた効果１
「データとデザインを切り分ける」サイト構成とすることで、
FLASH側（デザイン＋スクリプト）を変更・修正することなしに、
つまりHTML自体を知らないWEB担当者でも、テキストベース（XML）の
情報を書き換えるだけで、複雑なFLASHコンテンツの掲載情報を
修正／更新が可能な仕様となっています。
＋ 得られた効果２
サイトの開発を進める上でも、商品写真の差し替え、スペックデータ、
発売日等の変更はもちろん、並び替えの要素、レイアウトなども
目まぐるしく変わる開発現場で、この切り分けをしておくことで、
フィードバック対応をすばやく行うことができるなど、
非常に役立ちます。
＋ 新しさについて
商品データ（商品写真やスペックデータ）だけでなく、
・ロケーション情報（レイアウト要素）
・カラー情報（配色要素）
など、これまで「デザイン」的な要素として捉えられていた部分まで、
「データ」的な要素として一旦抽出し、それらを再び「デザイン」
としてサイト上で還元している部分が、「アプリケーションとしての
デザイン」として面白いのではないでしょうか。
--------------------------------------------------------------------
（プロジェクト）
TITLE DoCoMo new model COLLECTION
URL http://www.nttdocomo.co.jp/collection/
LAUNCH 2004.07.09
CLIENT NIPPON COMPUTER ARTS INC.
DESIGN imaginative inc.
--------------------------------------------------------------------