AWSの話題を中心に、日々の業務やプログラミングの徒然を綴るエンジニアブログです。

HANDS LAB

HANDS LAB ENGINEERS BLOG

ハンズラボエンジニアブログ

12

カテゴリー: 新人研修

ハンズラボ新卒研修2017 (2/2) 〜実際にやってみた編〜


写真:仮想プロジェクト最終発表会を終え、安堵の表情の2017年新卒のみなさん

こんにちは、エンジニアの三井田です。
先月投稿した「ハンズラボ新卒研修2017 (1/2) 〜カリキュラム編〜」をお読みいただいたみなさま、ありがとうございました。多くのコメントもいただき、大変励みになりました。

少し間があいてしまいましたが、今回は「ハンズラボ新卒研修2017 (2/2) 〜実際にやってみた編〜」と題しまして、4月〜6月の3ヶ月間に渡って行われた2017年度新卒研修の、より具体的な研修方針・内容や、研修を通して考えたことなどをまとめたいと思います。

4月 〜入社、社内技術研修〜

4月の研修は、IT経験者、未経験者関係なく全員一緒に社内で技術研修を行いました。
ビジネスマナーなどを学ぶ外部研修などもあったため、4月に社内で研修ができた期間は実質12日程度でした。

4月に身につけてほしいこと(前編からの再掲)

前編からの再掲になりますが、4月の社内技術研修で身につけてほしかったことは下記です。

  • 開発するために必要な基礎的なプログラミング技術
  • 自分で考えてコードを書く力
  • 分からないところが出てきたときに、それを主体的に解決する力

 

到達度の測り方

各々が上記の目標をどれくらい達成できたかについては、下記の方法で測りました。

中間到達度の測り方

  • 配布した問題集の問題が解けているか
    単純に解いた問題の数を確認するのと同時に、エラーが出た時に何が問題なのかを把握し、正しく動作するようにプログラムを修正できているかも確認しました

最終到達度の測り方

  • 入社初日に解いてもらったプログラミングテストがJavaScriptで解けるかどうか
    入社初日に解いてもらったプログラミングテストを4月末にもう一度解いてもらうことで、4月の最終到達度を測りました

4月の研修方針と心がけたこと

単純な知識や技術の学習は、基本個人で

単なる知識や技術の学習は、集団よりも個人のペースで行った方が効率が良いと考えたので、各自でeラーニングや書籍を見ながら、分からないところを質問しに来てもらうスタイルにしました。(もちろん、つまづきやすかったり、書籍などを見ても理解しづらいと思ったトピックについては、別途講義を行いました。)

みんなで集まる時間は、インタラクティブに

反対に、みんなで集まる時間は、コードレビューなど参加者全員でコミュニケーションを取れる内容にしました。講義をするにしても、一方的にならないようにできるだけ新卒のみなさんと対話しながら進めるようにしました。

新卒のみなさんの精神的サポートをする

自分も去年の4月は入社したばかりで何かと不安な時期だったので、5人全員の考えていることを把握できるように毎日夕礼を行い、そこで各々の日報に対するフィードバックや、不安に感じていることに対してできる限りのサポートをしました。

4月に学習したこと・行ったこと

今回は技術研修に焦点を当てた話をするため、6日間の外部ビシネス研修やハンズラボの説明など、技術面以外の話についての説明は割愛させていただきます。(昨年度の話になりますが、社内で行った技術面以外の研修については、弊社チーフエンジニア田部井がこちらの記事でまとめております)

4月に社内で行った、正味12日間の技術研修の内容は以下です。

  • キックオフ
  • JavaScript基礎の学習
  • HTML5/CSS3の学習[追加]
  • セレクタ・DOM操作演習
  • Node.jsの学習
  • データベースの学習
  • 社内LT会
  • コードレビュー会
  • その他(マークダウンの書き方、UNIX研修(外部)など)

 

キックオフ

新卒研修概要説明

前編でご紹介した研修目標や、研修スケジュールなどについて研修初日に説明しました。

プログラミングテスト

その後、新卒のみなさんの技術力が未知数だったため、1時間程のプログラミングのテストを、紙にプログラムを書いてもらう形式で実施しました。回答言語は自由にしたので、新卒のみなさんが選んだ言語は、C、Java、PHP、Swiftなどさまざまでした。そしてこのテストの結果を踏まえて、事前につくったカリキュラムを再度調整しました。

環境構築(Atom、Emmet、EditorConfig、Node.js(Nodebrew経由)、ESLintなど)

今回の研修で使うプログラミング環境の構築や、入れておくと便利なプラグインなどをインストールしてもらいました。最終的にNode.jsでJavaScriptファイルを実行して、前編の最初に出てきたアスキーアートが出たら終了でしたが、全員無事に完走することができました。

JavaScript基礎の学習

eラーニング&問題集を解く

基本的な文法などは、Schooの動画などを見て各自で学習してもらいました。学習後は、事前に配布したJavaScriptの基礎的な問題が30問程書かれた問題集を解いてもらうことで、学んだ知識の定着を図りました。
もちろん、個人で学習していると疑問点や不明点がたくさん出てくるため、その場合は躊躇せずに私やほかの人に積極的に聞くように促し、適宜フォローを行いました。

社内講義

JavaScriptでプログラムを書く上で知っておいた方が良いことや、つまづきやすい部分に関しては、別途社内で講義を行いました。講義では以下のトピックなどを取り上げました。

  • レキシカル環境
  • 実行コンテキスト
  • this
  • プロトタイプ
  • ES6新機能(const・let、アロー関数など)

社内講義後には、eラーニングの時と同じくその講義に関する確認問題を配布し、理解できていない箇所がないかの確認を行いました。

HTML5/CSS3の学習[追加]

当初のカリキュラムには含まれていませんでしたが、HTML・CSSを書いたことがない、習ったけどよく分からない人が大半であったため、急きょHTML・CSSの学習を追加しました。

HTML5/CSS3の初心者向けの書籍を一通りやってもらい、基本的なhtmlタグやcssプロパティを覚えてもらいました。また、効率的なマークアップの仕方(Emmetを使った方法など)については、ライブコーディングも交えながらの講義を行うことで補足しました。そして、一通り学習が終わった後は、数種類のサンプルWebサイトを自力でマークアップする練習をしてもらいました。

