スクリーンショット_2020-03-13_19.56.30

【求人票作成】フロントエンドエンジニアの仕事内容/必須要件/魅力とは?

いつもお世話になってます、ポテンシャライトのかみさんこと上中です。


僕のことは、こちらのWantedlyのフィードに書かせていただきました。
見ていただけますと嬉しいです!

ポテンシャライトで企業様の採用支援をさせていただいている中で…

「実は、このポジションも採用したいんだよね」

と相談を受け、要件設計→媒体選定→求人設計まで行うケースは非常に多いです。そんな中で1から要件をヒアリングし、求人票を作成していくのですが、ヒアリングの途中に…

「要件ってどう決めればいいんですか?」
「応募がきやすい求人票や文言ってなんでしょうか?」

といったご質問をいただきます。


フロントエンドエンジニアは、使用するツール / 携わる部署 / 開発を行うもの/ 工程 で魅力が変わってきます。
最後の方に開発を行えればと思っておりますので、最後までお読みいただけますと幸いです。

フロントエンドエンジニアの採用は難しくなってきているみたいですね。

その理由としては、これからより重要視される言語にJavaScriptが挙げられていますのでより今後採用の難しさが加速していくと思います。

今回は、当社の寶田主導の元、各職種のJDについてまとめていくことにしました。第1弾のSaaS営業職については寶田のnoteを。

第2弾のカスタマーサクセス・第3弾のUI/UXデザイナーについては僕のnoteを見ていただければと思います。

<第1弾>

<第2弾>

<第3弾>

今回はフロントエンドエンジニアの職務内容/必須・歓迎要件をまとめた中から見えてきたこと、フロントエンドエンジニアとしてどんな魅力付けができるのか。

その一部を公開できればと思い、このnoteを書いています。

まずは、下準備から入ります。

まずSaaS/Web企業の中でも著名企業や採用がうまくいっている企業を約30社ほど並べ、「フロントエンドエンジニア」職について探っていきました。」職について探っていきました。

 ※企業名が入っておりますので、少しぼかしています。

スクリーンショット 2020-03-08 17.02.29

準備が整ったところで…

フロントエンドエンジニアの職務内容を羅列してみました。

・分析レポートを提供するライブラリの開発
・アプリケーションと連携するための API 開発
・高速に動作して使いやすく、再利用可能なUIコンポーネントライブラリの開発
・管理画面のUIの設計開発
・Backendからのデータの流れを意識したコンポーネント開発
・プロダクトおよび機能の企画設計実装テスト計測改善
・新規施策設計及び実装
・社内システムの実装改修
・Webアプリケーション開発用のJavaScript SDKの開発
・ダッシュボード開発
・カスタマーサポート向けツールの開発
・基盤の設計開発
・ウェブアプリケーションフレームワークライブラリ開発
・配信システムの管理UI、API開発。
・SPAの開発
・フロントエンド全般の開発、運用
・モダンな技術やデザインシステムを取り入れたフロントエンド開発
・既存機能の改善
・高度にインタラクティブでリッチな機能の開発
・メンバーの業務効率を向上させるための管理 UI の開発
・デザイナーとコミュニケーションしながらUIUX向上の提案/体験設計
・分析レポートの表示やマーケティング施策の作成管理するUIの開発
・ウェブアプリケーションのUIUXデザイン
・Web版の視聴機能改善
・パフォーマンス/UXの改善
・サービスの品質向上や業務効率化のための提案、実施
・リリース済みの機能の改修やカスタマーサポートと共に調査を行いユーザーの問題解決
・ユーザビリティを追求したUX/UIの改善
(言語;TypeScript、Vue.js、Nuxt.js、React、Electron、WebGL、WebSocket、Node.js、webpack)
(言語:Ruby on Rails、PHP、Golang)
(言語:Node.js)
・フロントエンドでの監視障害にワークフローの策定
・綺麗でかつモジュラー化し、再利用可能なフロントエンドデザインの実装
・処理の自動化、効率化、汎用化
・エンジニア、デザイナー(コーダー)のフロントエンド開発業務の統括、サポート
・チームマネジメント、プロジェクトマネジメント
・プロダクト方針についてプロダクトマネージャーとの討議
・デザイン的課題のディスカッション
・OAuth2 Platform 基盤開発
・Babelやwebpackなどを利用したフロントエンド開発基盤の構築や改善
・サービスの品質向上につながる技術選定導入
・サイト企画の改善にむけた戦略に基づくデザイン案作成
・開発運用におけるフロントエンド開発のリード
・フィードバック分析
・プロジェクト内Webページ全体のパフォーマンスチューニング及び開発環境改善
・サイト高速
・システムの負債脱却とモダン化
・セグメント内でのビジネスドメインごとのシステムの分離
・バックエンド、インフラ、デザイン領域との連携
・既存モジュールのセグメント切り分け
・分離された小さなシステムから順次リプレイス
・オンライン決済用の SDK 等
・位置情報データに基づいたターゲットユーザー行動の可視化
・SREチームとも協力し、ログ基盤や監視基盤を利用した信頼性の高いシステムを構築
・障害の切り分け、バグフィックス
・企画の立案/サイト改善ナビゲーションの最適化
・フロントエンド関連技術の検証、導入・運用、WEBのUI/UX設計に対するコンサルティング
・リリース後のアクセス解析をもとにした次回案の作成

