NEWS

2013.08.30

オフィスに似せたWeb空間を、優木まおみが御案内。フィールズ株式会社の公式サイトをリニューアル

2013年9月2日(月)より、チームラボがリニューアルを行った、FIELDS株式会社のコーポレートサイト(http://www.fields.biz/)を公開します。

新サイトは、FIELDSの実際のオフィスを模して制作しており、主要事業部の実績や雰囲気を、まるでユーザーがオフィスを訪れたかのよう設定な感覚で閲覧することができます。また、パララックス効果(※)を使ったページデザインにより、キーボードの方向キーでスムーズにサイト内を移動することができます。

※パララックス効果…レイヤーのように重ねた画像を異なる速度でスクロールさせることで奥行きや動きを表現する方法。

優木まおみさんがサイトをご案内。TOP画面の背景は実際のフィールズ株式会社の受付をモデルとしています。


◆コンセプト──Webと実空間のシームレス化

オフィスビルを模したサイト内の構成は、1Fの受付および企業コンセプトを紹介するフロア、2Fのコミック・ライセンス部門、3Fのアニメーション部門、4Fの映像・ラブメディア部門、5Fのインタラクティブメディア部門、6Fのコンシューマープロダクツ事業部門、7Fのパチンコ・パチスロ部門からなり、それぞれに部門の紹介画面、各部門のコンテンツ一覧画面、そして、コンテンツの詳細を伝える実績詳細画面があります。

1Fと2Fの背景は、実際の社内と同様の調度品や空間構成になっています。そのため、サイトを訪れた人には、フィールズの会社の各部門の業務や実績だけでなく、オフィスの雰囲気も知ってもらえるようになっています。

それぞれのフロアで、事業部門をご紹介。フロアは、事業部門のテイストを意識した空間構成となっています。


◆演出──サイトの閲覧履歴に応じてコンシェルジュがコメント
仮想オフィスとも言えるサイトに訪れた“お客様”をもてなしてくれるコンシェルジュとして、優木まおみさんが登場。アニメーションと共にユーザーに語りかけてくれます。cookie情報からユーザーの閲覧頻度、最後に見た画面などのデータを取得することで、フロアごとに決まったものではなく、状況に合わせたメッセージを表示します。

案内役の優木まおみさんの衣装は、全部で9パターン。1日毎に違う衣装をきた優木さんがユーザーを出迎えてくれます。

◆技術──企業のイメージを形作るデザイン×テクノロジー
JavaScriptを徹底的に最適化することで、ページ遷移なくスムーズに移動できるFLASHサイトのような操作感を実現しながら、各ページを検索結果に表示させ、直接閲覧することができるなどのSEO施策も同時に行っています。

企業のブランドイメージを形作るコーポレートサイトとして、デザイン性と実用性を両立しました。

■FIELDS株式会社
http://www.fields.biz/
 

■チームラボとは
プログラマ・エンジニア(プログラマ、UIエンジニア、DBエンジニア、ネットワークエンジニア、ロボットエンジニア、コンピュータビジョンエンジニア、ソフトウェアアーキテクト)、数学者、建築家、Webデザイナー、グラフィックデザイナー、CGアニメーター、絵師、編集者など、情報社会のさまざまなものづくりのスペシャリストから構成されているウルトラテクノロジスト集団。

<主な実績>

「百年海図巻」と「チームラボハンガー」が文化庁メディア芸術祭審査委員会推薦作品に選出(2011)。カイカイキキギャラリー台北で『生きる』展開催(2011)。フランス「LAVAL VIRTUAL」にて「世界はこんなにもやさしく、うつくしい」を展示し、「建築・芸術・文化賞」賞を受賞(2012)。台湾美術館にてチームラボ「We are the Future」展を開催(2012)。シンガポールで行われた国際アートフェア「Art Stage Singapore 2013」にて「Nirvana」を発表(2013)。台北市立美術館『Parkett – 220 Artists’ Editions & Collaborations since 1984 +5』にて「世界はこんなにもやさしく、うつくしい」を展示(2013)。タッチパネル式の次世代受付システム「FaceTouch」と成田国際空港に常設展示中の「世界はこんなにもやさしく、うつくしい」が デジタルサイネージアワード2013を受賞。

なお、今後の予定として、「新作」を『かごしまアートフェスタ2013』(霧島アートの森)にて展示予定(9月26日~9月29日)。

チームラボ株式会社
http://www.team-lab.com/
チームラボ作品紹介
http://www.team-lab.net/



 

お問い合わせ

制作のご依頼・ご相談・お見積もりはお問い合わせください

お問い合わせ

採用

エンジニア、ディレクター、デザイナー、アルバイト募集中

採用情報