セレクタ・DOM操作演習

これに関しては「習うより慣れよ」なので、書籍を見ながらひたすら演習を積んでもらいました。

Node.jsの学習

4月の後半は、Webアプリケーションの仕組みを説明してから、実際にExpressを使ってローカルサーバを立ててもらい、サーバサイドの演習を行いました。また、WebSocketについても学習し、同じように通信の仕組みなどを学んだ後、実際にSocket.IOを使ってWebSocketサーバーを実装し、動作確認を行いました。

データベースの学習(DynamoDB)

弊社は、アプリケーションのデータストアにS3やDynamoDBが使われることが非常に多いという特徴があります。そのため、RDB、SQLについて学ぶことはエンジニアとして非常に重要なことだというのは百も承知なのですが、学校でRDBについて学習した人も多かったため、今回は研修期間の都合上、AWSのフルマネージドNoSQLデータベースサービスであるAmazon DynamoDBの学習と演習をメインで行いました。

弊社におけるDynamoDBの活用事例についてご興味のある方は、下記の記事をご参照ください
東急ハンズメッセのピークにお客様の信頼を取り戻した高コスト効率の Amazon DynamoDB

社内LT会

新卒のみなさんにはこれからの長いエンジニア人生、知識や技術をただ学習するだけでなく、学んだことや経験したことを積極的に社内外にアウトプットしていってほしいと考えたので、その第一歩目として、好きなテーマのSchooの動画を1つ見てもらって、それについてのLTを社内で行ってもらいました。ITと関係ないトピックでも大歓迎だったため、新卒のみなさんそれぞれの個性が溢れる大変面白いプレゼンになっていました(もちろん、内容もきちんとまとまっていました)。

コードレビュー会

また、4月に解いたプログラミングの問題について、同期・講師とより良い解法や書き方について議論する、コードレビュー会も複数回行いました。みなさんただ批判するのではなく、お互いをリスペクトし合いながら上手にディスカッションができていたのでとても良かったです。配属後、プルリクエストを送る時などに、ここでの議論の経験が生かされれば幸いです。

その他

マークダウンの書き方に慣れていない人が多かったので、研修中の日報は、昨年度同様マークダウンで書いてもらいました。また、コマンドラインでの操作に不慣れな人もいたため、基本的なUXIXコマンドなどについて学べる外部研修を受講したりもしました。

4月最後のプログラミングテスト

結論から言うと、驚くほど成長していました。大半はJavaScriptを書いたこともなかったため、どうなることかと思いましたが、全員JavaScriptで問題にきちんと回答することができていたので、上記の研修カリキュラムは一定の効果があったのではないかと思います。特に、研修担当者に質問したり、コードレビュー会でコードをレビューしたりされたりすることで、自分のコードを客観的に見ることができるようになったと感じました。やはり自分以外の人と、どうしたら現状のコードがより良くなるかを議論することは、技術力を向上させる上で非常に大切なことだと改めて感じました。

5、6月 〜仮想プロジェクト〜

5、6月は、AWSの外部研修に参加した後、前編でお話した通り、社内で仮想プロジェクト演習を行いました。仮想プロジェクトについては前編をご参照ください。

仮想プロジェクトで身につけてほしいこと(前編からの再掲)

  • 実際に開発をする上で必要となる力
  • チームで円滑に開発を進める方法・マインド
  • スケジュール遅延による影響と対策を知る

 

到達度の測り方

中間到達度の測り方

「設計」「実装(フェーズ1)」「実装(フェーズ2)」「テスト」の各フェーズの最後に報告会を設けました。そこでプロジェクトの進捗などを把握するとともに、報告会の内容、プロジェクトの進め方についてのフィードバックを主にAWSチームから行いました。

最終到達度の測り方

新卒研修最終日に行う「仮想プロジェクト最終発表会」で、最終成果物や仮想プロジェクトの振り返りについて発表してもらうことにしました。最終発表会ではAWSチーム以外の弊社社員にも発表を聴いてもらい、仮想プロジェクト全体のフィードバックなどをより多くの人から行ってもらいました。

仮想プロジェクトお題 〜Botをつくってください〜

5月初旬の仮想プロジェクトキックオフ時に、仮想お客様であるAWSチームリーダーの鹿倉から、以下の5つの要件をお題として提示しました。

要件1〜4:AWSの情報を取得して通知するBot

  1. 特定のタグが付いているインスタンスの一覧を抽出
  2. RI(リザーブドインスタンス)の適用率を抽出
  3. 特定のセキュリティグループに入っていないインスタンスがないかチェック
  4. 特定のインスタンスの情報(OS,インスタンスタイプなど)を入力すると、日本円でオンデマンド、1年RI、3年RIの金額が出力(価格テーブルは常に最新)

クライアント側は特に制約はなく、既存のサービスと連携する形でも、自分たちでフロント側をつくっても良いという条件でしたが、新卒のみなさんは最終的にSlackに上記の通知を行うことに決定しました。

要件5:東急ハンズのGoogleカレンダーにスケジュール登録したら、自動でハンズラボのGoogleカレンダーにも登録してほしい

弊社社員は、ハンズラボと親会社の東急ハンズ2つのGoogleアカウントを所有しています。そのため、片方のGoogleカレンダーにしか予定を登録してないと、ほかの人がもう片方のアカウントのGoogleカレンダーだけを見て、予定が空いていると勘違いしてしまうことがあります。そこで、東急ハンズのGoogleカレンダーに予定を登録したら自動でハンズラボのGoogleカレンダーにも同じ予定を登録できるようにしてほしい、という要件を挙げました。

これらの要件を提示した理由

新人研修ということで多少の配慮はしましたが、基本的にAWSチーム(特にリーダーの鹿倉)がほしいものを依頼しました。去年仮想プロジェクトで私たちが仮想プロジェクトで開発した蔵書管理システムは、研修終了後社内で使われる機会が徐々に減っていき今や忘れ去られているので(笑)、今年度は、「仮想」ではあるものの、研修終了後も実際に使うことのできるシステムを依頼しました。また、技術的な観点からも、要件1〜4に関しては、配属後何度となく使うであろうAWS SDKの使い方に慣れることができる、要件5に関しては、(おそらくGoogle App Scriptを使えばできそうだったので、)4月に習ったJavaScriptの知識を活用することができると考え、これらの要件に最終決定しました。

