いつも新しい技術を試したくてウズウズしている

木村浩康さん（以下、木村）：シフトブレインといえば、コーポレートサイトを数多くつくっているイメージがあります。普通、コーポレートサイトはどうしてもフラットというか、おもしろくないものになってしまうけど、それをシフトブレインがつくると、インタラクションがいちいち気が利いたものだったり、メニューを開いた時の発見があったり。マイクロインタラクションのように、僕らが力を入れられないところに、イイ感じの力の入れ方がある。それがすごいと思っているんですよね。

鈴木慶太朗さん（以下、鈴木）：シフトブレイン社内は、ディレクター、デザイナー、デベロッパーと3つの部署に分かれているんですが、デザイナーとデベロッパーが同等にサイト構成について意見できる強みがあると思います。シフトブレインには、企画やデザイン段階から開発者と一緒につくっていくという文化があるんです。レイアウト時から相談しておくと、プログラムの方でも工夫してくれる。デザインにコミットする意識があるというか、「こういう動きの方がいいよ」と提案してくれる。

鈴木慶太朗
1984年生まれ。東京出身、2児の父。立教大学経済学部卒。大学在学時にグラフィックデザインを学ぶ。制作会社数社を経て、現在はシフトブレインでデザインディレクターとして勤務し、オランダ支店のマネージャー。ブランドディレクションからのビジュアルコミュニケーション設計をベースに、クロスメディアプラットフォームに対応したデザインディレクション、デザイン、UXやUIの設計を行っている。世界的なWebデザインアワード、Awwwards審査メンバーを2013年から務めている。

木村：それは素晴らしいですね！普通のデザイナーとデベロッパーのコミュニケーションだと、トラディショナルな画面遷移の場合、何か加えようというより「それはできない」となってしまうことが多いですからね。

鈴木：例えばこのデンソーのサイトも、プログラマからの提案が元でレイアウトを現状のカタチにしています。

木村：このデンソーのサイトはすごく良いなと思いました！斜めのトランジションが気持ちよかった。

鈴木：実は、最初は縦型のトランジションだったんです。そこで「なんか普通じゃないですか？」と言われて、じゃあ斜めにしてみよう、と。結果、デンソーのロゴがリニューアルされたということを刷り込むためにも良いアイデアでした。動画からブランドのビジョンや、未来をどうしたいのか？いま持ってる資産はなにか？という要素が伝わりやすい構成にしているんです。

木村：僕のイメージでは、シフトブレインの仕事は派手とか地味というレベルを越えているんですよね。例え地味なサイトでも、なにかしらチャレンジしているアウトプットの仕方がすごい会社だという印象です。

鈴木：開発サイドでは、いつも「新しい技術を試したい」と思ってウズウズしているんです。最近ではPR・キャンペーンサイトが減ったので、あまり新しい表現を試す機会がないんですが。そこで“こっそり入れる”ということはしていますね。

——鈴木さんにとって、ターニングポイントになった仕事はありますか？

鈴木：僕というか、会社自体のターニングポイントになったのは、パナソニックのメンズシェーバー「LAMDASH（ラムダッシュ）」のサイトですね。タイミングよく広がって、そこから会社自体のいろんなお仕事が増えました。当時は丁度flashが役割を終えて、これからどうしよう……というタイミングで。制作期間は1か月ぐらいでしょうか。キャンバスやJSで、flashがなくてもiPhoneでも動く、というサイトをかなり頑張ってつくりました。

木村：当時は、業界がflash一色だった状況から脱却を図っている過渡期で、「LAMDASH」はflashを使わなくても、遜色ない表現ができるんだと驚いた記憶があります。

クライアントを満足させながら好きなことをやる

木村：ちなみに、僕がいちばん衝撃を受けたのはPICSのサイトでした。ハンバーガーメニューを開いたら全部GLになるなんて、「ここで使うのか！」とすごく驚かされたんです。

