2024.10.21

巨大プロジェクトの裏に、

もうひとつの物語 [mount inc.]

GYRE渋谷展がローンチされる前、AYANAという大きなプロジェクトに終止符が打たれた。

AYANAに関わった、渡辺、須多、楠本はそれを進行する裏で何度も打ちひしがれ、挫折しそうな時間があった。
のしかかるプレッシャーは、自分の至らなさをさらに浮き彫りにしたのかもしれない。

mount入社歴の浅いメンバーのサイトづくり、素直で、愚直な対談記事です。

メンバー

話し手

渡辺 俊

渡辺 俊

De

須多 望

須多 望

Dev

ファシリテーター

楠本 莉沙

楠本 莉沙

Dir

撮影

劉

目次

無知が故の自信、ちっぽけな自分

楠本

楠本

須多さん、過去は超えましたか?
この案件が始まった時、「リベンジだ」って言ってましたね。

須多

須多

まあ、前よりは動きはいいでしょう、、、前よりはね。雑な動きより洗練されつつある。

渡辺

渡辺

イムさんに見てもらった時も第一印象「おおすげえ」みたいに言ってたね。フィードバックはもちろん受けつつも「やるじゃん」って言ってもらったりはしてたし。

須多

須多

この前は1年目の時だから、2年越しのリベンジかな。
自分的には前よりはちょっと良くなったかなぐらいだけど、
周りの反応は違う気もする。

楠本

楠本

渡辺さんは「チャレンジ」ですよね。

渡辺

渡辺

そうだね。
GYREに関しては、もちろんAD林さんの確認・監修があるとは言え、ある程度はこっちベースで企画の段階から考えたり提案したりっていうのを割と自由にやらせてもらえる環境だった。
そういう意味で、mount入社してから、
一番でかいチャレンジではあるよね。

須多

須多

入社後、初チャレンジですね。

渡辺

渡辺

うん。そして反省が多い。
デザイン自体は、林さんに認めてもらえるくらいのクオリティ、水準には達してるのかなとは思うんだけど、反省の部分の方が多いなと思う。

楠本

楠本

2人とも、やってやったよ感はあまりないですか?

須多

須多

やってやったよ感は出ないっしょ…。
AYANAを知ってるからね。

渡辺

渡辺

まあ単純には比べられない部分はあると思うんだけど、上の人たちの凄さを改めて見ちゃうとみたいのあるよね。

須多

須多

やってやったよ感は、絶対前の方があったんです。
なにも知らなかったからその時は。
無知が故の自信満々でした。

楠本

楠本

mountで2,3年いろんなものを見て、
案件を経験したのちに感じるものは、"やってやったよ感"ではないと。

須多

須多

悔しさが残るような感じですね。

楠本

楠本

目指す位置が高くなったってことですよね。

須多

須多

自分の中の基準が大幅に上がってます、圧倒的に。
だから、自分で作るものがちっぽけに見える。

楠本

楠本

でも、それはすごいことですよね。

満足できない場所に居られることって、相当恵まれてます。

鬼のフィードバック、千本ノック

1ピクセルのグリッド + 大量写真

楠本

楠本

ちっぽけでも最大限の力を出したと思います。何をして、何が印象的でしたか?

渡辺

渡辺

質問と少しズレるけど、この案件のいいなと思ったことをまず言いたくて。
他の案件は方針・企画を決定するのがCDやADで、関わるメンバーに広さや場所が違っても裁量をそれぞれ与えられる。
今回は本当に最初の段階からみんなでやったから、全員で何か一つのものを作るっていうことをより感じたっていうのが、良かったんだよね。

楠本

楠本

今、わたしはすごく嬉しいです、、、。
チームで成し遂げたことをあげていただいたので。

渡辺

渡辺

なんかね、この案件の良さだなと思ってるんだよ。
デザインでは、グリッドを細かくやったっていうのはこだわりのポイント。あそこまで細かく緻密にやったのは、初めてかもしれない。
細かくマス目の線引いてて、そこにピタっと文字も写真もはめてって須多くんには依頼したね。