開発に関して

プロジェクトのフェーズを、「設計」「実装(フェーズ1)」「実装(フェーズ2)」「テスト」に分けました。報告会も含めた各フェーズの日数は下記です(AWS研修2日間とAWS Summit3日間はプロジェクト期間から除外)。

  • 設計 :8日
  • 実装 :15日 (フェーズ1 :7日、フェーズ2 :8日)
  • テスト : 7日

IT未経験者に関して

今年度はIT未経験者がおり、4月の研修である程度プログラムは書けるようにはなったものの、ある問題に対して自分でアルゴリズムを考え、それをコードに落とし込む力は、5月以降も引き続き別途鍛えていく必要があると考えました。そこで今年度のIT未経験者に対しては、「時短勤務」という設定で、10:00(始業時刻)〜15:00は仮想プロジェクトへの参加、15:00〜19:00(終業時刻)は個別に上記の力を鍛える補習を行うことに決めました。そして、仮想プロジェクトキックオフで新卒のみなさんに、プロジェクト期間中は、IT未経験者の時短勤務を踏まえた上での話し合い・タスクの分担をするように伝えました。

5月の研修方針と心がけたこと

失敗から学んでもらう

前編の繰り返しになりますが、失敗する前に注意されるよりも、失敗して自ら学んだ方が印象に残りますし、学びは大きいと考えます。仮想プロジェクトではできるだけ先回りして教えることを避け、失敗してからその経験を自分たちで振り返り、そこから学んで次の行動につなげていけるように指導することにしました。

コミュニケーションの取り方を試行錯誤してもらう

コミュニケーションスキルが配属後も非常に重要なスキルになることや、みなさんほぼ初めてのチーム開発ということで、外部の人(お客様)、内部の人(チームメンバーなど)とのコミュニケーションに問題はなかったか、改善できるところはないかを、毎日の夕礼や、各フェーズの最後の報告会で特に細かく指摘することにしました。

技術面でも成長してもらう

とは言え新卒のみなさんはエンジニアなので、コミュニケーションスキルだけではなく、技術面でも成長してほしいと考えました。今年度は私がプロジェクトの開発サイクルの回し方やソースコードレベルまで見て、不十分だと思う点については、補足講義やコードレビューなどの形でサポートすることにしました。

新卒のみなさんの精神的サポート&エンジニアとしてのキャリアパスについて一緒に考える

開発期間が短く、チーム開発に不慣れなため、仮想プロジェクトは新卒のみなさんにとってかなりハードなものになることが予想されます(実体験)。特に精神的な疲れが増してくることが予想されるので、引き続き毎日の夕礼や日々のコミュニケーションで、新卒のみなさんの精神的サポートを行うことを心がけました。

また、去年の自分の反省として、仮想プロジェクト期間中は目先の開発に集中しすぎてしまい、研修後の配属のことや、自分のエンジニアとしてのキャリアパスについて研修中に考える余裕がほとんどありませんでした。今年度は、仮想プロジェクトのことから少し離れて研修後の配属や自身のキャリアパスなどについて一緒に考える時間を、研修中のどこかで設けようと考えました。

仮想プロジェクト期間中に行ったこと

仮想プロジェクト中は基本的に会のセッティングなども新卒のみなさんで主体的に行ってもらいました。仮想プロジェクト中に研修担当側が行ったことも、基本的には新卒のみなさんが行ったことに対するフィードバックだったため、行ったことを箇条書きにしづらいのですが、抜粋すると以下のことを行いました。

  • 補足講座
  • 面談
  • 夕礼での進捗報告に対するフィードバック
  • 各フェーズごとの報告会・その後の反省会でのフィードバック
  • 最終発表会での最終フィードバック

 

補足講座

4月で学んでいないが開発をする上で必要な知識については、補足講座という形で私から新卒のみなさんに講義を行いました。例えば、以下のような講義です。

git講座

開発フェーズに入った頃、gitを使ったバージョン管理の経験がない人が多くいたこともあり、それぞれが思い思いにAWSコンソール上でLambda関数のコードを書いていました。そこで、gitに関する補足講座を行い、gitの基本的な使い方や、リモートリポジトリをGithub上に作成し、ブランチの切り方、マージの仕方、コンフリクトが生じた時の対応などの演習を行いました。

非同期処理、Promise講座

AWS SDKを用いたAWSリソース情報の取得は基本非同期で行われるため、開発が進むにつれ、非同期処理の扱いに苦労している様子が見受けられました。そこで、非同期処理について改めて学ぶ補足講座を行い、その後、実際に新卒のみなさんが書いているコードのどこに問題があるのか、なぜ想定通りの動きをしないのかを一緒に考えました。また、最後に新卒のみなさんのコードを、Promiseを使って一緒に書き換えたりもしました。

面談

研修期間中、複数回面談を行いました。去年は配属先の希望を聞く面談を研修終盤に1回実施しただけでしたが、今年は去年より面談回数を増やし、より手厚く新卒のみなさんのサポートを行いました。また、私が企画した面談(私と新卒のみなさん×5回)では、業務内外での悩みを聞いたり、研修後の配属や自身のキャリアパスなどについて一緒に考えたりしました。

新卒のみなさんとの1対1での面談の実施に際しては、ヤフー様で行われている「1on1ミーティング」を大変参考にさせていただきました。
下記書籍にて非常に貴重な知見を共有していただき、誠にありがとうございます。

ヤフーの1on1―――部下を成長させるコミュニケーションの技法

夕礼での進捗報告に対するフィードバック

4月に引き続き、夕礼は毎日行いました。そこでは、当日のプロジェクトの進捗報告をしてもらうと同時に、チームレベル、個人レベルでの懸念点や疑問点を話してもらい、それに対して研修担当の私からフィードバックをしました。また、プロジェクトの進捗報告は夕礼後にAWSチーム内で共有を行い、プロジェクトの進め方で指摘すべき点はないか、きちんとチームで開発ができているかを他のメンバーと逐一確認していました。

各フェーズごとの報告会・その後の反省会でのフィードバック

最終発表会でのフィードバック

