業界で金融や物流企業の基幹システムをJavaで作る仕事からキャリアをスタート。経歴:サイバーエージェント、クックパッドなどで様々な新規サービスの立ち上げ、運用に従事。Stripe.Inc、株式会社マナボ、など多数の企業のプロダクトのデザインやデザイナーの育成に携わる。特技はイラストで、本の挿絵なども手がける。フロントエンドエンジニアの本音企画後編!西垣:今回はフロントエンドを中心に開発されている土谷さんにインタビューをしようというコーナーの後編です!今回は、「デザイナーからみたフロントエンドエンジニア」というテーマで進めていければと思います。経歴:大学時代に映画「ソーシャルネットワーク」をみてエンジニアを志す。新卒でHRテックのベンチャー企業に入社し、新規事業の開発を中心に担当。開発言語オタクで、言語の思想などに思いを馳せるのが好き。Dart(Flutter)。...https://www.wantedly.com/companies/residence-corp/post_articles/150003デザインデータは正解ではない。議論を通して完成形を目指す早速ですが、私と進める上でやりやすいところとやりにくいところを教えてください(笑)土谷:まるで今なにか問題があるかのような質問ですね(笑)西垣:問題、ありますか?!土谷:いまは、ないですね。ないと思っているんですけど(笑)西垣:ですよね!!よかった〜〜〜土谷:やりやすいところは、いま開発体制としてデザインの部分と実装の部分が綺麗に分かれていて、そこでの衝突がないというのは非常にやりやすいですね。私のデザインを実装に落とし込む上でのやりにくさは特にないですか?要求水準が高すぎるとか。前編の方で「フロントエンドは実装とデザインの妥協点を見つけるのが仕事」みたいな話もあったと思うのですが、妥協点を探る上で発生するコミュニケーションのやりにくさはありますか?土谷:むしろコミュニケーションの面ではすごくやりやすいと感じています。デザインとしてこうするのが正解というのは示しつつ、実装の観点からするとこういう配置の方がやりやすいとか、こうした方が矛盾がないという提案を僕からすることが多いのですが、かなり柔軟に受け止めてもらえていますね。西垣:それはわたしも同じくやりやすさを感じている部分ですね。考えてデザインを作るのですが、それが正解でその通りに実装してほしいとは思っていないんですよ。私はエンジニアリングのことは詳しくないので、実装の観点から見た組みやすさ等は提案いただけるとそうだなと思いますし、今後運用していきやすいほうがいいと思うので。土谷:西垣さんが最初に理想像を作って、その後対立するのではなくて、理想像に向かってディスカッションすることができています。それが完成形ではないというのをお互いに理解しているのがいいですね。西垣:とはいえ、使いやすさの観点から譲れない部分があるケースもあって、そういう時は激しめのディスカッションになることもあるのですが(笑)土谷:ありますね(笑)ちょっとバチバチするやつ。西垣:そういう時に、私だけが強く主張するのではなく、土谷さんの方からもしっかり意見が返ってくるのがとてもありがたいです!どちらか一方が強く主張すると、引かれてしまって何も言えなくなるというのが一番良くないと思っているので。あの人怒らせたら怖いから黙ってよとか、最悪ですよね(笑)西垣:きちんとお互いが「これならいいよね」という落とし所を見つけられて、かつその後一切引きずらないようにやれているのがいいです。土谷:確かに一切引きずらないですね。翌日にはすっかり忘れているという。翌日といわず1時間で忘れてますね。(笑)西垣:会話がしっかりと出来ているので、なぜそうなるのかをしっかり理解した上で前に進めるので、不満もたまらないです。土谷:あくまで人間対人間というよりはプロダクトの方に向かってディスカッションをしているだけなので。人格攻撃とかはないですし、だからこそ引きずらないんでしょうね。西垣:人格を攻撃されたなんて思ったこと一度もないです。(笑)名前をつけてコンポーネントの粒度を揃える。化の作業をしている時に私と土谷さんの間でコンポーネント*に対する粒度が違うという話があったじゃないですか。私はどちらかと言うと見た目的にくくりやすいグループでコンポーネントを組みがちで、土谷さんは機能的に似ているものをグルーピングしてコンポーネントを作りがちでと。これの何が問題かと言うと、なにかコンポーネントを作る時に、複数の画面で汎用的に使われることを想定して作るのか、うちのドメインの話でいうとビザの申請の段階を表すことに特化したコンポーネントとして作るのかだと作り方も大分違って来るのですが、この認識がずれがちであったと。1個の画面のデザインデータを見た時に、そのコンポーネントが共通的に使われるものか、その画面に特化したものとして使われるのかを実装を担当する側とデザイナーの間で認識をすり合わせて進める必要があったんです。bar」という名前になるのかで、ある程度そのコンポーネントが汎用性を持ったものなのか特定の使われ方を想定されているのかが分かると。西垣:コンポーネントに命名するようになってから割と認識がずれなくなった気がします。*コンポーネントとは:要素、シンボルなどとも呼ばれる。考え方を参考にしてみたことがあるんです。Design:http://atomicdesign.bradfrost.com/土谷:そうそう、試行錯誤しましたね。「これさえ守ればコミュニケーションをしなくても意思の疎通が図れる」ようなコミュニケーションコストを下げる「銀の弾丸」を期待していたんです。枠組みを提供してくれるけれど、コミュニケーションをなくすようなものではないですよね。土谷:そうでしたね、原典でもコンポーネントの粒度の話だけではなくワークフローを含むコラボレーションについても触れられています。結局、会話を避けては通れないというところに立ち戻り、今は最初にしっかり話をしてから進めるようにしています。参考にコンポーネントの分類を定義して文書化しました。西垣:対面で一つの画面を見ながらコンポーネントを分類したり、コンポーネントの名前を言い合ってます。土谷:議論から逃げないチームになってきている感はありますね。西垣:あと、「お約束」というドキュメントにチームで話した内容はまとめられてるじゃないですか。あれ私いいと思います土谷:一度課題に直面して、解決までたどり着いた方法や、上手くいかなかった方法をまとめる文章を作っています。これは全員の合意を元に作っていますね。開発ってまだ決まってないことが多いじゃないですか。何が正しいというわけじゃないんですが、こうしたほうが後々やりやすいであろうというものに関しては予め決めておくようにしています。モーダルウィンドウとか、デバイスのサイズごとの表示をどうするかとか、割と全般的に影響するものに関しては最初の段階でかっちり決めていますね。採用していることもあって、担当領域が明確に分かれています。作るバックエンドがいて、デザインを起こすデザイナーがいて、フロントエンドエンジニアは丁度その中間です。側、デザイン側とのコミュニケーションは避けて通れません。そこに対して臆さず行く人がいいですね。西垣:会話をしてくれて、ディスカッションが出来ることは必須ですね。なんだかんだスタートアップで何もかも整備されているわけではないので、すでにあるものに疑問を感じない人ではなく、どんどん疑問を持って変えていける人がいいですね。モダンなフロントエンドを実装したいという人にはうってつけだと思いますね。いうのはなかなかないと思うので、面白いと思います。visaでは現在一緒に働いてくれるエンジニアを大募集中です!興味がある人はまずは気軽にオフィスに遊びにきてみませんか?以下の代表インタビューと開発メンバーの座談会記事も是非ご覧ください。visa私は日本人の父とペルー人の母の間にハーフとして生まれて、幼少期をペルーで過ごしました。ペルーは日本ほど発展した国ではなく、当時の私の身近な職業といえばタクシーの運転手や市場のお兄さんなど。あのままペルーにずっといたとしたら、将来の選択肢としてそうした限られた職業しか想像できなかったと思います。先進国以外の人たちは、まず情報にアクセスする術が限られている。...https://www.wantedly.com/companies/residence-corp/post_articles/130473「実装で頑張らない。経歴:大学時代に映画「ソーシャルネットワーク」をみてエンジニアを志す。新卒でHRテックのベンチャー企業に入社し、新規事業の開発を中心に担当。開発言語オタクで、言語の思想などに思いを馳せるのが好き。趣味でScala、Golang、Kotlinなど最新の技術を使う。現在はCOOとして、社長がやらないことは全部やるスタンスで仕事をしています。フロントエンドエンジニアものつくりを愛するフロントエンドエンジニアです。企業にて様々なサービス、ゲームのキャラクターデザイン、イラスト制作、UIデザインを行う。「世界から国境をなくす」というミッションを掲げ、世界中の人々が物理的・心理的な国境を感じることなく、自分が生活する場所を選択できる世界を実現するスタートアップ企業です。visa」を提供しています。ビザの申請には知識、時間、そしてお金が必要ですが、これは外国人の多くにとって障壁になっています。使うことで、ビザに関する知識がなくても短時間でビザの取得が可能です。分ほどで作成できます。2018年12月に新設された「特定技能」ビザにいち早く対応した海外人材の来日・定住を支援するサービスも展開しています。2018年8月から、すでにカンボジアで授業料無料の日本語学校を運営し、日本で働きたい現地人材の日本語能力を短期間で高めるチャレンジを行ってきました。来日後のサポートとして株式会社セブン銀行と提携し、来日とほぼ同時に銀行口座を開設できる仕組みを構築しています。将来的には、ビザ情報を基軸にした外国籍の人たちの信用スコアを構築し、信用不足によりクレジットカードを作ることが難しかったり、住む家が少ないといった問題を解決していきます。HUFFPOST「「日本は憧れの国のままでいてほしいから」。