1pxのグリッドに写真と文字を
須多

須多

骨が折れるデザインですね、実装側からすると。

渡辺

渡辺

実装も大変ポイントそこだったんじゃないかなと。

須多

須多

細かいグリッド+大量写真っていうひとつでも重量級のものがダブルパンチだったので…しんどいですよ。

楠本

楠本

WebGLの話はみなさん聞きたいんじゃないですかね。

須多

須多

いや、簡単なことしかしてないので誰でも引けます。誰でも引ける方向でやってるから重い説がある。特殊なことは何もしていないんですよね。。。

渡辺

渡辺

大したことないと思ってても、周りから見ればおおってなるのをやってるんじゃないのかなと思ったり。

須多

須多

モザイクの最大値がマス、グリッドに全部沿ってるのはこだわりです。あと、スクロールするとき、一緒にグリッドは動かずに止まってて、文字とか写真だけがstickyで動かしてる。画面の高さの真ん中でstickyが始まるようにもしています。
1ピクセルのグリッドに文字がカチってはまる、
その些細な気持ちよさもあります。
細かいけどこの繊細さがmountらしさかな、と。完璧では無いですが…

モザイクの最大値と文字がグリッドにカチッとはまる

夜中、TD岡部さんへ電話…

楠本

楠本

大量の写真は、いちばん最初に検証しましたね。

須多

須多

甘く見ていました。
甘く見すぎていたし、画像だけじゃないやっぱり文字が入ってくると全然違ってくる。画像メインでテキストが多くなければ、もしかしたら少し軽くなるかもしれない。WebGLを使ってるから画像は割と軽やかには動くけど、その他の部分が大量にあるからパフォーマンスが思うようにいかなかったです。

楠本

楠本

いろんな要因を含めてどうやって大量の写真を出すか、を考えられてると変わってたかもしれないですかね。

須多

須多

反省点はそこかな。初めてだからなにもわかんなかった。次からはもっとやりようが、選択肢は増えました。

楠本

楠本

mountは、文字も写真もどちらも妥協をしないじゃないですか。だからその選択肢は、これからどの案件でも生かされそうですね。

須多

須多

マウントイズム ですね。

楠本

楠本

あ、一夜にしてスマホのバグを改善したことは言いたいです。

須多

須多

一夜の絶望的な状況からスマホでちゃんと表示されるっていう、1年前だとできてないと思う。公開できるレベルまでこの期間じゃ達成できてない気がするし、大量画像の表示されない解決策も思い浮かんでないです。
夜中、岡部さんに電話せず解決できたのはでかいかな。

楠本

楠本

(笑)迷いましたもんね、岡部さん起きてるかもしれないからって。

軌道の模索は、最後の最後まで

画像の位置指定
楠本

楠本

画像すべて実装側で位置指定をしていて、さらに動く道順も決まってますか?

須多

須多

道順は近いところ。次の切り替わる写真の近いポイントに上か下か右か左かランダムで到達するようになっています。最初はランダムにやってたけど、近い距離だから1回上下左右へ移動したら到達です。

渡辺

渡辺

ゴールみたいのを決めて、そこからこうヒュッて移動していく?

須多

須多

そうです。今自分がいる左上基準でトップレフトから、ターゲットとなる次切り替わる画像のトップレフトまで、斜め移動はなしで左右上下どっちかに1回目は目指してる。最短で2回、1回曲がるで到達ですね。最初はもう遠回りしてやってたけど、それはごちゃごちゃしすぎてやめました。

渡辺

渡辺

一枚一枚の画像に指定してるみたいな感じ?

須多

須多

指定はしてないです。その場で自分の情報がわかるじゃないですか。ターゲットの情報は、次の決められたこのレイアウトから、今の自分の距離(ディスタンス)を測って、近いところを取ってます。取った中からそいつはもう選べないから、抜いていく。一個ずつ減っていくっていう、ゲームとかでよくあるのかな?経路探索みたいなものかもしれません。