鈴木：PICSのサイトも、ブランドの変化のタイミングでご依頼いただいたお仕事です。ロゴを変えたい、だからWebも変えようというお話で。そこで「PICSは真面目な会社になるつもりなんです」とおっしゃっていたんですが、つくっているものは全然真面目じゃなくて、むしろおもしろいものでしょうと（笑）。経営陣が考える会社の方針と、実際にクリエイターたちがつくっているものの乖離がすごくおもしろかった。その裏表をちゃんと出しましょうということで、表側はしっかり情報設計してあって比較的シンプルなデザイン、その裏に行くといろんな色の血が混ざり合う個性的なリキッドの表現という構成にしたんです。

木村：そんなコンセプトがあったとは……。所属クリエイター紹介の画面もおもしろいですよね。

鈴木：PICSはクリエイターが所属制なので、すごく個性がバラバラなんです。だから、リキッド表現でいろんな色を混ぜてみたらいいんじゃない？と提案しました。「PEOPLE」では一度、ロゴの中の矢印の方向に全員の顔を向かせて、ホバーするとみんなの個性を出すという裏コンセプトがあります。これも表は真面目に見えて、裏では個性的というコンセプトを踏襲しています。

木村：こういうところにもフォトディレクションが入ってるんですねー。

鈴木：フォトグラファーはPICSが用意してくれて、僕は「とりあえず横顔と前のおもしろいところを撮ってください」とお願いしたくらいです。結果的に素材としてビックリするくらいおもしろくて、すごいのが来ちゃったなと思いましたが（笑）。

木村：クライアントを満足させる対応の部分と、自分たちのチャレンジするモチベーションの発散の分散の仕方に、「なるほど」と思いますね。

鈴木：自分たちのやりたいことが比較的できているのかもしれないですね。好きなことをやらせてもらったといえば、この「DRAFT」のサイトもそうでした。PICSもそうだったんですが、DRAFTもオフィスの引っ越しのタイミングでのご相談でした。ブランドイメージを一新するので、一緒に考えて欲しいというオファーだったんです。四谷から表参道にオフィスを移転するタイミングで、「ロゴは変えない」とおっしゃっていたので、コーポレートカラーやVIを変えましょうと提案したんです。

木村：これもトランジションがすごく気持ちいいですね。しかも大胆にレイアウトされているのに裏側は動的な更新性も担保されているんだろうなと。

鈴木：これは多分Reactかな？デベロッパーチームに伝えたのは、「ものすごくシームレスにしよう」ということでした。企業のトーン＆マナーをイチから考えたので、写真や動画などの素材にはすごくこだわりましたね。手描きのタイポグラフィは、ブラジルのレタリングデザインスタジオ（Anchor Supply）に依頼してつくっています。オフィスの写真も一から撮影して使うので、トーンの統一にもすごく気を使いました。「COMPANY」系の写真は全部人を入れて会社の空気感がわかるようにして、「WORKS」の方は人もいるけど、実績が立つようにちょっとドライにして、実績もオフィスデザインを全面に出したパキーンとした遠近法ではなく、“きちんとした人がいる”印象のものにしようと。

さらに動画のチームを紹介して、ブランドムービーをつくったり、引っ越しの過程を全部撮影したり……新しく設計した家具をつくるところについていったり。コンテンツの中身にもかなり力を入れています。

——そこまで関わっていたんですね！すごく元気のある会社なので、サイトにもそれが現れていますね。

木村：鈴木さんは撮影のディレクションもされるんですか？僕自身はいわゆるスタジオなどでの撮影よりも、ジェネレーティブなグラフィックをモチーフとして使うことが多いんです。ライゾマティクスに依頼される案件では特に、そういうものが期待されているということもありますし。写真で間を持たせるのもひとつの正解だけど、僕がグラフィックデザインでゼロから１を生む方法として、データに基づいたビジュアライゼーションを選択する場合が多いので。

鈴木：僕は撮影好きですよ。とりあえずロケ行きたい！って、どうやって旅行に行くかばっかり考えてますよ（笑）。ディレクションもそれほど細かくするわけではなく、カメラマンには画角の指定くらいで、コンセプトだけ伝えてほとんどお任せしちゃいます。予算がないときは自分で撮影してしまうこともあります。

木村：うーん。力点が全然違う。

