Howを提供するために「なんでもする」のがお仕事　LINE GTでWebテクニカルディレクターになるには

LINE Growth Technologyとは

藤井隆史氏（以下、藤井）：LINEにおけるWebディレクターの役割というテーマでお話ししたいと思います。LINE Growth Technologyの藤井と申します。よろしくお願いします。

まず自己紹介ですが、現在LINE Growth TechnologyでWebテクニカルディレクターとして働いています。もともと新卒でベンチャー企業に入社し、なんでもやった後、もう少しやれること絞りたいなと思い、Web制作会社にフロントエンドエンジニアとして転職しました。

その後、もう1社でマーケティングやブランディングを学んで、2018年の年末にLINE Growth Technologyに入社しました。

まずはLINE Growth Technologyの紹介をします。以後GTと略します。

GTはエンジニア組織で、LINEのサービスを1から10、10から100と成長させるような開発に専門的に関わります。この図でいう、左側の運営をスムーズにする部分を、GTではエンドユーザーが見ることのできない内側の領域と呼んでいますが、そういった領域と、既存サービスの改善など、ユーザーが感じられる外側の領域の2つの領域に、私たちGTは関わっています。

運用を担当する組織というわけではなく、LINEのサービス横断で使用される全社ツールだったり、サービスの運用担当者が使用するツールを開発しています。

つまり、GTとLINE株式会社の違いは、LINE側は基本的には1つのサービスにコミットし続けて、新サービスを立ち上げることがメインとなります。GTは、さまざまなサービスに横断的に参加して、サービスを成長させるための開発がメインになります。

ちなみに、ディレクターの場合ですが、LINEではメディアの記事だったり、スタンプなどのコンテンツ企画をやるポジションが多いです。一方GTのディレクターは、サービスだけではなくてエンジニアをもたない組織へのコミットが多いと思っています。

なぜWebディレクターが必要なのか

なぜLINEにWebディレクターが必要なのかを、僕なりに説明したいと思います。

そもそもLINEグループの業務における僕たちGTのWebディレクターの動き方としては、そこまで制作会社の時と変わらず、依頼が来て、チームを作って、進行管理したり、ワイヤーフレームを引き仕様を決めて、デザインと開発ができるところまで進め、リリースを見守るといった動きをしています。

サイボウズさんとGTで違うところは、サイボウズさんは、外の制作会社とやりとりするといっていましたが、GTは外の制作会社とやることがあまりなく、社内の業務委託を含めたエンジニアとやることが多いです。

事業会社にWebディレクターは必要なの？という点では、ちょっと主観ではありますが、周りの話を聞く限りでは、欲しいけど雇う余裕がないのかな、というのが印象として強いです。

それはやはり、ディレクターは暇な時間が生じやすくて、ディレクター職だけだと進捗を生みづらいことが大きいのかなと。いろいろ兼任している人も多く、最近は副業で、エンジニアやデザイナーがディレクターをやっているスタートアップの話も耳にします。

ディレクターは兼務しやすいため、必要なポジションではあるものの、Webディレクターだけで存在するには相当なバリューが必要なんじゃないかなと思います。

ではLINEグループにはなぜディレクターが必要なのかというと、LINEでは毎年たくさんのサービスや企画が生まれ、常になんらかのプロジェクトが動いています。例えば、大小問わずキャンペーンや、子会社のページ制作などの更新ですかね。

次に、大きな会社なので、エンジニア部隊をもっていない部署が意外と多く、Webを使って解決したい課題が、けっこう、そこここに落ちています。

最後が最も大きい要因だと感じていますが、PMやマーケティング担当は複数のプロジェクトを進行させているうえ、全員が全員Web制作の詳しい知識をもっているわけではないので、意外とWebディレクターが重宝されるのかなと。

つまり、大きい会社がゆえに常に何か仕事があって、それについて詳しい人が足りていない事情というのがあります。なので、LINEグループにおいてWebディレクターが活躍する場面はそれなりに多いと考えています。

Webテクニカルディレクターは何をしているのか

次に、GTのWebテクニカルディレクターとは何をしているのか。僕の思いを交えてお話しします。

そもそもどこをGrowthさせるのか。GTとして、サービスのGrowthと組織のGrowthに携わることは、今は半々かなと思います。

組織のというのは人事・採用などのコーポレート部門や、マーケティング部隊などで、事業部側のエンジニア部隊をもたない部署のお手伝いのことを指します。イメージとしてはクライアントが社内にいて、その中で制作会社的な動きを僕らがするというかたちです。

テクニカルってどういう意味ですか、と聞かれることがありますが、確かにテクニカルと付いているのが特徴だと思っています。もちろんWebテクニカルディレクターっていうのは造語です。

