12周年記念パーティ開催! 2024/5/10(金) 19:00

エンジニアに聞く、仕事の行方 第1回 山田・德田編

ピクセルグリッドのエンジニア6名に、自分のいままでとこれらからのキャリアについて話してもらった座談会をまとめました。2時間に渡る長い話を全3回でお届け。第1回目はエンジニアの山田と德田のキャリアが中心です。(構成:編集 そとむら)

発行

  • 中村 享介
  • 高津戸 壮
  • 小山田 晃浩
  • 外村 和仁
  • 外村 奈津子
  • 德田 和規
  • 山田 順久
エンジニアに聞く、仕事の行方 シリーズの記事一覧

はじめに

最近、というか、これまでもずっと多かれ少なかれ、定期的に話題になることとして、キャリアパスの話があります。ぱっと見、めまぐるしく旬の技術が変化したり、新しいサービス、新しい考えが、どんどん発表される、この業界では未来のことを正確に予見し、それに対して自分のポジションを変化させていくのは至難の技と思えてしまいます。

CodeGridでは、ウェブ業界全体のキャリアパスについて、万人に役立つ有用な考えを提供することは難しいかなと思います。

ですが、ウェブ制作の現場から発信されるメディアとして、ピクセルグリッドのエンジニアのキャリアパスについての考えに耳を傾け、それをお伝えすることはできます。そこで、ピクセルグリッドのエンジニア6名に集まってもらいました。

はじめに言ってしまうと、目標となる5年後の自分の姿、10年後の自分の姿をクリアに意識している人はいませんでした。もちろん、なにも考えていないわけではないのですが、いわゆる「キャリアパス」の教科書のような回答はありません。ですので、タイトルも「仕事の行方」としました。

万能な回答の代わりといってはなんですが、これまでのキャリアの中で何を考えてきたのか、かなりリアルな話を聞くことができました。ちょっと長めだったので、2人ずつに分けて、全3回でお届けします。文中、エンジニアの名前がない発言(ーーが付いているもの)は、編集のそとむらのものです。

以下、参考までにエンジニアの年齢です。

フロントエンド・エンジニア

  • 山田 順久:27歳
  • 德田 和規:29歳
  • 外村 和仁:29歳
  • 高津戸 壮:30歳
  • 小山田 晃浩:30歳
  • 中村 享介:32歳

では、軽い読み物としてごゆっくり。

機械と人の間のよきインターフェイスを作るのがフロントエンド・エンジニア

——いちばん若い人からスタートしてもらいましょうか。

山田:エンジニアでありたいとは思っています。自分のスキルセット的にフロント寄りなので、フロントエンドのエンジニアをやっているっていうのが現在。

もし今の『フロントエンド実装ならJavaScript』っていう潮流が変われば、その変わった先に移っているだろうと思います。JavaScript大好きっていうよりは、その時々で「よいエンジニア」でいたいなという思いでいます。

——フロントエンドの実装言語の中心が、JavaScriptから他の言語へ移行するような兆候ってあるんですか?

山田:いや、感じないですね(笑)。

中村:だからピクセルグリッドも「JavaScriptの会社」じゃなくなってるかもしれないってことですよね。

——JavaScriptにこだわる会社ってことではなくて、優れたフロントエンド実装をする会社であれば、JavaScriptの会社じゃなくなっている可能性もある?

中村:そうですね。

山田:今、特に自分でなにかやっているわけではないんですけど、『フロントエンド』っていうのは、HTML、CSS、JavaScriptに限ったものではないなと思うんです。フロントエンドっていうのは、コンピュータと人の間に挟まるインターフェイスのことで、それをうまく作るっていうのが、フロントエンドのエンジニアの仕事だと思っているんです。

まあ、例えば、Wiiですごく見やすいサイトを作るとか、Kinectですごく見やすいサイトを作るとか、Googleめがね*のすごい操作しやすいインターフェイスを作るとか……。そういうのも、もしかしたらフロントエンド・エンジニアの仕事じゃないかなって思っています。

*注:Googleめがね

