エンジニアリングが組織に広がる「乳化」を目指すための取り組み #devsumi #devsumiC

READYFORでは、会社全体がビジョン・ミッションに向かって最大限のパフォーマンスを発揮するためにも、エンジニアリングが組織全体に広がっている状態を目指しており、その状態を「乳化」と表現しています。

本セッションでは、下記のようなエンジニアリングの乳化への取り組みを事例とともにご紹介します。

・OKRとスクワッド体制を活用したビジネスとエンジニアリングの融合
・ビジネスプロセスを可視化するためのBPMNの認知拡大と定着
・「技術的負債」という概念の理解と認知拡大
・その他、暇手間かけて日常をハックするための取り組み

Transcript

1. 1 エンジニアリングが組織に広がる「乳化」を目指すための取り組み Developers Summit 2020 Summer C-9 伊藤博志 @itohiro73
2. 2 自己紹介 伊藤博志 @itohiro73 READYFOR株式会社 VP of Engineering 「思いの乗ったお金の流れを増やす」ために、主にエンジニア組織作 りとアーキテクチャー設計全般に関わる。 #devsumi #devsumiC 普段は「いとひろ」と呼ばれております
3. 3 アジェンダ ▪ READYFORの紹介 ▪ READYFORの目指す「乳化」とチャレンジ ▪ BPMNの認知拡大と定着 ▪ OKRとスクワッド体制 ▪ 技術的負債という概念の啓蒙 ▪ 隙手間かけて日常をハックするための取り組み ▪ コロナ禍でのチャレンジ #devsumi #devsumiC
4. 4 READYFORの紹介 #devsumi #devsumiC
5. 5 READYFORのクラウドファンディング #devsumi #devsumiC
6. 6 コロナ禍や災害にも負けず、想いの乗ったお金の流れをつくる #devsumi #devsumiC
7. 7 READYFORの成長の歴史 #devsumi #devsumiC
8. 8 READYFORとエンジニア組織の成長の歴史 2011年9名＠根津 2013年15名＠根津 2016年36名＠本郷 2020年120名＠半蔵門 エンジニア2名 エンジニア4名 エンジニア6名 エンジニア16名 NOW! #devsumi #devsumiC 非線型な成長に 向けて邁進中
9. 9 とはいえまだまだエンジニアの 割合が少ない（約13%）中、 READYFORが大切にしていること #devsumi #devsumiC
10. 10 それは #devsumi #devsumiC
11. 11 乳化 誰もがやりたいことを実現する世の中をつくるため、想いの乗ったお金の 流れを増やす。このようなプラットフォームをつくっていくために、 READYFORはビジネスとエンジニアリングの垣根を超えて乳化していく組 織を追求します。 #devsumi #devsumiC
12. 12 READYFORの追求する乳化（Emulsion）とは 組織の中にエンジニアリングが自然に溶け込んでいる状態 Designed by Freepik 既存の価値観とテクノロジーが融合することによる イノベーションの創造を目指す #devsumi #devsumiC
13. 13 しかし、一筋縄ではいきません #devsumi #devsumiC
14. 14 READYFORの現状と抱えるチャレンジ #devsumi #devsumiC
15. 15 READYFORのクラウドファンディング ▪ ぱっと見普通のWebサービス ▪ どこにドメインの複雑さが隠れているのか？ #devsumi #devsumiC
16. 16 クラウドファンディングのライフサイクルに絡むさまざまなビジネスプロセス READYFORシステム プロジェクト実 行者 プロジェクト支 援者 プロジェクトをはじめる プロジェクトを探す #devsumi #devsumiC プロジェクトに支援する
17. 17 クラウドファンディングのライフサイクルに絡むさまざまなビジネスプロセス プロジェクト実 行者 プロジェクト支 援者 プロジェクトを探す #devsumi #devsumiC プロジェクトをはじめる プロジェクト 相談 支援 審査 プロジェクトページ作成 入出金・売上管理 契約書作成 決済処理 システムと人とプロセスが違いに絡み合っていて、非常に複雑 プロジェクトに支援する
18. 18 この複雑なビジネスプロセスをどう扱うか #devsumi #devsumiC
19. 19 BPMNとは？ #devsumi #devsumiC ▪ Business Process Model and Notaion ▪ ビジネスプロセスやワークフローを可視化するための記法 * 詳しくは私のブログ（ itohiro73’s blog）で 「経費申請　BPMN」でググると出てきます
20. 20 BPMNの啓蒙と普及 #devsumi #devsumiC
21. 21 少しずつ試行錯誤してくれるメンバーたち #devsumi #devsumiC
22. 22 そして... #devsumi #devsumiC
23. 23 さまざまなビジネスチームがBPMNを活用してフローを可視化してくれるようになった #devsumi #devsumiC
24. 24 いとひろ的にも驚きの吸収力 #devsumi #devsumiC
25. 25 ビジネスを理解する素地が出来上がった 複雑に絡み合った様々なワークフローを可視化 ・ ・ ・ ・ ・ ・ #devsumi #devsumiC プロジェクト 相談 支援 審査 プロジェクトページ作成 入出金・売上管理 契約書作成 決済処理
26. 26 OKRとスクワッド体制の導入 #devsumi #devsumiC
27. 27 OKRとスクワッド体制の導入 - OKRとは？ #devsumi #devsumiC ▪ OKRとは？ • Objective（目標） and Key Results（主要な成果） • 目標管理のためのフレームワーク ▪ READYFORでは半期もしくは四半期ごとにOKRを用いて目標設定をし ている OKRの例： Objective: 顧客に〇〇という価値をもたらす最強のプロダクトをとどけ る KR: 〇〇という価値を産むための△△機能と ◻◻機能の要件が定義 されている KR: X月Y日までに△△機能の設計・実装・テスト・リリースが完了して いる KR: Z月W日までに◻◻機能の設計・実装・テスト・リリースが完了して いる KR: 〇〇の指標がXX%向上している
28. 28 OKRが全社でツリー状で設定されることで高いパフォーマンスでの目標の達成を目指す #devsumi #devsumiC 全社OKR チームOKR チームOKR チームOKR チームOKR 個人OKR 個人OKR 個人OKR 個人OKR 個人OKR 個人OKR 個人OKR 個人OKR 個人OKR
29. 29 エンジニア組織が成長したことによるチームOKRのひずみ #devsumi #devsumiC ワンチーム チームOKR ミッション バックエンド チーム チームOKR ミッション2 ミッション3 フロントエンド チーム チームOKR プロダクト マネージャー チームOKR ミッション1
30. 30 スクワッドとは？ #devsumi #devsumiC ▪ もともとはSpotify、日本だとWantedlyやSmart Newsが取り入れてい る組織体制の手法 ▪ 組織を職能ではなくミッション単位で複数部署の人員から形成する ▪ スクワッドに割り当てられたミッションに基づいて意思決定が可能なの で自律性が促進される 参考： とはいえ他の様々な手法と同様 Spotifyモデルも 万能なわけではない（銀の弾丸はない）ので注意
31. 31 スクワッド体制の導入によるミッションとOKRのアラインメント #devsumi #devsumiC スクワッドA チームOKR ミッション2 ミッション3 スクワッドB チームOKR スクワッドC チームOKR ミッション1
32. 32 READYFORの新規開発スクワッド群 ▪ ミッションに基づいたスクワッド編成でOKRを持つ PdM + フロントエンド PdM + フロントエンド + バックエンド CTO + 法人チーム + エンジニア CFO + 経理チーム + エンジニア 編成例：
33. 33 しかし、これだけでは足りない #devsumi #devsumiC
34. 34 再掲：READYFORとエンジニア組織の成長の歴史 2011年9名＠根津 2013年15名＠根津 2016年36名＠本郷 2020年120名＠半蔵門 エンジニア2名 エンジニア4名 エンジニア6名 エンジニア16名 NOW! #devsumi #devsumiC 非線型な成長に 向けて邁進中 7年間少数のエンジニアでスモールビジネスとして着実にビジネスを伸ばしてきた。 その裏で、READYFORのシステムは技術的負債も積み重ねてきた。
35. 35 ここで技術的負債の説明を試みる #devsumi #devsumiC
36. 36 ▪ ソフトウェアとしての価値（技術的資産） = 技術的純資産 + 技術的負債 あくまでアナロジーなので「純資産」や「負債」といった完璧なラベル付けができる わけではないことに注意 技術的純資産 技術的負債 ソフトウェア としての価値 （技術的資産） そのソフトウェアが生み 出す価値すべて - Webサービスの機能 - 新しいユーザー体験 - 新規事業 - 人的コスト削減 - 等々 新たな機能開発を阻害するような設計や実 装等 例 - 3000行を超える巨大なモデル - 複雑な画面遷移実装 - 複雑なAdmin… - テストがない... 等々 開発を促進するような設計や実装等 例 - 複雑な概念をシンプルに表現した実装 - 再利用可能なモジュール - 適切な粒度とカバレッジをもった自動テス ト 等々 BS（バランスシート）のアナロジーとしての技術的負債 #devsumi #devsumiC
37. 37 ここで注意 技術的負債とは、先人たちがビジネス価値を 築き上げてきたソフトウェア資産の一部なので、 絶対悪というわけではない！ #devsumi #devsumiC
38. 38 特性を理解するのが大事 #devsumi #devsumiC
39. 39 技術的負債に対して技術的純資産が多い場合の成長速度 技術的純資産 技術的負債 技術的純資産 技術的負債 技術的純資産 技術的負債 技術的純資産 技術的負債 初 速 は 少 し か か る 開発スピードに加速度がついていく #devsumi #devsumiC
40. 40 技術的純資産に対して技術的負債が多い場合の成長速度 技術的純資産 技術的負債 技術的純資産 技術的負債 技術的純資産 技術的負債 技術的純資産 技術的負債 初 期 に 生 み 出 す 価 値 は 大 き い 利子を支払うかのごとく開発スピードは一気に逓減していく *技術的負債（Technical Debt）というアナロジーは、初期の大きな借り入れによる大きな資産形成ができる が、時間軸に沿って利子を支払い続けなければいけないということを表現している #devsumi #devsumiC
41. 41 どうすればよいのか #devsumi #devsumiC
42. 42 リファクタリングという概念があります #devsumi #devsumiC
43. 43 リファクタリングという概念 技術的純資産 技術的負債 技術的純資産 ソ フ ト ウ ェ ア の 価 値 リファクタリング ソフトウェアとしてのの価値は変えずに内 部の負債を返却 技術的負債 技術的純資産 技術的負債 技術的純資産 技術的負債 その先の開発スピードに加速をつける #devsumi #devsumiC
44. 44 スクワッドの話に戻ります #devsumi #devsumiC
45. 45 先ほど説明したREADYFORの新規開発スクワッド群に加えて ▪ ミッションに基づいたスクワッド編成でOKRを持つ PdM + フロントエンド PdM + フロントエンド + バックエンド CTO + 法人チーム + エンジニア CFO + 経理チーム + エンジニア 編成例：
46. 46 ▪ スケーラブルなシステム基盤を構築していく基盤チームを結成 （実際にはリファクタリング以外の手法も使いつつ、ソフトウェア品質向上を目指す） エンジニアリング基盤ス クワッド ミッション READYFORの中長期計画を 実行していくための 強いエンジニアリング組織と スケーラブルなシステム基盤を 構築する！！ 足りないピースを埋める：エンジニアリング基盤スクワッド
47. 47 技術的純資産 技術的負債 技術的純資産 技術的負債 技術的純資産 技術的負債 新規開発 新規開発 新規開発 新規開発スクワッド群 エンジニアリング基盤 スクワッド リファクタリングやその他手法を駆使し て、新規開発をドライブできるための基 盤を盤石なものにする 負債が存在するという現実と向き合いな がら、制約の中で最大限の価値を生み 出すためのエンジニアリングをしていく READYFORのエンジニアリング戦略
48. 48 隙手間かけて日常をハックする取り組み #devsumi #devsumiC
49. 49 SlackへのReacji Channelerの導入と啓蒙 #devsumi #devsumiC ▪ Reacji Channelerとは？ • 絵文字リアクションをつけるだけでその 投稿を特定のチャンネルに再投稿するこ とができるSlack拡張 ▪ 活用例 • 　 をつけると#times-itohiroに流れる • 　 をつけると#study-productivityに流れ る • 　 をつけると#tech-blog-topicに流れる
50. 50 SlackへのReacji Channelerの導入と啓蒙 #devsumi #devsumiC ▪ まず自分で入れて使ってみると周 りが気になり出す ▪ さらにそれを生産性チャンネルに 送るという二重啓蒙
51. 51 Slackワークフローの導入 #devsumi #devsumiC
52. 52 Slackワークフローの導入 #devsumi #devsumiC ▪ やはり大事なのはまず自分が 使ってみる（その日のうちに）
53. 53 Slackワークフローの導入 #devsumi #devsumiC ▪ そして運用開始
54. 54 GASの活用 #devsumi #devsumiC ▪ Google Apps Script ▪ Google Apps（Docs, Spreadsheet等）でさまざまな自動化を図れる優 れもの ▪ READYFORでは勉強会や情報共有が活発に行われ、非エンジニアが 積極的に自動化に取り組んでいる
55. 55 その他乳化への取り組み #devsumi #devsumiC
56. 56 全社MTGでエンジニア職能の説明を試みる #devsumi #devsumiC
57. 57 フロントエンドシステムとは ▪ ユーザーの目に触れる部分のほとんどは、フロントエンドエンジニアが設計・実装 • Webサービスの見た目や、コンポーネントの配置、サイトの動きを実装していくのはフロントエンド エンジニアの力の見せ所 • バックエンドから受け取ったデータを表示するためのロジックや、ユーザーが入力したデータを バックエンドに送る部分の実装もフロントエンドエンジニアの責務 • READYFORではReact/TypeScriptと呼ばれるフレームワーク・言語を採用 • readyfor-elementsと呼ばれるコンポーネント集も、RFリブランディングを機に開発 岡村 大胡 江面 axross @バンクーバー 城田
58. 58 バックエンドシステムとは ▪ フロントエンドに対してデータ処理（作成・読み取り・変更・削除）のための機能や、様々なロジック （権限管理・状態管理・決済機能等々）を提供するのがバックエンド（サーバーサイド）の主な責務 • READYFORでは、Ruby on Railsと呼ばれるフレームワークを用いてバックエンドシステムを構 築 • READYFORでは、Admin機能も便宜的にバックエンドエンジニアの守備範囲 大田原 斉藤 森 安本 豊島
59. 59 インフラストラクチャー（SRE）とは ▪ Site Reliability Engineer • 実はSREはインフラストラクチャーを直接さわるわけではなく、インフラストラクチャーをソフトウェ アエンジニアとして操作していくロールなので、いずれSREと組織名称は変えていくかもしれませ ん ▪ READYFORではAWSというクラウドサービス上でほとんどのサービスが稼働していて、SREはこ れらをプログラミング技術を用いて構築・管理・運用します ▪ 最終的にはWebサービスの信頼性をあげていくことが至上命題 • 先日XX機能に障害があったことは記憶に新しいと思います。ああいった事象に素早く対処し、同 様な問題が起こらないための対策をとっていくことはわかりやすい一例かと思います 水本 平井
60. 60 コロナ禍で訪れた前代未聞の負荷への対応 #devsumi #devsumiC
61. 61 コロナ禍に生まれた基金やプロジェクトの支援者数が記録のオンパレード #devsumi #devsumiC
62. 62 前代未聞の支援数増加・問題の切り分けと全社への共有 #devsumi #devsumiC
63. 63 非エンジニアメンバーからの反応 #devsumi #devsumiC
64. 64 前代未聞の支援数増加への対応 #devsumi #devsumiC
65. 65 ソフトウェア開発上の問題の多くは 技術的というよりも社会学的なものである #devsumi #devsumiC トム・デマルコ/ティモシー・リスター「ピープル・ウェア」 1987
66. 66 READYFORの「乳化」へのとりくみ　まとめ #devsumi #devsumiC ▪ 「乳化」という概念を全社的に共有する ▪ ビジネスサイドを「わかる」ために可視化する • BPMNの認知拡大と定着 ▪ 同じミッションを共有し、ともにつくる • OKRとスクワッド体制 ▪ 日常をハックする取り組みを背中で見せる • さまざまなSlack拡張の導入と定着、GASの活用等 ▪ ビジネスサイドの「わからない」によりそう • 技術的負債という概念の説明 • コロナ禍でのコミュニケーション
67. 67 想いをつなぎ、叶える未来を、つくる それがREADYFORのTech Visionです。 誰もがやりたいことを実現する世の中をつくるため、想いの乗ったお金の 流れを増やす。このようなプラットフォームをつくっていくために、 READYFORはビジネスとエンジニアリングの垣根を超えて乳化していく組 織を追求します。