GTのWebテクニカルディレクターは、一般的なディレクターの業務ももちろんあるのですが、コンテンツの要件定義というよりも、技術寄りの要件定義が多くて。毎度毎度エンジニアにお伺いを立ててしまうと、時間もリソースも食ってしまうので、エンジニア抜きでそれらを考えて、そして決められるくらいの知識を持っている人をそう呼んでいます。

ディレクター自身がもともとエンジニアなどの経験がある人が多いので、自身が手を動かせることも強みの1つかなと思っています。

ここからけっこう主観が強いので、他の社員に聞くと違うことが返って来るかもしれないですが、「藤井はこう思って仕事をしているんだな」と思って聞いてください。

僕らは何をしているのか、という問いに対する答えは、とある目的のためにWeb技術を使いたい。でも「どうすればいいかわからない」という人たちのために、「なんでもする」をしているのではないかなと思っています。

この下線の「どうすればいいかわからない」と「なんでもする」というところに注目して分解すると、僕らは仕事としてHowを提供しています。

左側の図は、サイモン・シネックのゴールデンサークルというものです。Whyの部分である、ユーザーのために何をやるのかとか、何をやったらユーザーのためになるのかということは、事業部側が常に考えています。

ただこの場合のWeb技術についてであるHowについては、どうしても専門家ではないので、それを調べる時間がメチャクチャかかってしまうんですね。それらを僕らWebテクニカルディレクターは「こうしたら実現できますよ」とか「一緒に作りましょうね」のようにHowを提供して、最後のWhatまで落とし込むものを作って、信頼を得ていると思っています。

また、もう1つ「なんでもする」っていうことについてですが、左の図は『技術の創造と設計』という本から引用した図で、良い組織と悪い組織の役割分担を表した図です。いい組織というのは、自分の領域をはみ出す動きに我先に動くと。また悪い組織は、誰かがやるだろうと考えると、誰もやらない領域ってのが生まれるよ、という図です。

僕の勝手なモットーではあるんですけど、ディレクターというのは雑用が仕事かなと思っていて。なので、自分ができる範囲のことだけでなく、この図で言う斜線部分を我先にと率先してやることが重要だと思っています。

クライアントの「あれもやりたい」「これもやりたい」という願いを叶えるためには、この建前の形の上での分担みたいな領域をきっちり分けていると、できなくなってしまう部分が出てくると思うんですよね。

かつ、ディレクターはそんな毎年毎年スキルが更新されるフロントエンドみたいな状態じゃないので、自分の領域をはみ出すことで、さまざまなスキルが副次的に身についたりもするので、お得ですよね。

以上が、抽象的ですがGTのWebテクニカルディレクターはなんなのかという話でした。つまり、どうすればいいかわからない人たちにHowを提供して、クライアントの願いを叶えるために領域を広げて、なんでもする人です。全部一緒に働く人たちのためだと思っています。

仕事事例1：依頼編

少し抽象的な話をしてしまい、実際GTのWebテクニカルディレクターは何をしているか、という部分に触れられていないので、具体的なお仕事事例を3つほど紹介して終わりたいと思います。

1つ目はLINEの採用情報ページです。これから紹介する事例は資料の右下のQRコード読み取ると、それぞれのサイトにいけるので、ぜひ見てください。

依頼を受けた2018年ごろの採用ページってけっこう酷いもので。採用情報のページがただ漫然とあるだけで、なんのページなのかわからず、しかも必要な情報もない。さらにデザインやテキストがページごとにバラついていた部分もありました。それはやはり採用側にWebを知っている人がいなくて、管理していなかったからなんですね。

最も使い辛かったのは、当時は求人票を絞り込むことができず、ユーザーは400件ぐらいの求人から地道に探す、タイトルを見て探すしかなかった、ということです。

そこから、直接応募を増やすことを目的において、情報を整理して。採用システムと連携して、各求人票にタグをつけて絞り込めるようにしました。結局、最初のリリースまでだいたい10ヶ月ぐらいかかってしまったのですが、採用関係のページについては、入社してから今までずっと関わっていて、少しずつ改善しています。

仕事事例2：OnLINE

次が「OnLINE」というオウンドメディアなのですが、これはPRや採用マーケの担当者が企画・運用しているメディアで。社員インタビューをメインにインターンのレポートや、LINEのカルチャーを発信している、サイボウズさんでいうサイボウズ式みたいなものです。サイボウズ式は「OnLINE」を作る上でとても参考にしました。

実は「online」と英単語で検索すると、上から6番目にくるくらいSEOが強いサイトになっていて。今のLINEのことがよくわかるので、一度ご覧ください。

