GO GX Website

Credit

Client
GO株式会社
Type of Business
モビリティ関連事業
Role
  • 3dcg
  • Brand Design
  • Contents Design
  • Graphic Design
  • Web Design
  • Web Development
  • Writing

Overview

脱炭素社会の実現をめざす
GX(グリーントランスフォーメーション)

「移動で人を幸せに。」をミッションに、モビリティ産業領域でITサービスを展開するGO株式会社さま。GOさまが推進する脱炭素サービス「GX(グリーントランスフォーメーション)事業」は、商用車のEV化や充電器の導入、運用サポートまでを包括的に提供しています。neccoでは、GX事業を分かりやすく表現するためのウェブサイト制作、ダウンロード資料制作、実績記事・メディア記事制作をお手伝いしました。





White#FAFAFA250/250/250
Light Gray#F1F5F9241/245/249
Light Green#A9CE56169/206/86
Green#1FB43F31/180/63
Black#16010422/1/4

Client

GO株式会社

Team

Creative Direction

Fumito Abe

Art Direction

Fumito Abe / Seina Kon / Koyuki Nakagawa / Mari Nagano

Web Direction

Fumito Abe / Koyuki Nakagawa / Fuyuna Taguchi

3DCG Design

Mari Nagano

Illustration

Seina Kon / Nao Ryujin

Web Design

Fuyuna Taguchi / Koyuki Nakagawa / Mari Nagano / Nao Ryujin / Seina Kon / Yuka Adachi / Fumito Abe

Contents Design

GO Inc. / Hitomi Natsui / Fuyuna Taguchi / Fumito Abe

Document Design

Mari Nagano / Koyuki Nakagawa / Fuyuna Taguchi / Seina Kon / Nao Ryujin / Yuka Adach / Fumito Abe

Interview

Fumito Abe / Hitomi Natsui / GO Inc.

Photograph

Hitomi Natsui / Fumito Abe / GO Inc.

Writing

Hitomi Natsui / Fuyuna Taguchi / GO Inc.

Web Development

Ayumi Sato / Nami Takagi / Masato Watanabe

CMS Integration

Ayumi Sato

Interaction Design

Fumito Abe

WebGL Development

Fumito Abe

Contact

お仕事のご依頼は、お問い合わせからご連絡ください。

Share

Creative Direction

GO GXが、近い未来をもっとクリーンに。新事業を誠実にわかりやすくお客さまに届けていく。

タクシーアプリ「GO」として広く知られているGO株式会社さまからご依頼をいただきました。EVの導入と運行による脱炭素化を包括的に支援するGX(グリーントランスフォーメーション)事業について、ウェブサイトのリニューアルをneccoにて担当させていただきました。

ウェブサイトの制作を軸に、GX事業やサービスの言葉の整理とビジュアル作成、GX事業の概要をまとめた資料の作成、パートナーさんのインタビュー記事の作成やオウンドメディアであるGXメディアの記事作成など、一貫してお手伝いしました。

GOさんがこれまで培ってきた知見とテクノロジーを活用したGX。この新しい事業をさらに促進していく基盤となるようなウェブサイトを目指し、GOチームのみなさんと一丸となり制作しています。

GO GXが近い未来をよりクリーンにしていく。そんなGOさんの願いが、お客さまのもとへ届く。そのためのデザイン資産となれば嬉しいです。

3DCG Design

GX事業全体と世界観を表現した3DCG

メインビジュアルはGOさまのGX事業のサービス内容とクリーンさが伝わるような3DCGアニメーションを作成しました。
前半ではサービスの全体像と目標を、後半では実際にサービスが街中に普及している様子を3DCGで表現しています。
特に後半は、現実に存在している様子を表現するため、車や充電器をはじめ建物や信号機の大きさや配置などが、リアルな縮尺に近いものになるよう意識して作成しました。

またメインビジュアル以外にも配下ページや資料デザインにもアニメーションとは画角を変えた3DCGを使用し全体の統一感をだしています。

サービスはメインビジュアルのクリーンさを踏襲しつつ、
購入した車のモデルを中心により具体的なサービス内容が伝わる3DCGを作成しました。

Web Design

脱炭素を推進する
クリーンなGXの事業内容が
魅力的に伝わるサイトデザインに

GO株式会社さまのGX(グリーントランスフォーメーション)事業では、EVの導入と運行による脱炭素化の推進を支援しています。脱炭素化を推進するサービスの取り組みが伝わるように、クリアかつクリーンなトーンで全体を設計しています。
ファーストビューでは、GX事業の全体像を伝える3DCGの動画を画面全体に配置し、視覚的に事業内容が伝わるようにしています。スクロール時には、GOさまのロゴにも使用されている丸で動画を切り抜くことで、テキストと動画をストレスなく同時に閲覧できるようにしています。
電気で動く車両の導入や運行も実施されているため、コンセントのあしらいや、エネルギーのネットワークをイメージした粒のあしらいを全体に取り入れています。
EVの導入を検討するお客さまに、GOさまが提供できるサービス内容を伝えつつ、今までの知見を活かしたテクノロジーを3DCGやテクスチャーで表現できるサイトを目指しました。

Illustration

EVに馴染みがない方にとっても
分かりやすく、クリーンさを感じるイラスト

