トヨタシステムズ(TS)|TS BASE(トヨタシステムズ ベース) トヨタシステムズの技術が支える、日常を可視化するインタラクティブコンテンツ

Visit Site

株式会社トヨタシステムズ様からのご依頼により、同社の製品・サービスが日常生活をいかに支えているかを示すインタラクティブコンテンツ「TS Base」の新設しました。
目指したのは、同社の製品・サービスと私たちの生活との密接な関わりを伝えること。その実態をわかりやすく、かつ印象的に表現することが、このコンテンツのミッションです。
電通様のグラフィックチームと緊密な連携のもと、限られた時間内で効果的なコンテンツ制作に取り組みました。

Problem

課題

形のない製品・サービスの価値をいかに身近に感じてもらうか

トヨタシステムズ様の製品は主にシステムやサービス。目に見える形での表現が困難な商材です。
実際には私たちの日常生活に密接に関わり、それを支えているにもかかわらず、その存在感や重要性が伝わりにくいという課題がありました。
ユーザーにとって身近で、かつ不可欠な存在であることをいかに効果的に伝えるか。その手段の確立が求められました。

Solution

解決策

直感的UIと魅力的UXで楽しみながら理解を深めるインタラクティブコンテンツ

アイソメトリックな街並みイラストを基調とし、「オフィス」「金融機関」「住宅」などクリッカブルな領域を設定したインタラクティブコンテンツを制作しました。
各エリアをクリックすると、そこでトヨタシステムズの製品がどのように使われているかを詳しく説明する仕組みです。
実際の生活シーンにトヨタシステムズの製品・サービスを落とし込むことで、普段は意識しにくい同社の技術が身の回りで活用されていることを自然に伝える構成を実現しました。
さらに、イラストの世界観を細部まで作り込み、コミカルなアニメーションを取り入れることで、ユーザーが世界観に没入しやすいコンテンツとなり、エンゲージメント向上を図りました。

TS BASEのオフィスエリア。
オフィスで役立っている製品詳細説明。
TS BASEの金融機関エリア。
金融機関で役立っている製品詳細説明。
スマートフォンで表示した場合の、TS BASE画面。
スマートフォンで表示した場合の、オフィスで役立っている製品詳細説明。
スマートフォンで表示した場合の、金融機関で役立っている製品詳細説明。

JavaScriptで実現する生き生きとした都市の息吹とシステムの調和

のアバター

高木 整ニ

JavaScriptを駆使し、活気に満ちた都市風景のアニメーションサイトを制作しました。人々の往来、車の流れ、ドローンの飛行など、細部にわたって丁寧に動きを実装。これらの要素を調和させることで、生き生きとした都市の雰囲気を表現しています。
この魅力的な都市シーンの中に、トヨタシステムズ様のシステムやサービスを効果的に組み込むことで、その存在感と重要性を視覚的に伝えることに注力しました。

credit

Client 株式会社トヨタシステムズ

Agent 株式会社 電通

Director 井畑 徹也

Engineer 高木 整ニ

記事を共有

All tags ###