これらに関しては事前に研修担当側が何かを用意するということはなく、新卒のみなさんが自分たちで考えて実行したことに対して、研修担当側から気になる点や、こうしたらもっと良くなる点などをフィードバックしました。各フェーズごとの報告会・反省会には、普段の夕礼と違い、AWSチームリーダーの鹿倉や、開発経験・マネジメント経験の豊富なエンジニア田部井、平井も参加して、より多くの指摘・アドバイスを新卒のみなさんに行いました。その甲斐もあり、6月末の最終発表では、社長の長谷川も絶賛するほどの素晴らしい成果物とプレゼンを披露することができていました。仮想プロジェクトの成果物などについては、新卒の誰かが後日書いてくれるかもしれません。

研修を終えて

最後に、研修を終えて感じたことを書き連ねたいと思います。

研修で学んだこと

地味でも毎日コツコツサポートを続ける重要性

今回の研修で4月、5〜6月にそれぞれ設定していた研修目標は、大方達成することができました。4月の最後のプログラミングテストを見た時は、入社時とは別人のような成長を感じましたし、仮想プロジェクトの最終発表でも、初期とは比べものにならないほど落ち着いて、伝えるべきことを簡潔に伝えることができていました。これは、もちろん一番は新卒のみなさん一人一人の努力の賜物なのですが、事前に入念に準備したカリキュラムや、毎日の夕礼や報告会で細かくフィードバックを行ったことも、その成長の一助となったのではないかと思います。地味でも毎日コツコツ、研修を受けているみなさんのサポートを続けることが、研修を成功させるためにはとても大切なことだと感じました。

来年に向けての反省点

4月の研修が、単に技術を学ぶだけにとどまってしまった

4月の社内技術研修についてですが、書籍や動画を見て学ぶことが多かったこともあり、単なる技術の学習にとどまってしまったな、と感じています。せっかく社内で研修を行っているので、実際に弊社で開発しているアプリがどのように業務に役に立っているのかを、東急ハンズの事例を紹介したりしながら学べる機会などがあれば、もっと良かったのではないかと思いました。実際に開発したシステムを使っているユーザーをイメージできた方が、仮想プロジェクトに対する士気もさらに高まったかもしれません。来年度はAWSチームだけでなく、東急ハンズのシステムを内製しているチームなどとも連携しながら、今年度よりさらに良い研修にしていきたいと思います。

研修担当、1人はつらいよ

今回チーム内のリソースの問題もあり、社内での講義や夕礼などは、ほぼ全て私が担当する形となりました。来年度は、少なくとも2人以上はいた方がより手厚い指導やサポートができるのではないかと思います。また、私は新卒2年目のエンジニアということで、新卒のみなさんと年齢や境遇が近く、質問や悩みを相談しやすいというメリットがある一方で、実務経験を踏まえたアドバイスは、経験のあるエンジニアほどできないというデメリットもあります。来年度は、実務経験が豊富なエンジニアと若手のエンジニアの両方が研修にメインで携わるという体制が、より良い形なのではないかと思いました。

おわりに

6月に無事研修を終え、新卒のみなさんは7月から各チームへと配属となりました。AWSチームに配属された人はいないので(泣)、業務中はやや遠目からみんなの様子を見ることが多いのですが、各々配属先で自分の役割をしっかりと果たしていて、頼もしい限りです。また最近は、新人のみなさんを先輩エンジニアがチームの垣根を超えて指導する機会も増えてきており、弊社の教育熱の高まりを感じています。私も新卒研修担当としての役目は終えましたが、これからはこの新卒研修で得た知見を、弊社の教育体制をより良くするために生かしていきたいと思います。

以上で、今年度の新卒研修のまとめは終わりとなります。
最後までお読みいただき、誠にありがとうございました。


ハンズラボ新卒研修2017 (1/2) 〜カリキュラム編〜


上の画像の文字には、FIGletを使用しました 公式サイト

こんにちは、エンジニアの三井田です。

新卒採用受け入れ2年目となったハンズラボは、今年も5名の新卒エンジニアが入社し、4〜6月の3ヶ月間、新人研修を行いました。

6月末に新人研修が無事に終了し、7月から新卒のみなさんが各チームへ配属となりました。7月から始まった私の開発も少し落ち着いたので、今回は2017年度のハンズラボ新卒研修について、講師の視点から備忘も兼ねてまとめようと思います。

他企業様で新卒研修に関わっているみなさまの参考に少しでもなれば幸いです。

前提

今年の弊社新卒について

最初に、今年の弊社新卒について簡潔に説明します。

今年は、IT経験者4名(情報系学部・専門学校卒)、未経験者1名(語学系学部卒)の計5名の新卒エンジニアが入社しました。

経験者のプログラミング経験に関しては、授業でCやJavaなどを学習した人が多く、ネイティブアプリ開発を学校で学んでいた人もいました。しかしながら、各々が実際どのくらいコードを書けるかは、選考時にコーディングのテストを行っていないため、入社するまで分からない状態でした。

未経験者は、IT未経験だったものの、内定後から入社まで週2〜3回のペースで弊社でアルバイトをして、プログラミングの基礎的な勉強をしてから入社した、という状況です。

2017年度新卒研修の指導体制・方針について

次に、弊社の2017年度新卒研修の指導体制について説明します。

AWSチームで担当する

2017年度の研修は、R&Dその他もろもろを行っているAWSチームが担当することになりました。また、プロジェクトの稼働率等の問題から、他のチームの人への講義などの依頼は、よほどその人にしかできないことでない限りは避ける、という制約がありました。

* AWSチームに関する詳しい業務内容は、同じチームで働く百木田(からきた)がこちらにまとめております

まずは、アプリケーションをしっかりと開発できるようになってほしい

「バーサタイリスト(なんでもやる人)を育てる会社」を謳っている弊社ですが、新人、特に新卒エンジニアには、まずはアプリケーションをしっかりと開発できるようになってほしいという方針があります。故に今年度の新卒研修は、当初はインフラ系の研修時間を多くとっていましたが、最終的にはアプリケーション開発中心のカリキュラムとなりました。

以上を踏まえてチーム内で議論した結果、チームリーダーの鹿倉を除いたAWSチームの中で、比較的アプリケーション開発経験のある私が、新卒研修のメイン担当となりました。

私について