羅列すると59個もの職務内容を発見することができ、その他も含め、下記18の項目に分類できることがわかりました。

こちらもわからない単語が多かったので、下記のnoteにまとめさせていただきました。より詳しくご覧になりたい方は下記をクリックいただければと思います。

▼開発
▼UI/UX
▼改善
▼言語
▼自動化/仕組み
▼マネージメント
▼ディスカッション
▼基盤
▼技術選定
▼デザイン
▼開発リード
▼分析
▼パフォーマンスチューニング
▼その他

次は、求人票でいうところの「必須要件・歓迎要件」に当たる部分を実施します。

同じように、そのほかの項目も羅列していきます。
職務内容同様、各社SaaS/Web企業の求めるスキル、人物像を羅列するとこんな感じになりました。

・iOS/Androidアプリケーションの設計、開発経験
・大規模なプロダクトでの開発運用経験
・パフォーマンスとワークフローを考えた設計開発能力
・WEBページのコーディング実務経験
・Linux環境での開発経験
・拡張性の高いシステムの構築経験
・モダンな(ES6+) JavaScript/HTML5/CSSに対する高い知識と経験
・GitHubなどでチームメンバーと開発した経験
・使いやすさを高く評価されているUI開発の経験。
・オブジェクト指向プログラミングの経験
・Git や Subversion など VCS を用いた開発経験
・アジャイル開発経験のある方
・JSフレークワークを用いたWebアプリケーション開発経験
・メンテナブルなCSS設計能力(BEM, FLOCSS, SMACSSなど)
・SassなどのCSSプリプロセッサを利用したWebサービス開発経験
・サービス開発においてデザインの経験がある方(Webアプリ問わず)
・Atomic Design的なコンポーネントの実装した経験
・JavaScriptを用いたSPA、または動的なWebアプリケーションの構築経験
・Web標準を前提としたHTML/CSSによるコンテンツとビジュアルの構築
・リッチなユーザーインターフェースの構築
・HTMLとCSSを用いて、堅牢なUIを実装できる
・セマンティックを意識したHTML5によるマークアップ経験がある
・CSS3を用いたWebデザインの実装経験(Flexible Box/Custom Properties等)がある
・アプリケーションやプラットフォームに応じた適切なクライアントサイドの設計及び実装ができる
・ネットワーク及びサーバサイドの基本的な知識を有する
・Web API開発の実務経験がある
・データベース設計を含むサーバサイドの基本的な開発経験がある
・CSS構文を意識した開発経験をお持ちの方
・SCSS(CSS)、HTML5を利用した開発経験をお持ちの方
・パフォーマンスを意識したUI提案、開発力をお持ちの方
・Web標準を前提としたHTML5/CSS3によるコンテンツやビジュアルの構築経験
・スマートフォンやタブレットなどにも対応したレスポンシブでの実装経験
・フレームワークを利用した JavaScript による開発経験 ( React, Angular, Vue, ES6, Sass のいずれか)
・ハードウェア、ネットワーク、セキュリティ等に関する深い知識
・AWSやその他のクラウドプラットフォームの知識
・サーバー側の開発とAPI設計の基本的な知識。
・Webテクノロジー、Webブラウザ、パフォーマンス、アクセシビリティ、セキュリティなどの理解
・UI / UX設計の基本的な知識。
・JavaScriptを使ったDOM操作の理解がある
・Linuxの基礎知識、利用経験
・Ruby on Railsのテンプレートエンジンに対する理解
・ES2015+の知識開発経験
・GitとGitHubの利用経験
・npm、Webpack、ES2015などJavaScriptビルド環境の知識
・パフォーマンス、アクセシビリティ、セキュリティについて基本的な知識がある
・アーキテクチャ及びデザインパターン(GoF/MVC/Redux等)を理解している
・Webブラウザのレンダリングの仕組みについて理解している
・Web標準技術に関する理解と深い知識を有する
・Vue.jsとVuex(またはFluxやRedux)の理解
・JavaScript、HTML5/CSS3の知識
・パフォーマンスセキュリティに関する知識
・サービス指向の技術
・CSS設計の設計、運用経験
・gulp等を用いたタスクランナーの設定、運用経験
・チームのエンジニアや他のチームと一緒にプロダクトを開発するための効果的なコミュニケーション能力
・チームメンバーや他部門とのコミュニケーション力
・英語:文書の読み書き、会議やチャットでのコミュニケーション。
・チーム開発経験
・React, Flux(Redux), Flowなどのfreee で利用しているツール群に興味がある方、もっとよいやりかたをお持ちの方(意欲重視します、必ずしも全てに経験があり精通している必要はありません)
・対面で議論推進ができる経験
・自分たちのプロダクトを開発して世の中に価値を生み出していくことに興味があり、一緒に世の中を変えていきたいと思う方
・可読性、保守性の高いコードが書ける
・自立的に設計、開発計画立案/実施できる
・MySQL、KVS 等の構築、運用経験がある方
・RDBとKVSを用いた業務経験
・AWSでのインフラ構築運用経験
・Webpackを用いたJavascriptなどのbundler設定、運用経験
・Slack、GitHubでの英語を使ったコミュニケーション
・ユーザビリティやレイアウトなどの改善経験
・SQLやスクリプト言語でのKPI集計
・技術やデザインへの高い興味関心、新しい事柄の自発的なキャッチアップ
・バージョン管理の概念を理解し、gitを用いた開発に参加できる
・テストコードの必要性の理解とメンテナンス経験
・npm、yarnなどのパッケージマネージャの使用経験
・サーバーレスアーキテクチャでサービスを構築運用した経験
・StoryBookの利用経験
・アクセシビリティの対応経験
・UXやHCD、IA周りの知識
・SVGやCanvasなどを利用したアニメーションの実装スキル
・MVC、Fluxアーキテクチャを用いたWebアプリケーションの開発経験
・BEMなどを用いたメンテナンスしやすいCSS、コンポーネント設計、実装経験
・機械学習アルゴリズムのサービス応用経験
・Atomic Designベースのコンポーネント設計経験
・OSSへの貢献、またはコミュニティでの活動経験
・技術探求とナレッジのシェアを意欲的に行なう姿勢
・レガシーなコードベースからモダンなコードベースへの閉じ込め経験