もともとLINE HR BLOGという名前のメディアをlivedoorブログで運営していて、それをリニューアルしたいという依頼だったんです。運営はPR部門で、エンジニアや技術のことをほぼほぼわからないという方たちなので、CMSを入れる必要がありました。あとはかっこいいデザインと、当然ですが、ブログを移行することで使い勝手を悪くしたくないという要望もありました。

やったこととしては、CMSの選定が大きかったかな、と。LINEではとてもセキュリティ要件が厳しくて。例えば「WordPress」はNGです。今ではAPI使って静的サイトジェネレーターのように使えるとはいえ、やはりNGなんですね。

なので、オンプレやクラウドのCMSを洗い出し、セキュリティチェックして、実際に使ってみて問題ないかを2ヶ月くらい精査した結果、今は「Movable Type（以下、MT）」を使っています。

社内の中でも「Hugo」や、昔でいう「Middleman」のような静的サイトジェネレーターも検討しましたが、部署に潤沢な予算が特にあるわけではないので、毎年の保守費用や管理画面を作ること考えると、やはり自前ではなくてMTのCloudなのかなという結論になりました。

他にも、リリース1ヶ月前に、デザインの問題からブログ記事を書くことが複雑になってしまうという部分を見つけてしまうことがあって。対応としては、それを部署側に正直に話をして、リリースの1ヶ月延長を説得しました。

使い勝手が悪くなって今後の運用が難しくなるぐらいだったら、デザインとのバランスを取ってリリースを遅らせて改善することが大事だと判断したためです。これもWebテクニカルディレクターの仕事の1つかなと。

今では以前のブログと比べて、回遊率が格段に上がり、セッション時間も、2分ぐらいに増えて、前よりもたくさん記事を読んでもらえるようになっていると聞いています。

仕事事例3：コロナウイルス対策のランディングページ

最後の事例は、新型コロナウイルスのアンケートを2020年の3月末にやったんですが、その受け皿として作成した、LINEでコロナウイルス対策として行った施策を一覧にしたランディングページです。

この取り組みは、確か木曜日の夜10時に話がきて「来週の火曜日に、緊急でリリースしたいんだけど」という依頼から始まった案件だったと覚えています。実質、3日間ないスケジュールだったので、気持ちを引き締めて参加しました。

このページ自体は、GTで作ったツールに「LPGen（Landing Page Generator）」というものがあって、コンポーネントを組み合わせるだけで簡単にLPが作れてリリースできるというツールを使用して作りました。ツールについてはGTのコーポレートサイトに詳しいインタビューが載っているのでぜひ見てみてください。

それを使って、結局1日くらいで作ったんですね。ただ、この時はデザイン面や機能面とかでどうしてもコーディングが必要だったので、JavaScriptを書いたりCSSを書いたりなど、僕のほうでやりました。

また、コロナについての情報が今よりも不明瞭で、施策自体もどうなるかわからないことが多く、急な更新が発生する場合がありました。

これ関しては、デザイナー側とすぐに動けるように企画側から降りてきた案に対しても多少間違っていてもモックを作ったり、コピー作ったりして、画像をすぐ替えるだけで大丈夫なように体制を作りました。

そしてこの案件で一番大変だったのが、超大量のアクセスですね。アンケート打つ直前に気づきましたが、LINEアンケートの最後のページにある、「ありがとうございました」のところに、このLPのリンクが載っていたんですね。それを知らされていなかったので、この時、たぶん青白い顔をしていたと思います。

もともとCDNがないサーバーにこのLPを置いていて、1秒に数千ぐらいの流入だったら耐えられる場所ではあったのですが、その100倍かそれ以上ぐらいのPVが見込まれる可能性が十分にあったんです。

もう15分後にはアンケートをするという段階だったのですが、どうしても緊急事態なので、急いで移管作業をするために1時間後にずらしてもらいました。

もしこのプロジェクトにWebディレクターがおらず、多少なりもWeb技術の知見がなかったら、そのままリリースして、そのままドメインを落として、LPにもつながらないというような悲惨なことが起きていたかもしれないです。

やはりすぐに判断して、相手はこの場合役員でしたが、誰であろうと説得して納得してもらって、プロジェクトを進める必要がディレクターにはあるなと、改めて感じました。

LINE GTのWebテクニカルディレクターに合っている人

まとめです。LINE GTのWebテクニカルディレクターに合っている人は、大前提としては、目的意識をもって仕事している人かなと。なんでもやる、挑戦するマインドを持っている人があっていると思います。あとはHowの選択肢ですね。Howの選択肢を複数持っている人が強いです。あとはさまざまな知見から、素早い判断ができるともっといいなと思います。

そんな人たちをGTは募集しています。ご清聴ありがとうございました。