全体デザインや⁨⁩3DCGに合わせて、クリアでクリーンな緑のグラデーションをメインにイラストを作成しました。EVは、まだ日本ではなかなか普及が進んでいない分野です。
そのため、実際にEV車両や充電器を使用したことのない方にもイメージしやすいよう、周辺環境や動きをイメージした描き込みも意識しています。また、GOさまのロゴと合わせた図解での使用も考慮し、統一感のある丸みやトーンに仕上げています。

Interaction Design

GXの実現する未来を想像しながら、操作感や触り心地を調整

Lenisを利用した慣性スクロールやAstroでのページトランジション、ボタンのホバーやグラデーションの自動で変化など、GXの実現する未来を想像しながら少しずつ操作感や触り心地を調整していきました。

インタラクションは不足なく過剰にならずを意識して付与していきました。

Writing / Case Study

GXへの取り組み実績について
インタビュー記事制作をお手伝い

GOさまと共にGXに取り組むパートナー企業を取材する「実績記事」の制作をお手伝いしました。オンライン・オフラインでのインタビューと写真撮影、記事ライティングを担当。記事内では、プロジェクトの具体的な内容はもちろん、進行中のエピソードやGX事業への想い、今後実現したいことなど、脱炭素化に関するさまざまな内容を伝えています。

Writing / GX Media

EVやGXにまつわる情報を
発信するメディアのスタート

ウェブサイトのリニューアルにあわせ、EV(電気自動車)やGX、GOさまの事業に関する情報を発信する「GXメディア」がはじまりました。記事の案出しから情報収集、原稿・図版の作成まで、GOさまと共同で行なっています。
1記事目はEVを導入するメリット・デメリットについて学べる記事を作成。ひとりの読者として気になること、知りたいことを、プロであるGOさまに教えていただきながら作成しました。今後、GXメディアが読者のみなさまの疑問や不安を解消し、脱炭素化の推進に役立つことを願っています。

Web Development

Astro + microCMS + Firebase のJamstack アーキテクチャを採用

フレームワークにはAstroを採用しました。マルチページの静的サイトとして公開しながらも、Astro 3.0から正式搭載されたビュートランジション機能やプリフェッチ機能を活用し、それらの機能に対応している閲覧環境ではページ遷移をストレスなく、スムースに行えるようにしました。

CMS Integration

microCMSで快適な投稿管理を

実績、メディアとお知らせの投稿管理にはmicroCMSを採用しました。microCMSの柔軟なフィールド構成力を活かし、簡便に更新できるように構成しています。

Jamstack構成ではしばしばビルドに時間がかかることがネックとなりますが、ビルド時に一度全記事を取得しておき、それをキャッシュとして利用しながらページを生成していくことで、microCMS APIへの負荷を減らしつつ、データ取得にかかる時間を減らし、ビルドが高速に終わるよう工夫しました。

WebGL Development

GXのクリーンエネルギーをモチーフにしたパーティクル

画面全体を覆うようにゆっくりとふわふわ動く緑色の玉はThree.jsを利用してパーティクルを生成しループして動くようにしています。立体感もでるように上下左右、前後の動きをつけています。

3DCGの映像の上でもウェブサイトの各セククションの上に表示されてもなじむ表現を目指しました。

Client Voice

期待をはるかに上回るワンストップ感

簡易的に用意した公式サイトをCMSサイトへとアップデートし、継続的な情報発信をしていきたいと考えていたところ、サイト構築からコンテンツ執筆までワンストップでやって頂けるというお話を聞き、プロジェクトをご一緒させて頂きました。
インタビューやその場での議事録の取り方など、とってもスムーズで、相当場数を踏まれてきたのだなと感じました。
キックオフ前のご提案内容、3DCGのムービー、弊社事業への理解度の高さなど、単なるWebサイト制作にとどまらない上流のソリューションをご提供頂きました。
期待をはるかに上回るワンストップ感でした!


GO株式会社
デザイン部 コミュニケーションデザイナー
中村 竜太朗

伴走型チームで、魅力を伝える専用ステージが完成

公式サイト制作の背景にある課題への理解力に加え、我々メンバーの思考や想いへの寄り添い方に助けられる場面が多く、さらに目指す世界観を伝える磨かれたクリエイティビティセンスには感動を覚えました。個々に強みをお持ちのチームの皆さんの繰り出すアイデアと伴走により、幅広いステークホルダに届くことが期待できる「GOのGX」を存分に魅力的に伝える専用ステージが完成しました!


GO株式会社
CC本部 広報部
萩尾 楽子

GO株式会社のGXが実現しており、かつ、目指している世界観を、オウンドメディアという形で、パートナーとして二人三脚で実現いただきました!

自社制作のオウンドメディアは既にあったのですが、ほぼランディングページとなっており、事業スピードと拡大に合わせてアップデートしたいと考えていた中で、今回ご協力いただきました。
弊社の要望にお応えいただけるだけではなく、まさにパートナーとして目的に対しての提案と実装をいただき、大変感謝しております!

リリース初速としても改善の成果も実績として既に確認できており、これからも密に連携させていただければと考えております!


GO株式会社
執行役員 / GX事業本部 本部長
佐々木 将洋