今年度の新卒研修を担当した私、三井田に関してですが、実は去年の3月に学部(情報科学専攻)を卒業した2016年度新卒なので、去年は新卒研修を受ける側でした。ハンズラボに入社後、3ヶ月の新卒研修を経て配属されたチームで、ECサイト・スマホアプリのAPIや管理画面の開発などに携わった後、今年の2月からAWSチームに移籍しました。実務経験豊富な熟練エンジニアではありませんが、新卒のみなさんと年齢や境遇が近い分、同じ目線に立って研修をすることが少しはできたのではないかな、と思っています。

研修目標

研修を行うにあたって、以下の3つの研修目標を立てました。
1. 自走できるエンジニアになる
2. ユーザーの要求に応えることができるエンジニアになる
3. 共に開発する仲間を大切にできるエンジニアになる

1. 自走できるエンジニアになる

受け身ではなく、主体的に問題を解決する力

  • 自分で本やWebサイトを使って調べる、分からないところを具体性を持って人に聞く

 

自分が書いたコードに責任を持つ

  • 自分で考えてコードを書く。自分がなぜそのようなコードを書いたのか人に説明できる
  • 脆弱性のないプログラムを書く。指示されていなくても、常にセキュリティのことは念頭に置いておく

 

2. ユーザーの要求に応えることができるエンジニアになる

* ユーザーが言ったことは全て二つ返事でやらなければいけない、という意味では決してありません!!

自分が開発したものは、必ず誰かに使われる

ユーザーの要求・要望に対して、全て「難しいからできません」では、次から何も頼まれなくなります。ユーザーの要求に応えるためには、以下の2つの力を養うことが必要だと考えました。

  • ユーザーの要望を正確に理解する力(根気強くユーザーとコミュニケーションをとることが必要)
  • ユーザーの要望を実現する技術力

 

(+α)ユーザーの潜在的な要求・要望に応えられる力も、ゆくゆくは身につけてほしい

また、ユーザーは必ずしも技術的な専門家ではないため、ユーザーから言われた要望だけに応えるのではなく、ゆくゆくは、ユーザーが言語化できない不満・欲求も汲み取って解決できるエンジニアを目指してほしいです。
 

3. 共に開発する仲間を大切にできるエンジニアになる

会社では、1人で開発することはほとんどなく、チームで開発を進めていくことになります。故に、チームで開発する際には、以下の点を意識してほしいと考えました。

開発に関わる全ての人たちをリスペクトしよう

 

独りよがりの開発はやめよう

  • 例:自分だけが分かるプログラム
  • 他の人が後でそのプログラムを修正するかもしれない!

 
 

4月

〜自走するために必要な、開発の基礎力育成フェーズ〜

研修内容

4月の研修内容は以下の通りです。

  • 経験者・未経験者問わず5人全員一緒に研修
  • JavaScriptのeラーニング・社内講座を通して、プログラミングの基礎的な知識を学習
  • 終盤は、jQuery・Node.jsの座学・演習を通して、Webアプリケーション(クライアント・サーバモデル)の仕組みを、実際に手を動かしながら理解する

 

4月の研修で身につけてほしいこと

  • 開発するために必要な基礎的なプログラミング技術
  • 自分で考えてコードを書く力
  • 分からないところが出てきたときに、それを主体的に解決する力
     

(補足)JavaScriptの選定理由

賛否両論あるかと思いますが、今年の新卒研修で学ぶ言語は、JavaScriptを選択しました。主な選定理由は以下です。
1. フロントエンドもサーバサイドもJavaScriptで書ける
2. Web開発をする上で避けて通れない
3. Node.jsの、社内での採用実績

1. フロントエンドもサーバサイドもJavaScriptで書ける

JavaScriptという1つの言語を学ぶことで、フロントエンドもサーバサイドも実際に手を動かしながら学ぶことができます。4月に社内で研修ができる期間は、外部研修を除くと実質12日程度しかありませんでしたが、学ぶ言語を一つに統一できたことで、プログラミングの基礎からWebアプリケーションの仕組みまで、一通り学ぶことができました。

2. Web開発をする上で避けて通れない

さらに、弊社は一部iOSネイティブアプリを開発するチームがあるものの、アプリケーションを開発しているほとんどのチームは、Webアプリを開発しています。現在、フロントエンド開発ではJavaScriptを使うことはもはや避けられないため、よく「難しい」「クセがある」と敬遠されがちなJavaScriptを、しっかりと指導できるこの研修期間中に体系的に学んでほしい、という思いもありました

3. Node.jsの、社内での採用実績

また、一時期社長の長谷川が、フロントエンドもサーバサイドもJavaScriptでやることを推進していたこともあり、社内の多くのプロジェクトのサーバサイドにNode.jsが採用されています。サーバサイドをNode.jsを使って学ぶことで、研修後の配属先で一からNode.jsを学ばなくてよくなる、というメリットもありました。
 
 

5月、6月

〜ユーザーの要求に応えられるエンジニア、チームで円滑に開発を進められるエンジニアになるための「仮想プロジェクト」演習〜

仮想プロジェクト

もはやハンズラボ恒例の仮想プロジェクト、今年もやります。去年の仮想プロジェクトの模様は以下のリンクからご覧いただけます。

 
今年も仮想プロジェクトという名前自体は同じですが、研修内容が違うこともあり、主に以下の点が昨年と異なります。

  • 仮想お客様であるAWSチームからお題を出して、それを開発してもらう
  • 開発言語は、4月に勉強したJavaScript

 

なぜ仮想プロジェクトをやるのか

「配属後に実際のプロジェクトで経験するであろうことを、なぜこの研修期間でやるのか」「座学や、課題を与えて解いてもらう時間をもっと増やした方が良いのではないか」と社内でも議論になりました。弊社がそれでも新卒研修期間に仮想プロジェクトを行う理由は、以下の2つです。

仮想プロジェクトは、失敗できる

実際のプロジェクトではお客様からお金をいただいて開発するため、失敗はできません。しかしながら、仮想プロジェクトは仮想なので、最悪大失敗に終わっても大丈夫(?)です。

失敗する前に注意されるよりも、失敗して自ら学んだ方が印象に残りますし、学びは大きいと考えます。仮想プロジェクトで失敗を恐れず大胆に行動し、失敗から大いに学んでほしいと思っています。