カオス

フォトグラファー金本 凛太朗さんが撮った写真
楠本

楠本

コンセプトととして立たせたのは、「カオス」。渋谷のカオスって何だろう?を突き詰めたりしつつ、グリッドは設計図をオマージュしましたね。

渡辺

渡辺

自分の中の反省点としては、カオスって言葉にちょっと引っ張られすぎちゃってたのが良くなくて。

楠本

楠本

綺麗にレイアウトされている部分と混沌としている部分の混ざり合い = カオスでもありましたね。

渡辺

渡辺

うん、そうだね。なんかカオスっていうともっと広く、もっと混沌としてドロドロとしているみたいになっちゃって。

楠本

楠本

人それぞれでカオスへの定義が幅広すぎるから、難しかったですね。今回表現した渋谷は、まさに理想の渋谷のカオス感。実装の演出では、簡単に変容していく今の渋谷の様子を表現しましたね。

須多

須多

きっちり型にはめられてもそう簡単に渋谷のカオスはなくならない。今は、区画が整理されていってるけど渋谷のカオスは残せるよね?ってメッセージ。
型にはめ込まれて一見きっちり見えても、渋谷の良さはそう簡単になくならないですよね。

渡辺

渡辺

いろんな写真が組み合わさってると思うんだけど、まさに渋谷ってそういう街。いろんな文化とかカルチャーが混ざり合ってできていたね。

フォトグラファーは自分

弊社デザイナー 劉が撮影した写真
楠本

楠本

自分たちがフォトグラファーとして、ロケもしたじゃないですか。劉さんと渡辺さんの写真がいい味を出したんじゃないかと思います。どうですか、WEBサイトに反映されて。

劉

いや、光栄ですね。楽しかったです。

渡辺

渡辺

純粋にストレスなく楽しめたのって、なんか写真撮ってる時だったな。デザインとかはいろんなフィードバック受けるからさ、もう当たり前なんだけど、、

1500枚の写真から未来都市渋谷を作る

継ぎ接ぎでつくった未来都市渋谷
楠本

楠本

私が1500枚の写真をみて、コラージュで空想の渋谷作れるんじゃない?って言ったのが地獄の始まりでしたかね...

劉

はい(笑)頭の中で渋谷像みたいなものが人それぞれあると思っていて、そういう曖昧な渋谷というか、リアルの渋谷ではないもの。写真はリアルですけど、、、

楠本

楠本

ロケハンも数回、本番の撮影は丸一日、ほぼ夜中まで撮影をお願いしました。
だから今の渋谷のリアルが、一枚一枚の写真には写ってあるけど、それらをコラージュしていくと、空想の渋谷ができていて、これが未来都市渋谷を示唆するのか....ですよね。

劉

そうです!

渡辺

渡辺

これまで話して思ったのは、反省点、もっとこうできたんだろうとかはあるんだけど、現時点のレベルの限界までは、やり遂げたんじゃないかな。

昨日の自分は超えていく

楠本

楠本

冒頭でリベンジとチャレンジの話をしましたよね。
去年の自分を超えられた!みたいな瞬間はありましたか?

須多

須多

毎日常に超えてるんじゃない?1日前の自分は、
常に超えてますよ。昨日の自分より長く生きてるわけだから、それは超えていかないと。
mountの一員として昨日の自分は超えて、日々成長です。

楠本

楠本

デザイナー的にはどうでしょう。mountは、デザインに対する社内評価も厳しいです。

渡辺

渡辺

一個言えるのは、mountにいなかったらここまでやらなかったと思う。mountの求めるレベルを知ったからこそ、できている。そういう意味で、成長はできたのかなと思います。

実装が盛り付けなら、デザインは…

楠本

楠本

次はこれがしたい!こうなっていたい!はあるのでしょうか。

須多

須多

今回の派手な表現・動きってごまかしが効くんです。地味な実装でも「なんかいい」ってなるのが一番。派手な動きは、それなりに「おお、すごい」ってなるから。今回も割と動きがあるから、実装とデザインが半々ぐらいで成り立ってます。
本当はデザインで90%ぐらい出来上がってて、それをもっと良くする10%か15%かが実装。それができたらプロ、巧みだと思うんです。