鈴木：Yahoo! JAPANのリクルートサイトでは、映像は全部僕が撮りました。スチルのカメラマンがインタビューの写真を撮影している時に暇なので、撮影しておいたんです。Webの背景に使う飾り系くらいだったら、僕の映像でも十分使えます。

木村：飾り系のつくり方が全然違いますね。僕だったら絶対データを探してます！

鈴木：Yahoo! JAPANのリクルートサイトは、「エンジニアが興味を持って、応募して欲しい」というリクエストでした。それまでのサイトが元気いっぱい系だったので、もうちょっとデベロッパー受けするテンションにしようと。落ち着いたコンセプトをつくって、Yahoo! JAPANの「!」が表現する驚きや遊び心を表現するために、小技を効かせていく。社員のポートレートを全方向から撮影してくるくる回してみたり。

木村：鈴木さんたちは、クライアントワークとしてのサービスの提供の仕方と、作家性という面で「どこに力点を入れるのか？」という注力バランスがすごくいいから、コーポレートサイトであってもユニークに見えるんでしょうね。

独学でスタートしたWebデザイナーのキャリア

——改めて鈴木さんご自身のキャリアについて教えていただけますか？

鈴木：大学時代からWebデザインをはじめました。美大には行ってないんですが、大学時代に1年だけ専門学校に行ってグラフィックデザインを勉強したんです。その頃から知り合いづてに、Webデザインの仕事をするようになりました。

木村：Webって独学の人が多いですよね。グラフィックみたいに、どこかのプロダクションで修行積んで独立する、というレールはWebにはないので。最初はflashでしたか？

鈴木：flashは触ってません。世間で盛り上がっていた頃はすでにデザインだけをやっていたので。

木村：僕はflashを経由してるんです。まるでIllustratorみたいなUIじゃないですか。黒い矢印が左上にあると落ち着くんですよね。デザイナーにとっては、そこからはじめればタイムラインの概念を覚えられて、さらに上のプログラムの壁にぶつかっていくことができる、という階段がきれいに出来ていた。いまはそういう階段がないので、デザイナーがプログラムを覚えるのは大変だと思います。

鈴木：最近は新しいツールもあまり使っていませんが……Sketchには少し興味があります。プラグインが強力で、アニメーション系のアプリとも親和性があり、プロトタイプを制作して進めることができるので、クライアント確認も速いでしょうし。海外ではSketchはかなりメインストリームになってきますよね。だから、最近Sketchっぽいデザインが多い。

木村：Sketchっぽいデザインってあるんですね。

鈴木：矩形が置いてあるようなデザインのものは、大体そうだと思います。

——いま、シフトブレインには何人くらい在籍しているですか？

鈴木：CEO含めて全員で20人です。デザイナー・開発・ディレクターが各5人、開発はフロントもバックも両方います。僕が担当しているのは、Webからはじまって、ロゴも全部つくり直したいというようなご要望ですね。そのパターンは近年すごく増えました。

木村：時代が来てる！Webの時代が来てますね！

鈴木：ロゴをつくるとなると、結局全部つくることになりますよね。トーン＆マナーを決めなければならないから、そこを起点にすると、いろいろなデザインが付随してくる。

木村：僕もいま、リノベーション施設のオープンに携わる仕事をしているんですが、クライアントは「とにかくWebが大事だ」とおっしゃいますね。カタログをつくっても配る先が限られる、知ってもらう、発信することができるからWebから全部つくりたいと。

鈴木：昔は紙の会社案内をWebにして欲しい、という依頼のパターンが多かったですが、いまは随分変わりましたね。

木村：ところで、Webデザイン業界同士のつながりってあるんですか？

鈴木：ありますよ。会社を越えて、デザイナー同士の繋がりがあるので、飲み会とかよくやってます。

木村：え…！？そうなんですか！知らなかった。今度あったら呼んでください……。

鈴木：お呼びします（笑）。

構成・文／齋藤あきこ　 撮影：Gottingham　 編集：瀬尾陽（JDN）

SHIFTBRAIN Inc.
http://www.shiftbrain.com/