Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
HRBrainの生態系を支えるフロントエンドチームの取り組み / 2023-06-22-AwE...
Search
Yuji Yamaguchi
June 22, 2023
Technology
160
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
HRBrainの生態系を支えるフロントエンドチームの取り組み / 2023-06-22-AwEngineerMeetup
Yuji Yamaguchi
June 22, 2023
More Decks by Yuji Yamaguchi
See All by Yuji Yamaguchi
Oxcを導入して開発体験が向上した話
yug1224
4
310
EMからICへのキャリアチェンジの壁とその越え方
yug1224
5
290
Cursor Subagentsはいいぞ
yug1224
2
190
EMからICへ、二周目人材としてAI全振りのプロダクト開発で見つけた武器
yug1224
5
1.7k
Oxlintはいいぞ
yug1224
5
3.4k
Figma + Storybook + PlaywrightのMCPを使ったフロントエンド開発
yug1224
13
6.4k
メンバーの成長速度にバフをかける1on1ミーティング / 2024-12-06
yug1224
25
13k
強みを伸ばすキャリアデザイン
yug1224
3
590
インターンと盛り上げる全社員参加型Advent Calendarの作り方 / 2024-02-22-QiitaNight
yug1224
1
180
Other Decks in Technology
See All in Technology
不要なレビューをAIにまかせて AIコーディングの環境改善を加速した
shoota
1
130
脆弱性対応、どこで線を引くか
rymiyamoto
1
390
AIネイティブな開発のサプライチェーンリスク対策 〜激動の開発現場でリスクに立ち向かう〜【ZennFes】
cscengineer
PRO
2
130
Claude Codeとのおしゃべりでセマンティックモデルの定義からダッシュボード作成まで完成させる
nic_sugiyama
0
110
LayerXにおけるセキュリティ管理の現在地と次の一手
tosho
0
200
中期計画、2回作ってみた ~業務委託と正社員、両方の視点から~
demaecan
1
870
RSA暗号を手計算したくなること、ありますよね?? (20260615_orestudy6_rsa)
thousanda
0
440
失敗を資産に変えるClaude Code
shinyasaita
0
670
SONiCで構築・運用する生成AI向けパブリッククラウドネットワーク ~実装編~
sonic
0
220
2026TECHFRESH畢業分享會 - Lightning Talk - 資料也要 CI/CD? 用 Airbyte 自動化資料同步
line_developers_tw
PRO
0
1.1k
日本 Fintech 未来予測レポート 2027〜2028年(手動編集版)
8maki
0
2.3k
Agent Skills設計で柔軟性と硬さのバランスが難しい話
nassy20
0
130
Featured
See All Featured
Reflections from 52 weeks, 52 projects
jeffersonlam
356
21k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
22k
Marketing to machines
jonoalderson
1
5.4k
技術選定の審美眼(2025年版) / Understanding the Spiral of Technologies 2025 edition
twada
PRO
118
120k
Neural Spatial Audio Processing for Sound Field Analysis and Control
skoyamalab
0
330
Technical Leadership for Architectural Decision Making
baasie
3
410
How to Align SEO within the Product Triangle To Get Buy-In & Support - #RIMC
aleyda
2
1.5k
Mobile First: as difficult as doing things right
swwweet
225
10k
Site-Speed That Sticks
csswizardry
13
1.2k
The browser strikes back
jonoalderson
0
1.2k
Fantastic passwords and where to find them - at NoRuKo
philnash
52
3.7k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
360
30k
Transcript
HRBrainの生態系を支える フロントエンドチームの取り組み 2023/06/22 #AwEngineerMeetup 株式会社HRBrain 山口祐司
2 AGENDA • 自己紹介 • HRBrainについて • 抱えている課題 • 改善の取り組み
• まとめ
自己紹介
4 自己紹介 • ヤマグチ ユウジ(35) ◦ SNS: @yug1224 • フロントエンドエンジニア
• 三児の父 ◦ 11歳、9歳、1歳 • 趣味/興味 ◦ オープンワールドゲーム ◦ Home automation ◦ Fediverse • 2011/04 ソフトバンクモバイル株式会社 ◦ フロントエンドエンジニア • 2016/01 株式会社サイバーエージェント ◦ フロントエンドエンジニア • 2016/10 株式会社リクルートライフスタイル ◦ フロントエンドエンジニア ◦ プロジェクトマネージャー • 2021/10 株式会社ラクス ◦ アシスタントマネージャー • 2022/08 株式会社HRBrain ◦ エンジニアリングマネージャー
HRBrainとは?
6 プロダクトラインナップ
7 技術スタック
マルチプロダクト × フロントエンド の課題
9 マルチプロダクト × フロントエンドの課題 • 各プロダクトごとのドメイン差異 ◦ タレントマネジメント・人事評価・組織診断・労務管理 ◦ 共通化している部分はあるが、ドメイン知識すべてを流用することはできない
• コンウェイの法則 ◦ プロダクトごとのチーム構成 ◦ モノレポの中でアーキテクチャが分岐していってしまう
10 マルチプロダクト × フロントエンドの課題 • 各プロダクトごとのドメイン差異 ◦ タレントマネジメント・人事評価・組織診断・労務管理 ◦ 共通化している部分はあるが、ドメイン知識すべてを流用することはできない
• コンウェイの法則 ◦ プロダクトごとのチーム構成 ◦ モノレポの中でアーキテクチャが分岐していってしまう プロダクト横断でUI/UXの統一が難しい
改善の取り組み
• デザインシステムとUIコンポーネントライブラリ ◦ プロダクト横断で共有 ◦ 各プロダクトのデザイナーとフロントエンドエンジニアが管理 • プロダクト横断のフロントエンドオフィスアワー ◦ 各プロダクトのフロントエンドエンジニアが集まる会を運営
◦ 他にもプロデザ・バックエンド・テックリード軸のMTGもあり相互に連携 ◦ 任意のメンバーも聞けるようにオンライン上で開催し議事録も公開 ◦ 他にType-Challenge会や輪読会なども 12 改善の取り組み
13 改善の取り組み
14 改善の取り組み
15 改善の取り組み
16 改善の取り組み
なぜこの取り組みをしたのか?
18 コミュニケーション量の可視化
19 コミュニケーション量の可視化 活躍している人材ほど右上に位置
• コミュニケーション量を可視化した結果から ◦ 活躍している人材ほどリアクション数・被リアクション数が多い • コミュニケーションの活性化を促す施策が必要と判断 ◦ 活躍人材の再現性を高めるのが良いと考えた ◦ コミュニケーションコスト増大のデメリットもありそうだが飲み込む
20 なぜこの取り組みをしたのか?
まとめ
• HRBrainとは? ◦ HRTech SaaS企業でマルチプロダクトを展開 • マルチプロダクト × フロントエンドの不 ◦
プロダクト横断でのUI/UXの統一が難しい • 改善の取り組み ◦ デザインシステム・UIコンポーネントライブラリの整備 ◦ プロダクト横断でコミュニケーションを促進する施策実行 • 取り組みの背景 ◦ コミュニケーション量の多い活躍人材の再現性を高めるため 22 まとめ
ご清聴ありがとうございました!