主体的な行動・意思決定ができるようになってほしい

配属後のチームでは、おそらく立場としては一番下で、しばらくは上司・先輩から与えられたタスクをこなしていくことになります。しかしながら、仮想プロジェクトではチームメンバーは全員同期であり、仮にリーダーを決めたとしても、配属後のプロジェクトよりは自分で考えて行動する機会が多くなります。

配属後に、ただの作業員ではなく主体的に業務に取り組むエンジニアになるため、仮想プロジェクトで、組織の一員として主体的に行動・意思決定をする経験を積んでほしいと考えました。

5月、6月の研修で身につけてほしいこと

5、6月の仮想プロジェクトで身につけてほしいことは、以下の3つです。
1. 実際に開発をする上で必要となる力
2. チームで円滑に開発を進める方法・マインド
3. スケジュール遅延による影響と対策を知る

1. 実際に開発をする上で必要となる力

学校の授業や4月の研修で、開発するために必要な技術・知識を学んだだけでは、すぐに実務で開発を始めるのは難しいことが多いです。
具体性を持ってお客様、チームメンバーに聞くなどの質問の仕方であったり、分からないことを調べるスピード力であったり、実際に開発をする上で必要となる力をこの仮想プロジェクトで身につけてほしいと思います。

2. チームで円滑に開発を進める方法・マインド

チームメンバーに技術面で差がある中で、作業の早い人が自分だけでやろうとしてしまうと、その人の負担がどんどん増えてしまいます。技術面に差がある中で、どのようにタスクを分担すればチームで円滑に開発を進められるのかを、仮想プロジェクトで考え、学んでほしいと考えました。

加えて、適切なコミュニケーションの取り方も仮想プロジェクトで最も学んでほしいことの一つです。一口にコミュニケーションと言っても、チーム外の人とのコミュニケーション、チーム内の人とのコミュニケーション、根回し(何かを依頼したり企画したりする時は、早め早めにアポ取りなどの行動をする)など、いろいろな種類があります。コミュニケーションスキルは、研修中だけではなく配属後も必要不可欠なスキルになるので、ぜひ、この仮想プロジェクトでたくさん失敗し、適切なコミュニケーションの取り方を学んでほしいと思います。

3. スケジュール遅延による影響と対策を知る

初めてのプロジェクト開発かつ開発期間が短いと、スケジュールはどうしても遅れてしまうことがあります。去年の仮想プロジェクトも、終盤にスケジュールの遅延がありました。プロジェクト中にスケジュールが遅延してしまった時に、その影響を正しく把握し、適切な対策を講じることができるようになってほしいと思います。

新卒研修のカリキュラムに関しては以上です。
 
 

実際の3ヶ月の研修はどうだったのか?

ここに書くと長くなり過ぎてしまうので、その模様は後日また書きます。

大変な3ヶ月間でしたが(笑)、忘れられない貴重な経験をすることができました。

近いうちに更新するので、そちらもぜひ読んでいただければ幸いです。
それでは、今回はこの辺で。最後までお読みいただきありがとうございました。


新卒1人仮想プロジェクト完了しました


はじめに

ハンズラボの新Macbook Proを手にした新卒の村上です。新卒研修のメインである1人仮想プロジェクトが12/9に完了したので忘れないうちに書いておきます。

えっ!?この時期に新卒研修?

と思うのが当然ですが、実は私が大学院を中退し10月中旬に入社して1人で仮想プロジェクトを行ったというわけです(さみしっ)。私も入社前に今年度の新卒の研修記事を参考にして入社したので特にハンズラボに入社を考えている方々の参考になれば嬉しいです。

仮想プロジェクトの概要

仮想プロジェクトといっても、今年度の新卒4人で行った仮想プロジェクトもそうかもしれませんが、作るものに関して具体的な要件があったわけではないです。
「何か世の中のためになりそうなものをつくって。利益出しても良いからw」
といった感じだったので、自分が欲しいサービスを作れるというわけです!(もちろん、みんなにも使ってもらいたい)。

うーん、何を作ろうか… 技術的に簡単すぎても研修にならないし、難しすぎても終わらないし。何より1人だし…

ちなみにスケジュール見積もりは以下のようになりました。

  • 企画:7日
  • プロトタイピンング:3日
  • 設計:2日
  • 実装:16日
  • テスト:3日
  • リリース:2日

 

何をつくったのか

企画発表スライド

企画の段階で社員の方々に発表した際の資料です↓(アニメーションは動かない)

 

貸し借りサービスの難しさ

スライドにもありますが当初5つの案があり、Slackで社員の方々に投票を呼びかけ、その結果を踏まえて工具共有アプリを作ることにしました。既存競合サービスを考えると、「メルカリ アッテ」や「Anytimes」になると思います。それらのサービスと違う点は、アイテム領域を工具のみに絞っているところと、売買でなく貸し借りをサポートするサービスであるという点です。

特に考える必要があったのは、貸し借りサービスはメルカリ アッテのような売買サービスとは違い、売って終わりではないという所です。スライド中で二つの壁という表記がありますが、

  1. レンタル中のレンタル品の劣化
  2. 借主がレンタル品を返さない

ということを考慮する必要がありました。1つ目については工具の劣化のしずらさでカバーできると思い、2つ目については質代制度というものを考えました。
これは貸主が借主がレンタル品を返さない場合または大きく劣化した場合に備えて、あらかじめ貸主が借主からレンタル代に加えて質代としてお金を預かっておくという制度です。

とテキトーなことを言いましたが、この制度がうまくいくかどうかはわかりません。結局開発に入ってからはサービスが上手くいくかどうかを考える余裕はなく、開発に専念していたため今でもベストな解は導けてません。運用側で保障することを考えればもっと他に手はあるかもしれません。この辺の難しさが貸し借りサービスが(私の知る限り)ほとんど存在しない理由ではないかと1人考えていました。

具体的なサービスの流れは上記スライドにもありますが、プロトタイピングの時点でAdobe XDを使ってモックを作りましたのでよければ見てください(サイドナビゲートバーの項目を選択する際に面倒があります)。

どのようにつくったのか

私の技術レベルなのですが、情報系の学科出身なので基本情報技術者試験程度の知識はありました。Web開発については入社前にDjangoの参考書を一読していたという程度で自分で企画してサービスを構築するというのは初めてでした。

