Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Hatena Engineer Seminar #23「新卒研修で気軽に『ありがとう』を伝え合える Slack アプリを開発した話」

SlashNephy
January 25, 2023

Hatena Engineer Seminar #23「新卒研修で気軽に『ありがとう』を伝え合える Slack アプリを開発した話」

22年4月入社のエンジニア4人でチームアップし、新卒研修の一環として、従業員間で気軽に感謝の気持ちを送り合える Slack アプリ「はてなピアスター」を開発しました。今回は、この「はてなピアスター」のチーム開発を通して考えたことや実践したこと、学んだことについてお話しします。

SlashNephy

January 25, 2023
Tweet

Other Decks in Programming

Transcript

  1. 新卒研修で気軽に「ありがとう」 を伝え合える Slack アプリを 開発した話 id:SlashNephy / @SlashNephy 2023/01/25 Hatena

    Engineer Seminar #23 1
  2. 自己紹介 id:SlashNephy • 組織・基盤開発本部 • サービスプラットフォーム チーム • Web Application

    Engineer 2
  3. 3 はてなの エンジニア新卒研修

  4. エンジニア新卒研修 2022 • スケジュール ◦ 5営業日 (2022/4/6 ~ 4/12) •

    メンバー ◦ 出会って間もない新卒エンジニア 4人でチームアップ 4
  5. エンジニア新卒研修 2022 • 内容 ◦ 社長からお題が与えられて、期間中に開発 ◦ 成果物を全社に発表 • 社長のお題

    ◦ 「はてなピアスター」を開発して、社内公開する 5
  6. 6 「はてなピアスター」 とは?

  7. 「はてなピアスター」とは? ゴール • 従業員同士で感謝の気持ちを気軽に伝えたい • 良い働きが賞賛されるようにしたい 7

  8. 「はてなピアスター」とは? • ピアボーナスを参考に ◦ peer = 同僚、bonus = 報酬からなる造語 ◦

    従業員間で少額のインセンティブを送り合う制度 8
  9. 「はてなピアスター」とは? • 「はてなスター」をモチーフにした ◦ 記事やコメントにスターを付けて、気持ちを表現 ◦ https://s.hatena.ne.jp • 感謝の度合いに応じ、★ ★

    ★ を送り合う 9
  10. 10 これが 「はてなピアスター」です

  11. 11 起動 • Slack のショートカッ トから 「はてなピアスター」 を起動 • スラッシュコマンド

    /peerstar からも可
  12. 感謝を贈る • 「はてなピアスター」 を起動した画面 • 宛先・スターの種類・ 感謝の気持ちを入力す るフォームが出現 12

  13. 感謝を見る 送信されたメッセージは #peer-stars チャンネルに 投稿される 13

  14. 14 仕様検討

  15. 15 大事にしたこと • 気軽さ 従業員同士で気軽に感謝の気持ちを伝えたい • 感謝してもされても楽しい 継続的に「はてなピアスター」を使ってもらう

  16. 気軽さを実現するために • 快適な UX ◦ 社員は Slack を普段使いしている ◦ Slack

    アプリで体験を良くする ▪ スラッシュコマンド / ショートカット • 無限に送れるイエロースター ★ ◦ 些細なことでも送り合える 16
  17. 気軽さを実現するために • 公開される (されない) メッセージ ◦ レベルアップ通知 (後述) は本人だけ ◦

    spam にならないように 17
  18. 感謝してもされても楽しい • レアなスター ★ ★ は個数限定 ◦ ★ は毎月5個、★ は毎月3個

    ◦ レアなスターをもらえると嬉しい! ◦ 毎月カラースターを補充 18
  19. 感謝しても されても楽しい • 経験値システムを導入 • 感謝してもされても 経験値が得られる • レベルアップすると 楽しい

    • シーズン制も検討 19
  20. 20 開発の進め方

  21. 開発スケジュール • 研修は5営業日で ◦ 時間がない 😇 • 1日1スプリント ◦ 毎日小目標を立てて、動くものを作ろうという方針

    ◦ フィードバックをもらう 21
  22. 開発スケジュール • 定期的に会話 ◦ 毎朝 今日やることを話し合う会 ◦ 昼過ぎに進捗共有会 ▪ その日のタスクの状況について

    ◦ 終業前にふりかえり会 ▪ KPT フレームワークでひとこと • Keep / Problem / Try 22
  23. 開発言語を決める • はてな社内では最近は Go / TypeScript が 使われがち (参考: https://hatena.co.jp/recruit/engineer/technology)

    • Slack の Bolt というライブラリが良さそう ◦ https://slack.dev/bolt-js 👉 TypeScript + Bolt で開発することに 23
  24. デプロイ先を決める • AWS Lambda に CDK でデプロイ • Bolt の

    `AwsLambdaReceiver` が便利だった ◦ Lambda と API Gateway を繋ぎこんでくれるくん ◦ これのおかげで Slack のイベントを受け取れるようになる ◦ https://slack.dev/bolt-js/ja-jp/deployments/aws-lambda 24
  25. チーム開発の進め方 • 新卒エンジニア4人でチームアップ • Slack / Scrapbox / GitHub を使い分ける

    ◦ Slack: 連絡事項、PR・Issue・コミットの通知 ◦ Scrapbox: ノウハウや、ハマったところの共有 ◦ GitHub: Issue でタスク管理 25
  26. チーム開発の進め方 • 2人でペアプロ ◦ Discord で通話しながら ◦ VSCode Live Share

    の活用 ◦ 👍 ペアの方が相談しやすい・問題が解決しやすい 26
  27. 27 まとめ

  28. チーム開発のサマリー • 開発期間中に ◦ 179 コミット ◦ マージした PR =

    46 件 ◦ クローズした Issue = 42 件 • PR はなるべく細分化し、レビュアーの負担を 下げるように心掛けた 28
  29. 29 研修を通して学んだこと • 小さなイテレーションの重要性 ◦ 議論を長引かせるよりもまずは手を動かす ◦ フィードバック が得られやすい •

    ドッグフーディング ◦ 自分たちは満足できているか
  30. 「はてなピアスター」の今後 • 研修が終了しても開発には終わりはない ◦ 隔月ペースで 「ピアスター会」 を開催 w/ 社長 •

    今後も 開発合宿 などで新機能追加や改善を行う • 社長を中心に、会社の制度としてピアボーナスの 導入も検討されている 30
  31. まとめ • 与えられた要件から、細部まで仕様を検討し実装した • フィードバックをもとに改善するプロセスを経験した • チーム開発を経験することで、新卒⇄社員間の交流が深 まった • Slack

    アプリ開発は、エンジニアとしての基礎を学べた 良いカリキュラムだった 31
  32. 32 ご清聴 ありがとうございました!