【gaz：制作協業】SHIFTBRAIN × gaz共同制作『立命館大学「宇宙地球探査研究センター」サイト』の制作をデザイナーたちが振り返る。
※こちら株式会社gazを支援時に記事化した内容をLMAP LLC.へ事例を転載させていただいております。吉村がPM、Studio実装を担当しました。
昨年、立命館大学の「宇宙地球探査研究センター(ESEC) 」サイトを株式会社TYO、株式会社SHIFTBRAIN、そして株式会社gazの3社で共同制作いたしました。今回は、株式会社SHIFTBRAINの執行役員、CDO 鎌田亮平氏、株式会社gazのデザイナー 福井ハルナ・デザイナー兼PjM 吉村ユウイチによる鼎談の模様をお届けします。デザイン会社に所属するデザイナーとして、またフリーのデザイナーとして活躍する彼らが、共同制作の振り返りからプロフェッショナルとしての思想まで、軽やかに語っています。
◇立命館大学 宇宙地球探査研究センター(ESEC) サイトについてhttps://esec.ritsumei.ac.jp/
当サイトは、ロゴ、ロゴモーション、オリジナルタイプフェイス制作などのブランディング領域を担当したSHIFTBRAINとの共同プロジェクトです。ESEC（イーセック）は、月・惑星における人類の生存圏拡張と、将来的な居住・生活圏構築に先駆けた探査拠点となる宇宙開発・インフラ構築に取り組む日本初の研究組織です。ESECの未踏領域へ挑戦する探究心を表すイメージとして、Webサイトのキービジュアルには天体をモチーフにしたアニメーションを作成。サイト内フォントには、ロゴに合わせたオリジナルタイプフェイスも使用しています。WebサイトはSTUDIO・CMSを活用しており、リリースやイベントの更新など、運用のしやすい設計となっています。
Client: Earth & Space Exploration Center, Ritsumeikan University (ESEC)
Producer, Creative Director: Takayoshi Kishimoto (TYO Third)
Project Manager: Suzuha Nakamaru (TYO Third)
Producer: Takuma Kato (SHIFTBRAIN Inc.)
Art Director, Designer: Ryohei Kamada (SHIFTBRAIN Inc.)
Designer: Haruna Fukui (gaz, Inc.)
Project Manager, Developer (STUDIO): Yuichi Yoshimura (gaz, Inc.)
関連情報：STUDIOが主催するWebデザインの祭典「STUDIO DESIGN AWARD 2023」にノミネートされました。
https://designaward2023.studio.design/vote/esec_ritsumei
SHIFTBRAIN × gaz、2つのデザイン会社が共同制作したきっかけ
吉村：
今日のトークテーマは、僕たちが初めて共同制作した「立命館大学様『宇宙地球探査研究センター(ESEC)』」サイト制作の振り返りです。SHIFTBRAINさんとは初コラボでしたが、gazをパートナーに選んだのはどうしてですか？
鎌田：
もちろん、僕が吉村さんと一緒にやりたかったからですよ。
吉村：
ありがとうございます！じゃあ、1番の理由は僕ということで。（笑）2番目の理由は何でしょう？
鎌田：
今回の案件は、納期の短さがボトルネックになっていました。それも、通常にコーディングをしていたら、とても間に合わないくらい。この問題を解決できるのがSTUDIOだったんです。
でも、SHIFTBRAINではSTUDIOを導入していません。そこで、実績が豊富なgazさんとタッグを組むことに決めました。
福井：
トップレベルのデザイン会社とのコラボということで、いったい誰がアサインされるのか、社内のみんなが注目していました。当時、やってみたいデザイナーがたくさんいたと思います。
吉村：
確かに。福井さんに決まったときは、正直「プレッシャー感じてるだろうな」と思いましたよ。
福井：
すっごく緊張しましたね。でもそれより、鎌田さんとコラボできたことが嬉しかったです！
全員が引き込まれる、鎌田さんのプレゼン方法
吉村：
噂に聞いたことがあるんですけど、鎌田さんってマジシャンなんですか？
鎌田：
そうなんですよ。デザイナーよりマジシャン歴のほうが長くて、小学生の頃からずっとやっています。仕事でステージに立つようになったのは高校時代かな。
吉村：
鎌田さんがマジシャンっていうの、何となくわかります。実はプレゼンのとき、鎌田さんの提案や進行の仕方を見て、マジックみたいだなと思っていたんです。人の気持ちをどんどん惹きつけながら、目指すゴールへ向かって、滑らかに話を進めていくんですから。
福井：
すごかったですよね。鎌田さんは、話すことのひとつひとつが論理的なんです。それでいて、プレゼンの流れにはストーリー性があって。もう、その場にいた全員が納得していました。
鎌田：
僕はデザインを作る前に、プレゼンの資料を仕上げちゃうんです。選んでほしいデザインを何番目に見せるか、作ろうとしているビジュアルと話の内容が合っているか、どうやってクライアントに落とし込むか。そういうものを全部組み立てて、ストーリーラインを決めていきます。それが終わって、やっとデザイン。
吉村：
しかも、映画を観ているような緻密なストーリーラインですよね。これならクライアントも充分に納得するから、プロジェクトが走り始めた後に相違が起きることはないだろう、と思いながら聞いていました。ほんとにすごいなって。
福井：
デザインの前に資料を作るって、初めて聞きました。興味深いですね。
鎌田：
プレゼンもマジックも、基本は心理学なんですよ。たとえば僕が「福井さん、吉村さん」って呼びかけるのと「あなたたちは」って話し出すのでは、感じ方が変わるでしょう？
あとは、要所要所で声のトーンを上げたり、感情の起伏をつけたり。そんなテクニックも使っています。
コラボレーションで感じた、gazメンバーの魅力
吉村：
共同制作の間、僕はPjMとして、鎌田さんと福井さんのやり取りをそばで見ていました。ずいぶん細かいところまで詰めていて、レベル高いなと思いましたね。
鎌田：
もうね、嬉しかったんですよ。デザイナーの仕事って、基本は独りじゃないですか。いつも孤独な作業をしている僕に、今回は相方ができたんですから。
最初に、福井さんがトップを丸ごと作ってくださって。そこからふたりで、ああでもないこうでもないと言いながら、デザインを細かく練っていきました。
福井：
全体の作りやファーストビューなど、ポイントになるところがいくつかあったんです。そこでお互いにパターンを出し合ったり、折衷案を探ったりしながら、作り直していきました。
最終的には鎌田さんが、アートディレクターとしての方向性を示してくれたので、ベストなところに着地できたと思っています。
鎌田：
結果を出せたのは、福井さんの粘り強さのおかげです。今回の仕事は、デザインそのものの難易度が高い上に、素材も要素も少なかったですから。僕が自分でやっていたら、かなり悩んだと思います。
吉村：
それ、わかります。福井さんはいつも、みんなが「デザインはこれでいいね」と思うところから、提出までの残りの時間しっかり粘るんですよ。その上で、さらに良いものを出してくるんです。
福井：
確かにデザイン自体は、クライアントが満足すればOKですよね。でも私は、その先にある、デザイナーが納得するところを突き詰めるのが好きで。たどり着ければ、ひとつレベルアップできると思っています。
鎌田：
僕が「gazさんっていいな」と思ったのは、社員のみなさんの積極性でした。全員がアクティブだから、議論をしても白熱するし、物事が進む進む。あの感じは、本当に良かったです。
吉村：
ありがとうございます。
鎌田：
開発担当者は表に出たがらない人が多いのに、gazさんの開発は、みなさん率先してクライアントと話をしますよね。特に、吉村さんは自ら先頭に立って、陣頭指揮まで取るでしょう？僕、初めて見たときは驚きました。
福井：
特に吉村さんは前に出ますね。私が一緒に仕事をするときは、スケジュールやマネジメントを全部お任せしちゃいます。
吉村：
僕がフロントで調整して、デザインはすべて福井さん、その後は僕に戻って実装。サンドイッチみたいな形で分業しています。
鎌田：
開発でそういう人がいるのは、強いと思いますよ。それに、吉村さんはコミュニケーションが難しい場面でも、相手の意図を紐解けるじゃないですか。相手の言葉が本心なのか、思いつきで言ったことなのかも読み取れるし。
福井：
ありがたいですよ、すごく。
吉村：
僕はデザイナーではありますが、今後はPjMの比率が増えていくと思っています。クライアントとチームメンバーの橋渡しとして、自分たちがスムーズに動ける体制を築きたいですね。
アニメーション性から見た、STUDIOの課題とgazの挑戦
鎌田：
今回、僕は初めてSTUDIOに触れたわけですが、実装期間があまりにも短くて驚きました。
福井：
そうですね、今回は1週間でした。
鎌田：
Webの開発って、普通は1か月必要じゃないですか。それを1週間。嘘でしょって感じでしたよ。そして「このスピードには夢がある」とさえ思いました。
吉村：
だからSTUDIOのスピードを「クライアントへの利益貢献」という点から見ると、開発費の大幅な圧縮につながるんです。通常なら1か月かかる開発を、1週間でできるわけですから。
鎌田：
でも、STUDIOのアニメーション性だと「エモーショナルなWebサイト」は苦手かもしれませんね。エンジニアが丁寧にイージング調整したサイトに比べると、心に響く何かが足りない気がします。
吉村：
STUDIOでも、細かいイージング調整は可能なんです。でも、それをアニメーションのコンポーネントとして登録できないんですよね。複数の要素に同じ表現をさせたければ、ひとつひとつに手動でイージング設定をする必要があるんです。
鎌田：
それじゃ、すごく時間がかかっちゃいますね。
福井：
STUDIOが用意したイージングのテンプレートはあるんですけど、カスタマイズを登録する機能がないんです。それができれば、感情表現の幅が広がるのに。
吉村：
スクロールに合わせたり、奥に行ったり引いたりする動きもできないですし。STUDIOのアニメーションには、まだまだ課題があると思っています。
鎌田：
gazさんにはいずれ「どうやってSTUDIOで作ったの？」と言われるような、限界を超えたものを作ってほしいですね。
福井：
吉村さん、本当に作ったことがあるんですよ。
吉村：
ゲーム関連会社のサイトを作ったときに、アニメーションで電子系のノイズ点滅を再現したんです。
鎌田：
動画でですか？
吉村：
いま話していたイージングで入れました。STUDIOの限界を承知の上で、もう無理やり、強引なくらい大量に。そうしたら、要素がひとつ点滅し始めたんです。あとはそのイージングを、他の要素にもひとつひとつ設定していきました。
福井：
本当にすごかったですよ。STUDIOにはイージングの領域があるんですけど、吉村さんの仕事は、その限界を越えていたと思います。
鎌田：
そんなことできるんですね、STUDIOも吉村さんも。素晴らしい。
吉村：
確かにサイトを出したときは「えっ、これSTUDIOで行けるの？」と、業界でも評判になりました。同業の方がXに「これ見たらもう“STUDIOではできません”なんて言えないよ」とポストしていたくらい、反応は大きかったです。
自らの学びにつながるクライアントワークとは
吉村：
鎌田さんはWebだけじゃなく、リアルのツールやグッズまでデザインしています。仕事の領域が本当に広いですよね。
鎌田：
僕は自分が好きなことや、興味があることなら何でもやっちゃうんです。そうしていたら、自然に世界が広がっていました。Web、グラフィックに3D、モーションデザインや音楽…趣味趣向から領域が多様化した感じです。
福井：
間口の広さがすごいですよね。仕事をするうえで、世界の動きや流行のチェックもしているんですか？
鎌田：
現在のことはあまり意識しませんが、数年後の市場動向といった未来は見据えています。
いま注目しているのは、2024年2月に発売された「Apple Vision Pro」です。まだアメリカ市場だけの販売ですが、今年中には日本にも上陸してきますから。そのタイミングで何かリリースできるように、今は3DCGに力を入れているところです。
吉村：
日本市場で発売するまでの間って、いろいろ準備しておくチャンスですよね。
鎌田：
そうは言っても「先を読みつつ、自分が好きなことをやる」というスタンスは、常に意識しています。
吉村：
鎌田さんが領域を広げていくとき、勉強時間ってどうやって確保しているんですか？
鎌田：
僕はクライアントワークのなかで、新しいことを覚えるんです。わざわざ勉強するための時間を取るなんて、絶対にできませんから。
福井：
わかります。独学で興味領域を広げようとしても、仕事の合間に勉強するのは難しい。それなら、仕事で受けた案件から学んじゃえばいいんですよね。
鎌田：
もちろん、経験したことがない案件を受けるわけですから、本当にできるかなと焦ります。それでひたすら調べて、わからないところは誰かに訊いて進めるわけです。
でも、そうやって頑張ればできるんですよ。できちゃうんです。だから、自分の興味領域を広げるには、考えるより行動することだなと思っています。
福井：
私もクライアントワークの中で、毎回ひとつ「小さい挑戦」をすることに決めています。たとえば、いま手掛けているホテルの案件では「写真」です。自分でホテルの撮影をして、それをサイトの素材に使うつもりなんです。
吉村：
そのチャレンジは、鎌田さんから刺激を受けて始めたんですか？
福井：
はい。同じプロジェクトに入れたおかげで、いろいろなことを学べたと思っています。
デザイナーとして生きる上で「大切にしていること」
吉村：
デザイナーとして活動していく上で、何か「大切にしていること」ってありますか？
鎌田：
僕は「デザインとマジックの融合」です。ただカッコいい、美しいだけのデザインを作るんじゃなくて、ユーモアや感動、驚きみたいな遊び心をプラスすること。実際、僕がSHIFTBRAINでアートディレクションをするときは、必ずそこに隠し要素を入れています。
吉村：
「気づかれないかもしれないけど、見つけてもらえたら楽しい」っていう感じですか？
鎌田：
そういうこと。そして僕は、マジックをやるときにも必ず、お客さんを驚かせる要素を入れるんです。「これに気づいたら、どうリアクションするんだろう」と思いながら。
だから、デザインもマジックもエンターテインメントの一環。僕は常にそのスタンスを持って、デザイナーとして仕事をしています。福井さんはどうでしょう？
福井：
私は「ときにはデザインをしなくてもいい」と思っています。
吉村：
それはどういうこと？
福井：
自分が「今回はここまで目指す」と決めたものができるまで諦めないこと。これは、成長の糧として大切にしています。吉村さんはどうですか？
吉村：
僕は「人との繋がりと情報」ですね。他のデザイナーと知り合って、繋がりを持って、いろいろな話をする。人脈を断たないようにしています。
鎌田：
ああ、確かに。その場その場のカルチャーに溶け込めるのが、吉村さんの強みだなって思います。
吉村：
そのなかで、新しい情報や様々な用語を「知っている」って、すごく重要なことです。デザインの感性を保つためにも、お互いの意図を正確に理解するためにも。だから、情報収集を怠らないことと、人とコミュニケーションを取り続けることを意識しています。
とても名残惜しいんですが、そろそろお時間になってしまいました。
鎌田：
今日はお招きいただき、ありがとうございました。
福井：
こちらこそ、ありがとうございます。すごく素敵な時間でした。
プロフィール
**株式会社SHIFTBRAIN / 執行役員, CDO
鎌田 亮平**
鹿児島県出身。Webサイトから紙媒体まで、ジャンルレスに活動する敏腕デザイナー。小学生時代から舞台に立ってきた、筋金入りのマジシャンでもある。月間30万PVを誇るメディアの運営や、有名媒体の公式ライターを務めるなど、多方面で突出した才能を発揮している。
**株式会社gaz / Designer
福井 春菜**
1997年東京生まれ、フリーランスのデザイナー。2021年4月、福岡への半移住をきっかけにUIデザイナーとしてgazにジョイン。現在は海外で生活しながら、gaz STUDIOでWebデザインを担う他、個人でデザイン制作や講師、教材作成を行っている。
**LAMP LLC. / 株式会社gaz / Web Designer, PjM
吉村 優一**
1994年生まれ、熊本出身。2020年6月よりgaz Inc. のデザイン組織顧問/チーフデザイナーを業務委託で担当。2021年にフリーランスから法人化し「LAMP合同会社」を設立。スタートアップのデザイン領域を支援しながら、CDO、デザインプロダクトマネージャー、クリエイティブディレクター、PjM、WEBデザイナーなど役職をシームレスに変化させながら活動している。
