Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
HRBrainの生態系を支えるフロントエンドチームの取り組み / 2023-06-22-AwE...
Search
Yuji Yamaguchi
June 22, 2023
Technology
180
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
Oxlintはいいぞ(続)
yug1224
2
790
螺旋階段のように上がるEMの次のキャリア
yug1224
1
440
ルールを書いて終わらせないハーネスエンジニアリング
yug1224
5
2k
バラバラだった staleTime を、データの性質で4プリセットに集約する
yug1224
1
89
Oxcを導入して開発体験が向上した話
yug1224
5
570
EMからICへのキャリアチェンジの壁とその越え方
yug1224
5
400
Cursor Subagentsはいいぞ
yug1224
2
250
EMからICへ、二周目人材としてAI全振りのプロダクト開発で見つけた武器
yug1224
5
2.4k
Oxlintはいいぞ
yug1224
5
3.9k
Other Decks in Technology
See All in Technology
AI時代のPRレビューにどう向き合うか?
kairim0
1
170
今さら理解するウェブフォントver.2026
takanorip
3
660
契約書画像からの情報抽出に特化した視覚接地モデルを育てる話
sansantech
PRO
1
160
AIがコードを書く時代に、エンジニアは何で自分の価値を証明するのか / In an era where AI writes code how do engineers prove their value
carta_engineering
1
790
OpenSharing について熱く語る〜AI アセットの共有について〜
kameitomohiro
0
250
DWH の限界突破! AI エージェント向け爆速リアルタイムデータ基盤 ClickHouse
jozono
1
370
オンラインゲームのシステム全体像 - コロプラ 2026年度 新卒研修
colopl
0
1.1k
AI時代に必要な脅威モデリング― 変化の速度に負けない理解とリスク判断
masakane55
5
1.3k
継続的なAIコスト最適化
bgpat
1
280
転んだ話が背中を預ける理由になる / A_story_about_falling_down_gives_you_a_reason_to_watch_each_other_s_backs.pdf
pauli
3
350
SREでアラート疲れを 解決しよう!
kairim0
1
220
AI時代だからこそ推したい!Gitコマンド再入門
munakata
0
170
Featured
See All Featured
AI Search: Implications for SEO and How to Move Forward - #ShenzhenSEOConference
aleyda
1
1.4k
Technical Leadership for Architectural Decision Making
baasie
3
600
Mind Mapping
helmedeiros
1
400
The Anti-SEO Checklist Checklist. Pubcon Cyber Week
ryanjones
0
260
How People are Using Generative and Agentic AI to Supercharge Their Products, Projects, Services and Value Streams Today
helenjbeal
2
360
Ethics towards AI in product and experience design
skipperchong
2
420
世界の人気アプリ100個を分析して見えたペイウォール設計の心得
akihiro_kokubo
PRO
74
42k
Utilizing Notion as your number one productivity tool
mfonobong
4
610
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
203
77k
The Pragmatic Product Professional
lauravandoore
37
7.5k
What’s in a name? Adding method to the madness
productmarketing
PRO
24
4.2k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
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 まとめ
ご清聴ありがとうございました!