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
チームで品質を高めながらSaaS開発を続けるためにやったこと.pdf
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
nyo_taro
August 10, 2021
76
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
チームで品質を高めながらSaaS開発を続けるためにやったこと.pdf
nyo_taro
August 10, 2021
More Decks by nyo_taro
See All by nyo_taro
RailsをPdM視点で見てみた
nyo_taro
0
140
プロダクト価値を考えるための情報透明化とチーム文化づくり
nyo_taro
1
430
過去の失敗からリアーキテクチャをやらないと判断した理由
nyo_taro
0
130
最新のRailsでPostgreSQLを使う良さ
nyo_taro
0
680
ドキュメントファーストの非同期文化で知ったこと
nyo_taro
0
590
Featured
See All Featured
Automating Front-end Workflow
addyosmani
1370
210k
How To Speak Unicorn (iThemes Webinar)
marktimemedia
1
490
Have SEOs Ruined the Internet? - User Awareness of SEO in 2025
akashhashmi
0
370
Product Roadmaps are Hard
iamctodd
PRO
55
12k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
Why You Should Never Use an ORM
jnunemaker
PRO
61
9.9k
The Illustrated Guide to Node.js - THAT Conference 2024
reverentgeek
1
390
Navigating Weather and Climate Data
rabernat
0
220
The Illustrated Children's Guide to Kubernetes
chrisshort
51
52k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
21
1.5k
How Software Deployment tools have changed in the past 20 years
geshan
0
34k
The AI Search Optimization Roadmap by Aleyda Solis
aleyda
1
5.9k
Transcript
チームで品質を高めながらSaaS 開発を続けるためにやったこと スマートキャンプ株式会社 井上 翔太朗
自己紹介 2012年:新卒で開発のアウトソーシングやコンサルティングを担う会社に入社。 2018年:スマートキャンプに入社。CMS関連の新規事業立ち上げを経験 2019年:主幹事業である「BOXIL SaaS」のエンジニアとしてRailsのアップデート 対応などを担当。 2020年:インサイドセールスに特化した管理ツール「BALES CLOUD」事業に移 り、開発を担当しながらリーダーとしてチームメンバーの育成やマネージメントにも 携わっている。
2 井上 翔太朗(Inoue Shotaro) @nsytaro
Vision & Mission 3 効率的かつ効果的な営業組織を世の中に広める Small Company, Big Business. テクノロジーで社会の非効率をなくす
Corporate Messages Product Vision Vision Mission
None
見込み顧客 5 営業組織の推移 Market MQL SQL 顧客推移 幅広い業務知識と経験が必要であり属人的になりやすい。 営業業務 展示会/セミナー
架電 商談 顧客サポート Sales 担当別 市場 顧客 Client Sales Sales Sales
Marketing 見込み顧客 6 営業組織の推移 Market MQL SQL 顧客推移 Sales 市場
顧客 Client Sales Sales 営業業務 展示会/セミナー 架電 商談 顧客サポート 担当別
Customer Success Marketing 見込み顧客 7 営業組織の推移 Market MQL SQL 顧客推移
Sales 市場 顧客 Client Sales 営業業務 展示会/セミナー 架電 商談 顧客サポート 担当別
見込み顧客 8 営業組織の推移 Market MQL SQL 顧客対応が担当営業に依存せず、専門領域に集中 Marketing Inside Sales
Field Sales Customer Success 市場 顧客 Client 顧客推移 営業業務 展示会/セミナー 架電 商談 顧客サポート 役割別
今回お話すること - BALES CLOUDチームのSaaS開発の品質 - チームで改善するための取り組みについて - 品質をあげるための取り組みについて
1年前のBALES CLOUDの状態 10
開発プロセス 11 Product Back Log Refinement Sprint Back Log Sprint
Planning DailyScrum 朝会 Development SprintReview Retroscpetive KPT Product Delivery
1年前のBALES CLOUD開発チーム - スクラム開発でスピードを意識しつつテストコードも書いていた - しかし、修正に時間がかかる上に手戻りが発生しがちだった - 手戻りが発生するとその対応のタスクが発生し本来やるべき開発に集中できない
なぜ、そのようなことが起こったのか? - プロダクトに必要な機能を実現するためにだんだんと機能が複雑化 - 複雑な機能は修正が難しく、テストも網羅的に書くのが難しかった - 品質を担保する工数がかかる上に網羅するのが難しい状態になっていた 13
その結果どうなったか - 機能開発のスピードが遅くなる - 受け入れテストでも手戻りが多くリリースまでなかなかできない - 手戻り修正に時間を使っていたため、開発アイテムの積み残しが起こる 14
この問題がなぜ起きているのか? - 機能が複雑なため仕様がわかりにくい - 機能が複雑なため影響範囲がわかりにくい - 機能が複雑なためテストを書くコストが高い 15
この問題がなぜ起きているのか? これって保守性低いんじゃない? 16
保守性の要素を見てみる - テスト容易性 - 理解容易性 - 変更容易性 17
保守性が低いことで起こる負のスパイラル - テスト容易性が低い:テストがしにくく、テストが書かれない - 理解容易性が低い: 理解が出来ず、変更もテストもできない - 変更容易性が低い:変更できず、コードの改善ができない 18
保守性の要素の関係性 19 各要素は密接な関係にある
保守性の高いコードはどれがかけても成立しない - 理解できない => 変更・テストが難しい - 変更が容易じゃない => 理解がしにくくテストも難しい -
テストが容易じゃない => 変更がしにくく理解もしにくい 20
保守性(内部品質)が低いことにより外部品質にも影響する - 理解できない => バグが起こるかわからない - 変更が容易できない => 修正による影響が大きいまたは測れない -
テストが容易じゃない => テストが難しいので品質が担保できない 21
チームでSaaSプロダクトの品質を高める 22
SaaSとは SaaSとはSoftWare as a Serviceの略 サービス利用料を支払いインターネット経由でサービスを提供するのが主流 基本は買い切りではないので、途中で必要なくなれば解約ができる 23
BALES CLOUDチームの考えるSaaS開発とは 継続的にユーザーが払う利用料に見合う価値を提供し続けること ROIが見合っていないと解約や他サービスへの乗り換えの可能性がある だからこそSaaS開発は価値提供のスピードが求められる 24
なぜ、SaaS開発において保守性が重要なのか SaaS開発は継続的に機能を追加・変更して価値を高め提供する 保守性が低いと中長期的に機能変更・追加の難易度が上がりスピードも品質も下がる だからこそ質高く速いスピードで開発し続けるために保守性が重要 25
1. 価値観の共通認識が取れている状態を作る 2. 品質を上げるためのWhy What Howの認識をあわせる チームで品質を高めるために考えたこと 26
1. 価値観の共通認識が取れてる状態を作る 27
- チームの誰もが: どんな人でもパフォーマンスを出せる状態にしたい - 価値: 価値ある開発ができる状態にしたい - 高品質: 品質の高い開発、品質を高く保つための環境作り -
高速: 規模に関わらず、設計からリリースまでを高速にしたい 1. 価値観の共通認識が取れてる状態を作る 28
- チームの誰もが: どんな人でもパフォーマンスを出せる状態にしたい - 価値: 価値ある開発ができる状態にしたい - 高品質: 品質の高い開発、品質を高く保つための環境作り ここに注力する
- 高速: 規模に関わらず、設計からリリースまでを高速にしたい 1. 価値観の共通認識が取れてる状態を作る 29
2. 品質を上げるためのWhy What Howの認識をあわせる - Why:プロダクトグロースのために価値ある機能の開発に時間を使いたい - What:保守性を上げ手戻り工数を減らし、機能開発・改善時間を増やす - How:まずは、改善しやすい状態を作るためのテストを作る
30
品質を高めるためのテストへの取り組み 31
なぜ品質をあげるためにテストを書くのか? - テストはあくまで、自信を持ってコードを変更できる状態にしたかった - 変更しやすい状態を作った上でリファクタリングしていけるようにする - このサイクルを回し続けることで保守性が保つ 32
どのようなテストをするか 33
どのようなテストをするか 34 テストを作成し自動化する 問題を検知できる状態にする
それぞれのテストにどのくらいのコストをかけるか? 35 有名なテストのピラミッドに合わせる テストの保守に時間をとられすぎない分 量でテストを作成する
実際にやった取り組み 1. 継続的単体テスト追加の仕組み化 2. VIsual RegressionTestの追加 3. E2E自動化サービスmablの導入 36
1. 継続的な単体テストの追加 37 - テスト工数を含めて見積りを追加する - どのようなテストが必要か認識を合わせる - 単体テストのテストカバレッジ推移を計測する
1. 継続的な単体テストの追加 38 テストカバレッジの推移を計測できるようにして追加漏れてないかを検知する
2. VIsual RegressionTestの追加 39 - component単位だと導入コストが高い - 簡単にデザイン崩れを検知して、追加も簡単にしたい - ページ単位のVisual
RegressionTest を作成
2. VIsual RegressionTestの追加 40 -
3. E2E自動化サービスmablの導入~ mablの主な特徴 41 - コーティング不要でテスト作成が簡単 - クラウド/SaaS環境なので初期構築コストがない - AIでテストを自動修復、自動画面分析
3. E2E自動化サービスmablの導入~ やったこと 42 - mablの用語理解と認識合わせ - クリティカルパスのテストの洗い出し・作成
mablの用語とBALES CLOUDの用語を整理し 会話でズレがない状態を作る 3. E2E自動化サービスmablの導入~ 構造の理解 43
3. E2E自動化サービスmablの導入~ クリティカルパスのテスト 44
3. E2E自動化サービスmablの導入~ 詳しくはこちらで 45 https://tech.smartcamp.co.jp/entry/introduced-mabl
改善結果 46 高いユーザー利用率 ここ半年でデリバリーした、 すべての機能利用され、売上にも貢献 ※機能はすべて、開発チーム3人で要求から UI、実装方法まですべて決定しています。 高いフロー効率 ユーザーストーリー(要求)の決定以降、 ほぼすべての機能が1週間でリリース
※PM調べ 低い不具合発生率 半年でデリバリーしたすべての機能に対して、 不具合はたった3件 ※ほとんどが2営業日で修正・リリース完了
まとめ 47 - 品質は継続的に維持していく取り組みをしなければ落ちていく - 品質を上げることで価値提供のスピードが上がる - チーム全員で共通認識をもって進むことが大事
SEE YOU ご清聴ありがとうございました!
スライドテンプレート 2019-04-26 更新
テンプレートの使用前に 必ず読み、内容を実施してから使ってください 50
1-1. フォントの設定をする 51 [表示] > [スライドマスター] > [フォント] [表示] >
[スライドマスター] > [フォント] https://drive.google.com/drive/folders/1nCUK Ger9J8e_M9sTi6z-N2wnx5K0A_7i 游ゴシック_Arial.xml 以下のファイルをダウンロード http://irritantis.info/2013/08/font_pattern_for_ mac_powerpoint_theme/ ファイルを「Theme Fonts」に格納する(以下参照) Windows ユーザー Mac ユーザー 「フォントのカスタマイズ」で以下の設定をする 見出しのフォント(英数字):Arial 本文のフォント (英数字):Arial 見出しのフォント(日本語):游ゴシック 本文のフォント (日本語):游ゴシック 適当な名前をつけて保存し、設定する すでに設定が終わっている場合は やる必要はありません。 PowerPointで以下にアクセス。追加されていれば選択。
1-2. フォントが設定されているかどうか確認 52 フォント選択をするとこのように表示されていることを確認
2. 色の設定が以下のような色になっているか確認する 53 図形の塗りつぶし [表示] > [スライドマスター] > [色]
3. デザインルールを覚える 54 通常のテキスト(18pt) これはスマートキャンプの資料です。 強調の装飾例(色はつけない) これはスマートキャンプの資料です。 これはスマートキャンプの資料です。 見出しのテキスト これはLv.2の見出しです。(24pt)
これはLv.3の見出しです。(20pt) 図形で使用する色 あ あ あ あ テキストの色や、 図形の背景色に使う色 図形の背景色に使う色で、 文字を乗せる場合は白い文字にする 図形の背景色に使う色で、 文字を乗せる場合は白い文字にする 図形の背景色に使う色で、 文字を乗せる場合は黒い文字にする
4-1. 使用する図形と組み合わせ 55 重要度 Lv.0 重要度 Lv.2 重要度 Lv.1 重要度
Lv. -1 重要度 Lv.0 重要度 Lv.2 重要度 Lv.1 分割線1 分割線2 参考文献などの注釈情報のテキスト( 14pt) 角丸図形は丸みをおさえる 引用の装飾
4-2. 各種デザインパーツ 56 フキダシデザイン フキダシデザイン フキダシデザイン フキダシデザイン 細めの矢印線 太めの矢印線 細めの矢印線(強調)
太めの矢印線(強調) 1 2 3 4 1 2 3 4
4-3. テキスト多めのフロー 書類選考 応募情報から選考。 1次面接 人事担当による面接。 当 社 への 入
社 熱 意 、カル チャーマッチなどを 軸 に ヒアリングします。 採用会食(随時) チーム全員と顔合わせ。 メンバーとの相性や、会社の 雰囲気を知ってもらう機会で す。 最終面接 代表による面接。 これまでの選考を踏まえた最 終確認や、代表との考えの一 致を確認します。 内定 or 契約 未経験職種の場合は、契約 社員3か月を経てから正社員 登用となる場合があります。 2次面接 現場担当や監督者による面 接。能力の確認やチームとの 相性、お願いする業務に関わ る話をします。 57
5. 英数字を使うときの注意点 58 100万円 100万円 数字が全角になっている 単位が数字より大きくみえる 数字が半角になっている 単位が数字より小さくみえる
6-1. テーブルのデザイン 59 エコノミー スタンダード プレミアム 月額 ¥ 1,000 ¥
2,000 ASK 機能A 制限あり 使用可能 使用可能 機能B 使用不可 制限あり 使用可能 表見出しはフォントサイズを1段階下げる 表見出しはフォントサイズを1段階下げる
6-2. テーブルのデザイン 60 エコノミー スタンダード プレミアム 月額 ¥ 1,000 ¥
2,000 ASK 機能A 制限あり 使用可能 使用可能 機能B 使用不可 制限あり 使用可能
7-1. 棒・線グラフの着色例 61
7-2. 円グラフの着色例 62
会社情報 代表取締役 代表取締役CEO 古橋智史 設立 2014年6月4日 資本金 1億円 従業員数 約100名(うち正社員58名)
取得認証 プライバシーマーク スマートキャンプ株式会社 SMARTCAMP CO., LTD. 63