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

HRBrainの生態系を支えるフロントエンドチームの取り組み / 2023-06-22-AwEngineerMeetup

HRBrainの生態系を支えるフロントエンドチームの取り組み / 2023-06-22-AwEngineerMeetup

Yuji Yamaguchi

June 22, 2023
Tweet

More Decks by Yuji Yamaguchi

Other Decks in Technology

Transcript

  1. HRBrainの生態系を支える
    フロントエンドチームの取り組み
    2023/06/22 #AwEngineerMeetup
    株式会社HRBrain 山口祐司

    View full-size slide

  2. 2
    AGENDA
    ● 自己紹介
    ● HRBrainについて
    ● 抱えている課題
    ● 改善の取り組み
    ● まとめ

    View full-size slide

  3. 自己紹介

    View full-size slide

  4. 4
    自己紹介
    ● ヤマグチ ユウジ(35)
    ○ SNS: @yug1224
    ● フロントエンドエンジニア
    ● 三児の父
    ○ 11歳、9歳、1歳
    ● 趣味/興味
    ○ オープンワールドゲーム
    ○ Home automation
    ○ Fediverse
    ● 2011/04 ソフトバンクモバイル株式会社
    ○ フロントエンドエンジニア
    ● 2016/01 株式会社サイバーエージェント
    ○ フロントエンドエンジニア
    ● 2016/10 株式会社リクルートライフスタイル
    ○ フロントエンドエンジニア
    ○ プロジェクトマネージャー
    ● 2021/10 株式会社ラクス
    ○ アシスタントマネージャー
    ● 2022/08 株式会社HRBrain
    ○ エンジニアリングマネージャー

    View full-size slide

  5. HRBrainとは?

    View full-size slide

  6. 6
    プロダクトラインナップ

    View full-size slide

  7. 7
    技術スタック

    View full-size slide

  8. マルチプロダクト × フロントエンド
    の課題

    View full-size slide

  9. 9
    マルチプロダクト × フロントエンドの課題
    ● 各プロダクトごとのドメイン差異
    ○ タレントマネジメント・人事評価・組織診断・労務管理
    ○ 共通化している部分はあるが、ドメイン知識すべてを流用することはできない
    ● コンウェイの法則
    ○ プロダクトごとのチーム構成
    ○ モノレポの中でアーキテクチャが分岐していってしまう

    View full-size slide

  10. 10
    マルチプロダクト × フロントエンドの課題
    ● 各プロダクトごとのドメイン差異
    ○ タレントマネジメント・人事評価・組織診断・労務管理
    ○ 共通化している部分はあるが、ドメイン知識すべてを流用することはできない
    ● コンウェイの法則
    ○ プロダクトごとのチーム構成
    ○ モノレポの中でアーキテクチャが分岐していってしまう
    プロダクト横断でUI/UXの統一が難しい

    View full-size slide

  11. 改善の取り組み

    View full-size slide

  12. ● デザインシステムとUIコンポーネントライブラリ
    ○ プロダクト横断で共有
    ○ 各プロダクトのデザイナーとフロントエンドエンジニアが管理
    ● プロダクト横断のフロントエンドオフィスアワー
    ○ 各プロダクトのフロントエンドエンジニアが集まる会を運営
    ○ 他にもプロデザ・バックエンド・テックリード軸のMTGもあり相互に連携
    ○ 任意のメンバーも聞けるようにオンライン上で開催し議事録も公開
    ○ 他にType-Challenge会や輪読会なども
    12
    改善の取り組み

    View full-size slide

  13. 13
    改善の取り組み

    View full-size slide

  14. 14
    改善の取り組み

    View full-size slide

  15. 15
    改善の取り組み

    View full-size slide

  16. 16
    改善の取り組み

    View full-size slide

  17. なぜこの取り組みをしたのか?

    View full-size slide

  18. 18
    コミュニケーション量の可視化

    View full-size slide

  19. 19
    コミュニケーション量の可視化
    活躍している人材ほど右上に位置

    View full-size slide

  20. ● コミュニケーション量を可視化した結果から
    ○ 活躍している人材ほどリアクション数・被リアクション数が多い
    ● コミュニケーションの活性化を促す施策が必要と判断
    ○ 活躍人材の再現性を高めるのが良いと考えた
    ○ コミュニケーションコスト増大のデメリットもありそうだが飲み込む
    20
    なぜこの取り組みをしたのか?

    View full-size slide

  21. ● HRBrainとは?
    ○ HRTech SaaS企業でマルチプロダクトを展開
    ● マルチプロダクト × フロントエンドの不
    ○ プロダクト横断でのUI/UXの統一が難しい
    ● 改善の取り組み
    ○ デザインシステム・UIコンポーネントライブラリの整備
    ○ プロダクト横断でコミュニケーションを促進する施策実行
    ● 取り組みの背景
    ○ コミュニケーション量の多い活躍人材の再現性を高めるため
    22
    まとめ

    View full-size slide

  22. ご清聴ありがとうございました!

    View full-size slide