開発環境

  • Python 3.4
  • Django 1.8, Django Channels
  • Bootstrap3
  • sqlite

 

DjangoとはPython用のWebフレームワークです。RubyでいうRuby on railsのようなものです。他にもPython用フレームワークはFlaskやPyramidなどがありますが、最も多くのユーザに使われているものがDjangoです。フレームワークを語るときによくMVCモデルと耳にしますが、DjangoだとMTV(Model, Template, View)モデルがそれに対応します(厳密な定義はないですが)。Djangoはユーザ管理機能(ユーザ登録、ログインから、パスワード変更など)の多くの部分のロジックを用意してくれているのでテンプレート(html)を書くだけでそれらを実現できたりします。また、モデル定義からフォームを作成することができるので、html内でformタグやinputタグなどを使わずにフォームを作成することもできます。他のWebフレームワークをほとんど使ったことがないので比較ができませんが、とても使いやすくお気に入りです。
ちなみに社内には業務でDjangoを使っている人はおらず、もしDjangoエンジニアで弊社に興味がある方がいれば、私と共にDjango(Python)勢力を拡大していきましょう!! 現状は謎テクノロジー、ユニケージ(Bash)とPHPで書いている方が多いです。

機能一覧

  • ユーザ登録、ログイン(facebookログイン含む)、ログアウト、パスワード変更とリセット
  • アイテム(工具)のCRUD機能
  • アイテムへの応募
  • チャット
  • 評価

 

特に苦労した点は、UIとチャットです。UIはBootstrapがなければとても間に合いませんでしたし、チャットはDjango Channels(Websocketを実装するためのライブラリ)のおかげでなんとか実現できました。
当初評価機能まで考えていたのですが、時間的に間に合わず断念しました。

つくったアプリの画面

ログイン画面
ログイン画面
ホーム画面
ホーム画面
チャット画面
チャット画面
今後はチャットのUIの改良 また、評価機能、検索機能を付け足して社内だけでも公開して意見をもらいたいなと思っています。

おわりに

上記ではサービス概要や開発環境について書きました。もう一度一人で仮想プロジェクトをやるとすれば、今回は実装量として一人でやるには多かったのでもう少しコンパクトですぐにみんなに使ってもらえるようなアプリを作りたいです。
研修の1ヶ月半ほどの間、ほとんど毎日先輩社員のTさんと人事担当のAさんに進捗を報告する時間とプロジェクトが遅延した場合の対処法を教えていただいたりして、プロジェクトを円滑に進められるよう助けていただきました。また、仮想プロジェクト以外にも社会人マナー、東急グループ内のハンズラボの位置付け、プロジェクト管理、ソフトウェアテストについても教えていただきました。この場を借りてお礼を言いたいと思います。ありがとうございました。現在、私は既にチームに配属され日々、PHP、bash、AWSの勉強をしながら業務にあたっています。


新卒新入社員の仮想プロジェクト、完了しました


大石です。
最近、弊社では専らPokemonGOが流行っています。
23区外にある自宅で何時間もアプリを起動しておくよりも、オフィスで昼休みにササッとプレイする方が捗ります。
うっ、ドードーが捕まえてほしそうな目でこちらを見ている……。

さて、先日、新卒新入社員だけで仮想プロジェクトやってますの中で、研修で行っていた仮想プロジェクトについて書きました。
6月末、仮想プロジェクトを終えましたので、今回はその話を書いていこうと思います。

前回のおさらい