あまり本題とは関係ないですが、Googleが目下開発しているARメガネのことです。(参照:Google + : Project Glass

外村:Googleめがね(笑)!

山田:ウェブのモニタに映るウェブサイトの画面を作るだけが、フロントエンド・エンジニアの仕事ではなかろうと思うわけです。

中村:ゆっきー(山田のこと)は最初からフロントエンド・エンジニアだったの?

山田:最初の最初は、なんでもいいやって思ってました。デザイナーか、エンジニアか、まあ、どっちでもいいやって。

中村:ウェブサイト制作に関われればいいやという感じ? ピクセルグリッドに至るまでの話も聞きたいんだけど。

山田:そうですね。最初の会社の研修ではPHPとか、MySQLとかもやりました。サーバーサイドからフロントエンドまで、ざーっと見ました。その会社での1年目の配属はデザインセクションで、ボタンの画像作ったりしてましたね。

そのうちHTMLとCSSをやり出して、デザインからコーディングまでをいっぺんにやる便利屋になり、さらにJavaScriptを覚え出しました。そしたら、そちらにのめり込んでいって、コードの方に軸足を移して、デザインはやらなくなりました。

JavaScriptにどんどん特化していって、現在に至るというのが、ざっくりした経緯です。

波に乗る力はどこかで衰える、かも

——ずっとフロントエンド・エンジニアで居続けるには、技術のいろんな潮流に乗る力が必要かなあと思うんですけど、どうでしょうか?

山田:波に乗る力ってことですか?

——そう、その力ってこれから先もずっとあると思います?

山田:それはどっかで衰えると思うんですけどね……。実際になっていないから、わからないけれども、みんなそう言っているから(笑)。自分の傾向としては、新しい技術はやりたがる方なんです。でもあんまりズッコケないように、それを抑えてるっていうのはあります。

——ズッコケないように、抑えている?

山田:そう他の人がぜんぜんわからないような、汎用性のあまりない新しいことをやりすぎて、それにハマらないように、ちょっと気をつけている感じですね。素の状態では、特に意識しなくても、新しい情報は知りたいって自然に思うので……。なにも考えていないといえば、そうなのかも知れない(笑)。

——本能のままにいけばいいやと?

山田:そうです(笑)。

コードを書くのが『癒しの時間』

——なるほど。次に若い人って……

外村:僕とのりさん(德田のこと)が、数日違いで、のりさんの方が若い。

德田:これまでの経緯なんですけど、僕、大学の時に就職活動しなかったので『自分と向き合う』みたいな普通の大学生が就職活動でやっているようなこともやらなかったです。

——就職活動しなかった?

德田:そう、映像の制作会社に知り合いがいて『じゃあ、来る?』『はい、行きます』という感じで、東京で半年くらい働いてました。で、大阪に帰って、やっぱり働かなきゃいけないので、いままでの仕事の延長で何社が受けて『はじめは見習いからでもいいです』みたいな感じで、ウェブ制作会社に入りました。

——そこではなにを担当したんですか?

德田:最初はまさかのウェブデザイナー見習いから入って、数ヶ月でウェブデザイナー見習いをやめました。そして、コーディングをやる人がいなかったので、コーディングを始めたんです。

その実装をするときも、動きをデザインする人が誰もいなかったので、自分で決めて自分で実装しようとして、JavaScriptもやることになりました。

——やる人がいなかった部分をどんどん担当していったんですね。

德田:当時……って4年くらい前かな? まだ、こういうふうに『フロントエンド・エンジニア』って呼ばれる人たちがいなかったと思うんですよ。僕が知らなかっただけかもしれないけれど。まだ『マークアップ・エンジニア』って名称があるくらいの時期でした。

マークアップ・エンジニアって仕事の内容の括りも実際は広いですけど、当時の僕も含めて、いわゆるコーダーって呼ばれている人たちは、それだけやってても、まあ、あんまり先がないじゃないですか。

——と思っていた?

德田:いや、それだけやってても、先はないんですよ。なので、じゃあ、他のこともしてみたいなと思って、今度はディレクターとして転職してみたんです。そしたら、ディレクターで転職したのにJavaScriptばっかり書かされて(笑)、もっとJavaScriptが好きになっていって現在に至ると。

——ディレクター職はどうでしたか?

德田:ディレクターは大変でした。精神的にくる感じ(笑)。エンジニアはコード書いていればいいじゃないですか。別にそれだから楽だというわけではないんですけど、コードに集中できる。僕はその方が向いていると思いました。

ディレクターってお客さんとのやり取りがあるじゃないですか。まあ、今もお客さんとのやり取りはありますけれど……。もっとサイトの根本のところを詰めたり、スライド作ってお客さんの前でプレゼンして、相手を納得させないといけないので。そういうのは……本当に……辛かったです。

全員:(笑)

高津戸:逃げだ(笑)。

德田:だって、Excelでこんななんかもう……(言葉にならない)。コンテンツマップとかPowerPointで作ってみたり。マシンがWindowsだけだったんで、ExcelとかPowerPointだけでやるんですけど、まあ大変でしたね。あとクオリティチェック。それもディレクターの仕事だったんですよ。

——苦手だった?

德田:苦手っていうか、同じことの繰り返しなんですよ。今でももちろん作ったもののチェックはやりますけど、自分の作ったものをチェックするんで、違うんですよ。

クオリティチェックは人の作ったものをシナリオに沿って、全部のブラウザで1日とか、2日かけて同じ操作を延々とやるんですよ。封筒に紙を詰めていくのと同じような作業感がありました。

高津戸:それは会社がだめなんだよ(笑)。

德田:でもそういうクオリティチェックって誰かがやらないといけないでしょう。まあ、ピクセルグリッドではディレクターって役割の人がいないから、そういう延々とやるようなクオリティチェックは誰もやってないけど、それは、誰かがやっているわけで。

でもそういう仕事と、JavaScript書くのを平行してやっていたので、JavaScriptが断然楽しいっていうのは、すぐわかりました。コードを書く時間は自分にとって『癒しの時間』だったんですよ(笑)。

ディレクションはエンジニアも一度やってみるといい

——今後についてはなにか考えてますか?

德田:今後はどういうふうになりたいとかってあんまりないんですよね。

いつもKさん(とある案件で一緒にお仕事をしている方)に聞かれるんですよ。打ち合わせで、ふたりっきりになると『德田さんはこれからどうしたい?』って、いつも聞かれるんですよ。いつも困るんですよ(笑)。僕は始めから『〜になりたい』って明確なヴィジョンを持って、進んでいるわけではないので。

——そうなんですね(笑)。

德田:でもディレクションの経験はしてよかったと思ってますし、なんだったら、みんなも1回やってみるといいと思います。お客さんを納得させる力は必要だと思いますし。

中村:うん。エンジニアも作るだけじゃなくて、お客さんとのやり取りは必要だと思う。よくある体制としては、エンジニアは制作だけやって、営業がお客さんと話すみたいな役割分担があるけど、ピクセルグリッドは、ぼほ全員がお客さんと話しているものね。

德田:自分でお客さんに『それはやめた方がいいんじゃないか』と言えないといけないと思います。営業さんがいたりすると、お客さんに通しにくかったりしますよね。ディレクターにはディレクターの世界があって、エンジニアの言っていることが必ずしも通るとは限らないんです。でも言わないと、そもそも自分が思っていることは実現できませんからね。

中村:まあ、お客さんにとっては好き勝手な会社だと思われるかもしれない(笑)。エンジニアが出てきて、ごちゃごちゃ言うしね。でもそれは、最終的にコストに跳ね返ってきたりする部分を指摘しているので、お客さんからみて最終的に、なんでも言う通りにやるのと、どちらがいいかというのは一概に言えないとは思うけど。

いいUIを実現するためのフロントエンドをやりたい

——将来像はないとしても、これをやりたいと思っていることあります?

德田:JavaScript自体は僕はみんなほど好きじゃないと思います。

中村:jQueryプラグイン作るの、ハマってたよね?

德田:そうですね。でもそれはUIを実現するためにやってたことなんで。今も、いいUIを実現するためのフロントエンドをやりたいっていうのがメインかな。そういう点では、今は、PCとモバイル環境の両方を考えた設計がやりたいですね。

高津戸:レスポンシブうんちゃらみたいな?

德田:レスポンシブがどうのっていう技術論じゃないんです。PCでもモバイルでも、どっちでも、サービスがちゃんと使えるってことです。だからモバイル環境は、ウェブでなくてアプリでもいいんです。

中村:FacebookはPCサイトもあるし、モバイルのブラウザでも見られるし、アプリもあるしね。

德田:そうなんです。で、今はちょうどいい案件がCodeGridなんです(笑)。先日、iPhone版Safariで見られるものを作ってリリースしましたけど、これもアプリが本当はいいんですよ、ウェブだとできないことが多すぎるので。アプリにしたら遷移とかなめらかになるし、やれることが多くなる。アプリ単体で起動して、その中でデモも起動できたりします。ウェブだと制限があります。

高津戸:じゃあアプリ化するんですか?

德田:アプリ化したい。

——じゃあ、スキルセットの中にObjective-Cが加わる?

德田:とりあえずTitanium*を使ってみようと思ってます。アプリ制作でCodeGridが使いやすくなるなら、それがいいですよね。

*注:Titanium

Tinamiumは、iOS、Android対応のアプリケーションの開発環境。JavaScriptで開発を行います。ひとつのソースコードを書けば、マルチプラットフォームに対応できるのが特長。Objective-CやJavaなどプラットフォームごとのネイティブアプリ開発言語を習得する必要がないのが、開発者にとってのメリットと言われています。

(この後脱線して、しばらくアプリでできることの技術的な話が続きました、笑)

外村:やめよう、このネイティブアプリの話はもうやめようよ(笑)。

マークアップには先がないわけじゃない

德田:この記事はフロントエンド・エンジニアになりたい人向けなんですか?

——自分のキャリアをどう進めていこうか、誰でもときどきは考えていると思うんですけど、その人たちの参考にしてもらえないかと思ってます。だって、さきほど『マークアップだけをやってたら先はない』と断言してたじゃないですか(笑)。

中村:マークアップやっている人でもそれを極めるならいいと思うんですけどね。HTMLとCSSでPhotoshopファイルの変換作業だけをやっているんじゃ、先はないかもしれない。

けれど、HTMLやCSSの仕様に精通していて、じゃあ、ここはSVGを使って表現したらいいとか判断できるレベルの人であれば、JavaScriptが書けなくても問題ないと思う。

——マークアップ・エンジニアにはマークアップ・エンジニアが極められる道があると。

高津戸:それはそうじゃないですか。

德田:それはそうとう好きじゃないとできないし、好きな人は言われなくてもやってますよ。

高津戸:うん、設計とかメンテナンス性のこととか考えないで、ただHTMLとかCSSとか書いててもなんにも楽しくないんじゃないですか。

ここまでのまとめ

今回は山田と德田のこれまでのキャリアと、これからの展望をお届けしました。会話の中で特徴的だった考え方を簡単にまとめてみました。

  • フロントエンド・エンジニアの仕事とは、コンピューターと人との間のインターフェイスを作ること。モニタでみるウェブサイトを作ることだけが仕事ではない。(山田)
  • ディレクター職(あるいはディレクター的な)のようなエンジニア以外の職種も経験するといい。(德田)
  • JavaScriptをやりたいのではなく、使いやすいサービスを支えるよいユーザーインターフェイスを作る手段が、JavaScriptだった。(山田、德田)
  • ユーザーにとって、よいインターフェイスを作る手段があれば、できる範囲で、そちらも試したり、フォローしたりする。(山田、德田)
  • JavaScriptに手をつけないとしても、HTMLやCSSを極める道も、もちろんある。(中村)
  • おそらく自分なりの工夫がないHTMLやCSSのコーディングは楽しくないのでは?(高津戸)

次回は、外村と高津戸の話を中心にお届けします。お楽しみに。

中村 享介
PixelGrid Inc.
Jamstackエンジニア

2009年、JavaScriptの会社として株式会社ピクセルグリッドを設立。 多数のWebリニューアル、新規立ち上げを取り仕切った経験を持ち、情報設計、フロントエンド、クラウド活用、開発フローの効率化を得意とする。 Webをより発展させるため、新しくブラウザに実装された機能の活用事例を数多く生み出しつつ、日々、クラウドサービスを利用した効率のよい制作・開発手法の試行錯誤を続けている。現在の興味はWeb Componentsを使ったマークアップの改善とJamstack。 著書に『WebクリエイティブのためのDOM Scripting』(単著:毎日コミュニケーションズ、2007年)など。ここ数年は書籍の執筆をせず、フロントエンド技術情報メディア「CodeGrid」で精力的に執筆活動を行っている。

高津戸 壮
PixelGrid Inc.
テクニカルディレクター

Web制作会社、フリーランスを経て、株式会社ピクセルグリッドに入社。数多くのWebサイト、WebアプリケーションのHTML、CSS、JavaScript実装に携わってきた。受託案件を中心にフロント周りの実装、設計、テクニカルディレクションを行う。スケーラビリティを考慮したHTMLテンプレート設計・実装、JavaScriptを使った込み入ったUIの設計・実装を得意分野とする。 著書に『改訂版 Webデザイナーのための jQuery入門』(技術評論社、2014年11月14日)がある。 CSS Nite 2011ベストセッションにおいて、全170セッションの中から、ベスト10セッションに、CSS Nite 2013ベストセッションでは、全278セッション中、ベスト20セッションに選出。

小山田 晃浩
PixelGrid Inc.
フロントエンド・エンジニア

2006年よりWeb制作会社にてUI実装や運用業務を経験した後、2010年よりフロントエンド・エンジニアとして株式会社ピクセルグリッドに入社。これまでの経験の大半は大規模Webサイトの壊れにくいHTML/CSS設計、及び実装。また、SVG, Canvas, WebGLの扱いも得意としている。 外部に向けたアウトプットも積極的に行っており、カンファレンスでの講演などを多数こなしている。Tokyo WebGL Meetupの主催者。2011年から2021年まで10連続でMicrosoft MVP(Developer Technologies)を受賞。 著書に『Webデザイナー/コーダーのための HTML5コーディング入門』(共著:エクスナレッジ、2011年3月12日)や『CSS3デザイン プロフェッショナルガイド』(共著:毎日コミュニケーションズ、2011年5月28日)』などがある。

外村 和仁
フロントエンド・エンジニア

HTMLコーダー、JavaScriptプログラマ、PHP、Perlのプログラマといった職務を経験後、2010年に株式会社ピクセルグリッドに入社。大規模サイトの運用、開発の経験を活かしてバックエンドからフロントエンドまで幅広く担当。2015年、退社。好きな言語はJavaScriptとRuby。 著書に『ノンプログラマのためのJavaScriptはじめの一歩』(単著:技術評論社、2012年11月7日)があり、共著も多数。このほか、WEB+DB PRESS、Software Designなどにも寄稿。

外村 奈津子
PixelGrid Inc.
編集

情報出版社に在籍中、Mac雑誌、中高年向けフリーペーパー、コラムサイト運営、健康食雑誌、グラフィック・Web技術書籍編集、IT系ニュースサイトの編集記者を経験。その後フリーランスのエディター/ライターとして独立。2011年4月より株式会社ピクセルグリッドへ入社。ピクセルグリッドが提供するフロントエンド技術情報を提供するサービス「CodeGrid」の編集を担当している。

德田 和規
PixelGrid Inc.
テクニカルディレクター

HTML/CSSコーダーとしてWebに触れ、その後WebディレクターとしてJavaScriptの特性を活かしたサイトのテクニカルディレクションからUI開発までを経験。2011年にフロントエンド・エンジニアとして株式会社ピクセルグリッドへ入社。 著書に『jQuery逆引きマニュアル』(共著:インプレスジャパン、2010年12月17日)などがある。

山田 順久
フロントエンド・エンジニア

HTML・CSSのコーディング、後にJavaScriptの設計や実装を主業務として経験を積む。キャンペーンサイトやコーポレートサイトの、動きと操作性に工夫を凝らしたUI実装を多く手がけている。複雑なWebアプリケーション実装における、コンポーネント的な考え方を念頭においたJSの設計を得意とする。2021年、退社。 著書に『JavaScriptエンジニア養成読本』(共著:技術評論社、2014年12月11日)がある。

この記事についてのご意見・ご感想 この記事をXにポストする

全記事アクセス+月4回配信、月額880円(税込)

CodeGridを購読する

初めてお申し込みの方には、30日間無料でお使いいただけます