以下、そのほかを含めると17つに分類できました…!

▼開発経験
▼知識
▼志向性
▼コミュ
▼意欲
▼業務経験
▼DB
▼インフラ
▼運用
▼英語
▼改善
▼その他

Wantedlyを眺めていると、フロントエンドエンジニアについては、関われる領域が勝負になってくるようですね。

フロントエンドエンジニアの求人に記載のある全ての魅力を洗い出してみると3つに分類できました。


▼人間中心設計について

この図がめちゃめちゃ良かったので、貼っておきます。

スクリーンショット 2020-03-13 19.24.40

このように上流工程から入り込めるところは開発経験だけではなく知識を深めることができますよ!というところを訴求すると良いのかもしれません。人間中心設計から考え、UXを考え、実際のUIを考えるという工程は非エンジニアの僕から見ても面白そうです。

 ▼とは言いつつも、開発経験ってめちゃめちゃ大事。

サーバーサイドに比べると、ユーザーが近いこともあり開発/実装したものがどこまで市場に受け入れられているかの調査し、施策立案し、落とし込むことは良いかと思います。
実際に、ABテストをやったりするのでマーケティング部門との協業も多分にありそうなことも魅力ポイントかと。


フロントエンドエンジニアの魅力付けができてなかった!!!

と感じた方は、このnoteを機に自社のフロントエンドエンジニアにあれこれ聞いてみてはいかがでしょうか?


ここまでお読みいただきありがとうございました!
最後になりますが、ポテンシャライトは、2019年10月に「ベンチャー採用/転職のstandardをポテンシャライトに」という会社のVisionを再設計しました。その言葉通り、常に採用トレンドの最先端を歩む集団として在り続けたいと思っています。

今回掲載しているシートを全公開することはできないのですが、
もしご興味ある方はお気軽にご連絡ください!

※参考までにHPリンク貼っておきます。

⬇︎当社のHP

僕への連絡先は、下記になります!お気軽にご連絡くださいませ〜!

⬇︎Twitter

⬇︎Facebook


この記事が気に入ったらサポートをしてみませんか?