時間と技術面のみの制限だけで自由にシステムを作ることになった新人4名。
自社のオフィスで使える蔵書管理システムをサーバレスで作って、先輩たちをぎゃふん(死語)と言わせてやるんだ……!
バックエンドでAWSを活用してサーバレスに、フロントエンドはPC画面の作成と同時にmonacaを使ってスマートフォンのハイブリッドアプリに挑戦。
果たして、無事に蔵書管理システムは出来上がるのか!?(謎の予告風

蔵書管理システム

誰がどの本を借りたのかを記録し、貸し出し状況を社内で共有できるような「オフィス特化型蔵書管理システム」。
最終的に以下のような機能をリリースしました。

機能

  • 借りる
  • 返す
  • 予約
  • 蔵書の検索・結果の表示
  • 蔵書の新規登録・削除
  • 予約の通知(予約が入るとその本を借りているユーザーへSlackで通知)
  • 人気の本ランキング(1週間に借りられた回数がより多い本を5位まで表示)
  • 本が借りられた履歴
  • ユーザが本を借りた履歴

 

フロントエンド

構成

  • HTML5:マークアップ
  • CSS3/Bootstrap v3.3.6:レイアウトのコーディング
  • jQuery v2.2.4(モバイルはv2.0.3):バックエンドとの通信、DOM処理
  • JavaScript:jQueryでできない処理を行う
  • Monaca:モバイルアプリ(ハイブリッド)の開発プラットフォーム

デザイン

PCの画面↓
BooKing_PC
スマホアプリの画面↓
BooKingiphone
UI・UXに考慮し、操作性に違和感が無いようにボタンなどを既存のアプリと同じような配置にしました。
また、同時に同じ本を借りられないようにするなど、ユーザが通常は行わないような動作をしないようにし心がけました。

バックエンド

AWSの構成

技術要件

  • API Gateway:APIの管理
  • Lambda (Python):DBアクセス、ランキングを定期的に作成
  • DynamoDB:永続データの保存
  • Cognito:ユーザ管理

 

開発方法について

スケジュール

  • 企画立案・決定:4日
  • プロトタイピング・設計:4日
  • α版実装:5日
  • 基本機能実装:8日
  • 付加機能実装:3日
  • テスト:5日
  • リリース・運用:2日

実際に作業できる日数は31日でした。
やはり実装に手惑い、テストが押せ押せな感じに……。
とはいえ、じっくり実装したおかげか致命的なバグはあまり無く、なんとかなったように感じます。

開発での技術的課題 フロントエンド

  • HTML, CSS, JavaScript (jQuery):研修で一切やらなかったため、慣れるまでに時間がかかった
  • OS依存のバグが、iOS、Androidそれぞれ1件ずつ発生した。どちらも実装方法を変えることで対処できた(重大なものは無かった)
  • 時間的制約でユニットテストができなかった

 

開発での技術的課題 バックエンド

  • 当初はAWS SNSも用いたプッシュ通知を予定していたが、時間の制約のため断念

 

チーム開発する上での課題

  • 共有不足:API仕様書の更新時の周知などができなかった。その解決策として朝礼、夕礼、昼休憩後など、細かに共有の時間を設けた
  • レビュー不足:UI設計やAPI設計など、設計者の一存で決まってしまったところが多かった

 

先輩社員の反応

6月末、先輩たちに向けてこの仮想プロジェクトの最終発表を行いました。
無事出来上がった蔵書管理システムを見た先輩たちから、褒め言葉をもらうことができました!1ヶ月半の短い中でこんなすごいものが作れるとは思わなかった!と。
さすがに死語であるぎゃふん!とは言わせることはできませんでしたが……(笑)

研修を終えて

研修を終えた今、私たちはそれぞれチームに配属が決まりました。
情報系卒の2名は既に業務に入っていますが、非情報系2名(うち一人は私)は実際の業務に近いことを演習のようなスタンスで勉強しています。
PythonでLambdaを書く日々が、黒い画面でシェルスクリプトを書く日々に変わりましたが、勉強が大切であることには変わりません。
日々の業務に追われる前に、様々なことを身につけていけたらなーと思います。


新卒さん向けデザイン基礎研修をやりました。1回目 “デザインってなに?”


こんにちは。田名網(たなあみ)です。

以前の投稿「新人研修(技術以外のところ)を考えて、やってみた話」
を踏まえ、デザイン研修をした話です。

ハンズラボはエンジニアメインの会社ですが、
実はグラフィックデザイナ1人とUXデザイナ1人(私)もひっそりと生息しております。

わたしについて

ひっそりと生息しているわたしが、普段何をやっているのか、まず紹介させてください。

ラボでは主にUXの設計・監修と、UIのデザイン、フロントの実装などをやっております。

簡単に言うと、ユーザが触る画面やその動きが、美しく使いやすいものであるようにするため、
絵を描いたり、コードを書いたり、(文句を言ったり)、使い心地を聞いて回ったりするお仕事です。最近の大きいプロジェクトですと、東急ハンズの内製POSである「HandsPOS」のUXデザインを担当しました。
店員さん側もお客さん側も大画面のiPadを使用し、
自動釣銭機、レシートプリンタとも接続され、複雑な取引や割引、ポイント使用/付与などもできながら、東急ハンズの膨大な商品数100万SKUをさばける子です。
操作面で店員さんの負担を軽減しようと、あらゆる箇所を熟考しました。
HandsPOS

全国順次入替に行っております。お目にかかることもあるかもしれません。

では自己紹介はこのへんで。

デザイン、飾りじゃないよ

「デザイン」というと、
外装を飾るスタイリングの話だ、とか、重要ではないプラスアルファの世界だ、と捉えられてしまいがちです。
しかし、デザインとは本来「設計」であり、計画的にプロダクトやサービスをつくることそのものなのです。
ということを、これからエンジニアとしてごりごりやっていく新人みなさんをデザインネイティブキッズにすべく、まず伝えたかったのでした。
この研修については、3回分の日程をとりました

– 1日目:「デザインてなに?」(UXデザイナ田名網担当)
– 2日目:「いろとかたち」(グラフィックデザイナ北田担当)
– 3回目:「UX / UI について」(UXデザイナ田名網担当)

今回は1回目の「デザインてなに?」のお話です。

本題、研修内容

– 3回分のうちの1回目
– 座学2時間(講義:質問 = 8:2)
– 達成できること:デザインは何のためにあってどういうことなのか、自分なりに説明できる

早速ですが、用意したスライドはこちらです。

講義のあらすじ

スライドは以下のような内容で話を進めました。

デザインを取り巻く言葉の整理

デザインは
– 目的(課題解決)のための計画と工夫のこと
– 美感を起こさせる見た目と機能が必要

デザインはデコレーションじゃない
– でもデコレーションは表現方法の一つ

デザイン領域について

デザイン思考になろう
– どうしてこうなっているのか 、どうしたかったのか、どうさせたかったのか
– 形状・色・配置の意図を探る

感覚の体験
– グラフィックやピクトグラムの例
– 有名プロダクトの例

デザインはいろいろな領域を横断して考える→なんのため
– 東急プラザ銀座の例

このデザインをしたら、どんな世の中になるのか考えよう

まとめ
– すべてのデザインに理由を持とう
– 本質的な目線になろう
– 人間、社会について知ろう
– 何が美しいと感じているのか五感で捉えよう
– 本はいっぱい読もう

詳しい内容は、スライドを見ていただくとして、この記事内では割愛します。

図や写真が多いと伝わりやすいので、例やサンプルを数多く見てもらうよう心がけました。
デザインは感覚的・情緒的な部分も大切な要素ですし、言葉で説明できない部分を感じてもらうことができたと思います。

デザインの重要性

デザインするということのなかで、情報設計のパートが大事な要素でもあるので、表面上の体裁を整えること以前に、「なにを」「だれに」「どのように」作用させるのか、本質的な視点と考え方を持つことが重要です。

デザインの「目的」を明確にするために、理論的な視点を得、
デザインを「手段」として利用するために、実践的なノウハウを仕入れる。
まずはそのデザインすることの立ち位置や、必要性について、この回でしっかり解説できました。

みんなの反応は?

実際に新卒エンジニア4人のみなさんの中でも、もともとデザインに興味があったり、重要性を理解してくれていた方もいたようで、
早速仮想プロジェクト( 新卒新入社員だけで仮想プロジェクトやってます )のなかでもユーザビリティについて考えてくれたりしておりました。
感心感心です!

わたしの反省や感想

私の話をさせてもらえば、もともとは自身が手をかけるよりかは、考え方を考えて、その考え方を伝えていきたい、という思いがありました。
実際に私が普段から取り組み、考えていることを、ひとに伝わるように言葉にし、資料にまとめるということが、自分自身の考えをブラッシュアップさせるためにもとてもいい勉強になりました。
自分が理解できていない部分も明確になって、いい機会です。
発表するって大事だなと!

よいサービスやプロダクトをつくっていく手段として、デザインが受け入れられ、利用していってもらえれば嬉しいです。


12