中野です。
本日、(株)シーエーシー様の「kizasi.jp」の姉妹サイトである音楽情報サイト「musicmarq」がオープンしました。
アークウェブは、musicmarqの構築において、コンテンツ立案、UI設計、デザイン、Ajax/Flashによる(主に)クライアントサイドのシステム開発などのお手伝いさせていただきました。
musicmarq みんなのブログで作る新感覚音楽情報サイト
http://musicmarq.jp/
音楽情報に特化した流行の兆しがわかる「musicmarq」 - CNET Japan
http://japan.cnet.com/news/media/story/0,2000056023,20100735,00.htm
musicmarqはkizasi.jpと同じ時系列共起パターン解析エンジン（Kizasi Search Engine）を使っており、1週間内にブログ上で急に話題になったアーティストや楽曲の情報をランキングで表示する。また、タワーレコードでのアルバム販売枚数ランキングやリッスンジャパンの楽曲ダウンロード数ランキングも同時に紹介し、コンテンツに幅を持たせた。
kizasi blog : kizasiの音楽情報サイト「musicmarq」オープン！
http://blog.kizasi.jp/kizasi/13
ランキング比較ページ「まとめてランキング」ではタワーレコード様やリッスンジャパン様の外部ランキング情報をマッシュアップさせているのが特徴です。
(...)
バイラル効果の大きい音楽分野で、kizasiを使った新しいメディアの形を提案します。
Web 2.0時代の重要なインフラCGM/Blogosphereのトレンドを読むサービスは、国内でもいくつかあります。なかでも、ランキングの精度が高いだけでなく楽しめるという点ではkizasiが一番ではないかと思います。musicmarqは、そのkizasiエンジンを基盤に「CGM(Consumer Generated Media)＋音楽メディア」という融合や、音楽系サイトらしいスタイリッシュさにこだわったサイトです。
musicmarq あの曲何位？ ブログとチャートをまとめてランキング
http://musicmarq.jp/chart/index.html
このランキングなどは、Blogosphereのムードと「タワーレコード」「リッスンジャパン」の現実のランキングを対比することで、目敏い人ならいろいろなヒントを引き出すことができるでしょう。
以下は、今回のプロジェクトで特に留意した点です。
●インタフェース設計
ランキング、アーティスト、楽曲などの各ページにそれぞれアクセスされることが多く、横断性はさほど必要ないため、初期状態では網羅的なグローバルナビゲーションを隠し、ヘッダにはロゴと検索フォームのみを置いた。
●デザインとマークアップ
音楽系サイトであり、基本的にはブログを読ませるサイトであることから、使う色を抑制。かつ、各コンテンツのキーカラーを決めた。
XHTML+CSSによるマークアップで、後の拡張性を考慮してシンプルなソース記述を心掛けた。
●システム開発 (主にAjax)
ページ遷移が直感的にわかるよう、ブログを表示する際に一度レイヤーを閉じてから開くというアクションを実装した。
「まとめてランキング」では、曲名とアーティスト名をクリックすると詳細情報をレイヤーで表示。かつ、これをドラッグできるようにした(script.aculo.usを使用)。
「話題のアーティスト100」「話題のミュージック100」では、初期は25位まで表示しておき、スクロールして下端に達するとサーバと通信してさらにランキングを表示、トータルで100位まで表示するようにした。