ほぼ完成形のデザインを蛇足じゃなく、これあった方が絶対いいっていう動きかできるのがいい。デザインを、より飛躍させる実装者になりたいです。

楠本

楠本

50%のデザインを100%にするんじゃなく、100%のデザインがあって、それをどこまで150%まで持っていけるかが理想であると。だから、1ピクセルまでもを再現するのは当たり前で、さらに良く見えるように、何を付け足していくか...

須多

須多

そう、まだ100を100へもまだ至ってない部分はあるんですけど、100を101、102、103...って、実装は最後の盛り付けなんです。味(デザイン)はもう美味しいに決まってるんです。で、さらにどう盛り付ける(実装する)かで食べる人の評価はより上がる。デザインの方がすごいんだよ、ゼロから作るから。

楠本

楠本

デザインが100であるっていうことは信じ切っている状態ですね。実装が盛り付けなら、デザインは何でしょう。

渡辺

渡辺

ものさし無しに書いていく設計図みたいなことかな?今回の案件で思ったんだけど、動きの部分で想像しきれない部分があるのはやっぱ良くないなと思って。動きの部分でこうしよう、ああしようっていうので対等に話がしたいと思ってるんだよね。

楠本

楠本

対等でなければいけないですよね。どちらかが上に行くと、どちらかの意見が拾えなくなると思うんです。実装の動きでどうにかなったデザインじゃなくて、デザインがあったから実装がこうもっと新しい何かを生み出せるという、相乗効果なのかなって。

須多

須多

なんでこの動きにするかとか、なんでこう動かさなきゃならないかっていう理由があって、皆さんはデザインしてますよね。

楠本

楠本

あと、信頼関係はすごく大事なもの。

「やるじゃん」 って言われたい

楠本

楠本

誰に評価されたい、誰の言葉を一番に聞きたいですか。

渡辺

渡辺

やっぱり同じ社内の人間で、さらに言えば、林さん米道さんとかイムさんとか。あとなんだろう、SNSとかで「すごいデザインじゃん」みたいに言ってもらえたら、テンション上がるよね。

楠本

楠本

でも一番は社内の声が、、ですもんね。

渡辺

渡辺

うん。上の人たちのレベルを知っちゃってるからこそ、この人たちに評価されたいみたいなのってあると思うんだよね。すごさを目の当たりにしているからこそ、「やるじゃん」って言われたい。

楠本

楠本

そのたった一言を、渇望しますね。
実装的にはどうですか?

須多

須多

前のGYREの案件は割と引用で、インタラクションとか強い会社の方が反応くれたり、嬉しかったです。

渡辺

渡辺

同じ業種の人に、「こいつやべえ、やるじゃん」って思われるの嬉しいね。

須多

須多

見られたくない反面もある。これ見られて大丈夫なのか?って常々どのサイトを公開しても見てほしいと見られたくないの気持ちはどっちもあります。見られたくない方が強いかも。

ちょっと特殊な動きとか、センスが問われるじゃないけど、実装者のセンスが一番出るところの至らなさを言われたくない...。自分でも未熟さをわかってるから。

楠本

楠本

TD 梅津さんからの一言は期待しないですか?

須多

須多

梅津さんには見られたくないな....

本当に最後、無事にローンチされるのか今日の今日まで何も確信がない状態でした。何より、リベンジもチャレンジもどうか成し遂げられるといいなとそう思えば思うほど、きつく言葉を発した日があったかもしれません。
「素直さ」が大事だとどの場面でもそう思うけれど、今回はさらにそれを感じます。ものづくりへの、人への、「素直さ」をこれからも持ち続けていきたいと、自戒を込めて。

2024/10/21 Edit : 楠本 莉沙(mount inc.)

つくることではなく、課題の解決が目的です。ぜひお悩みからお聞かせください。

お問い合わせ