採用面談で行う『ライブコーディング』課題の実施方法とメリットについて

ひとでちゃんのプロフィール画像
エンジニアひとでちゃん

ベイジエンジニアチームでは、採用課題として、二次面談の際に『ライブコーディング』を実施しています。リアルタイムで複数人で開発を行うペアプログラミングのようなイメージで行っているライブコーディングについて、今回はどんな目的で何を行っているのかを紹介します。

ベイジでは元々、二次面談の際に模写コーディングの課題提出をお願いしていました。しかしながら、1ページとはいえサイトをまるまる模写して提出いただくのは負荷が高く、時間もかかる上に、成果物を見ても、どのような考えでどうやって実装したのかが詳細まではわからない点をデメリットに感じていました。

リアルタイムでお互いにコミュニケーションを取りながら進められ、その場で完結するライブコーディングの方が、双方にとって効率的でより良いと感じ、ライブコーディングへの移行を決めました。

具体的な課題内容は伏せますが、目的や方法などが何らかの参考になれば幸いです。

ライブコーディングの目的

ライブコーディングを行う主な目的は以下になります。

  • 技術レベルを確認する
    • 変数、関数、オブジェクト、クラス構文を理解して扱っているか
    • 理解せず参考サイトからコピー&ペーストしたのみの実装になっていないかなど
  • 設計の考え方を確認する
    • どのような思考で実装しているか
    • どのような順番で実装しているかなど
  • 曖昧な要件に対して、または困ったとき、どのような対応方法をとるか傾向を確認する

ライブコーディングの実施方法

ライブコーディングは、採用応募者に参加いただくほか、ベイジからファシリテーター1名、エンジニア1名が参加します。音声コミュニケーションツールはGoogle Meetを使用し、エディターと実装画面を共有しながら進めます。実施時間は30分程度としており、実装途中でも切りのいいところで終了とします。(制限時間内に完成まで辿り着いていなかったとしても問題ありません。)

環境構築関連で何かトラブルがあった場合は、なるべくサポートします。

ライブコーディング実施画面のイメージ

事前準備

当日滞りなくライブコーディング課題を行うため、採用応募者の方には、当日までに以下の準備をしていただくようメールでご案内しています。

実施の際に採用応募者にお願いすること

何を考えて何を実装しようとしているのか、言葉に出しながら進めてもらいます。(独り言を言いながら実装するイメージ)

実際に二次面談でライブコーディングを実施する際には、事前に用意した参考動画をお送りしますので、イメージがつきやすいかと思います。

ファシリテーターの役割

ファシリテーターはタイムキーパー役を担うほか、採用応募者の緊張がやわらぐよう声かけを行います。「いいですね」「あと〇分です」など、ライブコーディングが行いやすい場作りを意識して発言します。

エンジニアの役割

実装に関してのファシリテーションはエンジニアが行います。「まず、何から手をつけますか?」「今なぜその実装をしましたか?」と質問し、深掘りしていきます。採用応募者が悩んで動きが止まってしまったら、さり気なくサポートします。

実施の流れ

HTMLのモックはある程度の状態まで完成させたものを用意しているので、その場で共有します。採用応募者がGoogle Meetの機能を使用して、実装画面を画面共有します。

課題は二つ用意しており、課題1が早く終わった場合は、課題2として課題1から発展した内容の実装をお願いする形にしています。おおまかな流れは以下になります。

  1. HTMLのモックはzipファイルにて共有します。採用応募者はモックを展開します。
  2. 採用応募者は実装画面の画面を共有します(エディタはLive Shareの機能により、各々が閲覧可能です)。
  3. 課題1の実装を開始します。
  4. 課題1の実装が20分以内に完了してた場合、課題2へ移ります。
  5. 簡単なフィードバックと、その他の質疑応答を行います。

補足

その他、以下のルールを設けています。

  • HTMLはクラス、ID、データ属性の付与のみ可能です。
  • CSS、JavaScriptを記述するファイルは指定します。
  • jQueryは使用可能です。

ライブコーディングのメリット

現時点でメリットに感じている点をまとめました。

  • リアルタイムで進めるため、なぜその実装をしたのかなど、疑問に思うことがあればその場で質問できる。
  • 経験年数やスキルによって、課題の方向性を柔軟に変えることができる。
    • 例:未経験の方は、中程度の課題を設定し実装力を確認する
    • 例:経験者の方は、設計に関する部分や進め方も重視する
  • 実際に会話することで、コミュニケーションの取りやすさや、カルチャーフィット面も確認できる

さいごに

ライブコーディングを行った回数はまだ少なく、改善の余地のある部分はあるかと思いますが、現時点での実施方法やメリットをまとめました。少しでも、採用課題のヒントになれば幸いです。

こんな記事も読まれています

Webサイト公開前にチェックすべき項目11選
Webサイト公開前にチェックすべき項目11選
さかっちょのプロフィール画像
さかっちょ
エンジニアがAdobeXDからFigmaに移行して感じたこと
エンジニアがAdobeXDからFigmaに移行して感じたこと
nagataのプロフィール画像
nagata
エンジニアチームが大きくなることで発生するメリットとデメリット
エンジニアチームが大きくなることで発生するメリットとデメリット
nomuraのプロフィール画像
nomura
ベイジのエンジニアが受ける新人研修をご紹介
ベイジのエンジニアが受ける新人研修をご紹介
かんののプロフィール画像
かんの
上に戻る