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
先生と一緒に プロダクトを良くする アナリティクス機能の開発
Search
meijin
June 20, 2023
Programming
130
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
先生と一緒に プロダクトを良くする アナリティクス機能の開発
meijin
June 20, 2023
More Decks by meijin
See All by meijin
Technical Decisions and Reflections on "Test Maker" After Two Years of Development
texmeijin
1
120
弊社の「意識チョット低いアーキテクチャ」10選
texmeijin
5
26k
DDDを志して3年経ったら「DDDの皮を被ったクリーンアーキテクチャ」になった話【デブサミ2024夏】
texmeijin
4
4.4k
サービス黎明期にNuxt.js v2からNext.js移行を決めた理由と進め方
texmeijin
0
540
スタートアップCTOが個人開発で収益化・年13本記事発信・5件登壇を平行するための時間管理
texmeijin
4
1.2k
個人開発がおすすめな理由
texmeijin
3
1.1k
弊社の開発体験の良いところは?メンバーに訊いてみた!
texmeijin
0
490
初めてESLintプラグインにコントリビュートした話
texmeijin
0
270
ハードルが激低な社内勉強会を続けている話
texmeijin
0
6.3k
Other Decks in Programming
See All in Programming
Composerを使ったサプライチェーン攻撃の様子を眺めてみる #phpstudy
o0h
PRO
2
250
Even G2とAWSで推しのエージェントを召喚しよう!
har1101
1
100
依存関係から依存物へ―Dependencyという言葉の歴史をひも解く
j_lee
0
120
決定論的オーケストレーションの設計と実装 / Design and Implementation of Deterministic Orchestration
nrslib
3
1.3k
その問い、本当に正しいですか?AI時代のエンジニアに必要な哲学と認知科学 / ai-philosophy-cognitive-science
minodriven
7
4.3k
気圧・高度・GPSを記録&可視化するアプリ「Koudo」を作った話
hjmkth
1
230
技術記事、 専門家としてのプログラマ、 言語化
mizchi
13
5.8k
気づいたらRubyで100作品 ー クリエイティブコーディングが生活の一部になるまで / 100 Ruby Sketches Later: How Creative Coding Became Part of My Life
chobishiba
3
570
エージェンティックRAGにAWSで入門しよう!
har1101
8
1.5k
CSC307 Lecture 17
javiergs
PRO
0
320
Honoでのサプライチェーン侵害対策 〜 3つのライブラリに学ぶ
yusukebe
0
150
Observability in Practice:Grafana 與 Edge Device SRE 的那些事
blueswen
0
160
Featured
See All Featured
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
32
3.4k
Chasing Engaging Ingredients in Design
codingconduct
0
220
Rails Girls Zürich Keynote
gr2m
96
14k
VelocityConf: Rendering Performance Case Studies
addyosmani
333
25k
More Than Pixels: Becoming A User Experience Designer
marktimemedia
3
440
Practical Orchestrator
shlominoach
191
11k
Rebuilding a faster, lazier Slack
samanthasiow
85
9.5k
Product Roadmaps are Hard
iamctodd
PRO
55
12k
Dominate Local Search Results - an insider guide to GBP, reviews, and Local SEO
greggifford
PRO
0
190
So, you think you're a good person
axbom
PRO
2
2.1k
Digital Projects Gone Horribly Wrong (And the UX Pros Who Still Save the Day) - Dean Schuster
uxyall
1
1.7k
Amusing Abliteration
ianozsvald
1
200
Transcript
先⽣と⼀緒に プロダクトを良くする アナリティクス機能の開発 株式会社NoSchool CTO @meijin
TL; DR - オンライン家庭教師マナリンクで2023年5⽉1⽇にリリースした 「アナリティクス機能」について説明します - マナリンクはtoCサービス特有の特性があり、 「先⽣と⼀緒にプロダクトを良くしていく」という考え⽅があります - その考えに基づいて開発、リリース、運⽤していく⼀連の流れを
説明していきます
⾃⼰紹介 - 名⼈|マナリンクCTO(https://twitter.com/Meijin_garden) - 「オンライン家庭教師マナリンク」を開発 - TS(React, Vue)、PHP(Laravel)、AWSあたりが主戦場 - ほどよいLaravel×DDDを模索するのが好き
- わけわからん低レイヤーのバグを踏んでも気合で解決するのが得意 - 2023年現在Zennで⼀番Likeがついている記事の著者(React) - 趣味:将棋、カメラ、ラム酒、筋トレ、⾼校野球観戦(どれも布教したくて仕⽅がない) - 娯楽:ゼル伝、流⾏りのアニメを⾒る、国内旅⾏
オンライン家庭教師マナリンクについて
オンライン家庭教師マナリンクとは https://manalink.jp/
マナリンクの機能① 「先⽣検索‧お問合せ機能」
マナリンクの機能② 授業予定、売上、宿題管理機能
今回のスコープ 今回は①の検索‧お問合せ機能のために、 先⽣⽅に提供したアナリティクス機能のお話をします 1. サービスが抱える構造的な課題 2. マナリンクにおける「プロダクト」の定義 3. アナリティクス機能の開発 4.
リリース後のサポート体制
サービスが抱える構造的な課題
検索‧お問合せ機能が抱える構造的な課題 - 先⽣が⾃⾝のプロフィールや指導内容を記載した指導コースを ⾃分で作成‧編集して公開 - SNSのようなCGM(Consumer Generated Media)の⼀種 - CGMの構造的な問題として、コンテンツの質がコントロールしきれず
バラバラになってしまう - 先⽣の情報の質がバラバラだと‧‧‧ - 保護者様から⾒たときに、先⽣の魅⼒が伝わらなかったり、混乱を招く - SEO的にもよくない
検索‧お問合せ機能が抱える構造的な課題 - でも、⼀⼈ひとりコンテンツ内容を都度都度レビューするのは コストが⼤きすぎる((先⽣の⼈数×平均指導コース数)回のレビュー) - 先⽣の魅⼒を伝えるメディアでありながら、コンテンツをコントロールする コストを抑えて事業をスケールさせたい
そこでどうするか - 先⽣が⾃発的にコンテンツを改善していける仕組みが必要 - どういうプロフィールや指導コースだと保護者様に刺さるか? PDCAを回せるようにしたい - つまり、⾃⾝が公開しているプロフィールや指導コースがどの程度⾒られて おり、コンバージョンに繋がっているか把握できればPDCAを回せる!
マナリンクにおける「プロダクト」とは
ユーザー(保護者様)から⾒たときの「プロダクト」とは - 開発者視点では作っているソフトウェアがプロダクト、と考えがち - ただし特にCGMのような特性を持っているサービスにおいては ソフトウェアの上に載っているコンテンツ、 マナリンクでは先⽣の情報や魅⼒的な⾃⼰紹介⽂も含めて 保護者様から⾒ればマナリンクという1つの「プロダクト」に⾒えている
保護者様から⾒たときの「プロダクト」とは https://manalink.jp • サイトは⾼速か? • デザインは⾒やすいか? • 検索しやすいか? • 検索軸が多様かつ⼗分か?
• その他機能性は⼗分か? • ページ遷移は滑らかか? • etc 先⽣⽅のプロフィールページ • 顔写真の印象は? • 経歴は? • 指導実績は? • ⾃⼰紹介動画の内容は? • 指導コース内容が ⾃分にもわかりやすいか? • etc
よりよいプロダクトにするには - ソフトウェア開発を頑張るだけではなく、 先⽣⽅と⼀緒にマナリンクというプロダクトを作っていく
アナリティクス機能の開発
アナリティクス機能の提供
アナリティクス機能の特徴 - 期間ごとにアクセス数の増減がわかる - アクセス元⽐率がわかる(同サイト内か、SNSか、検索エンジンか) - 指導コースごとにアクセス数とCV(お問合せ)数がわかる
アナリティクス機能の特徴 以上から、 - 内容を改善したから徐々にアクセス数が増えているとか - 先週からTwitterを頑張っているからSNS経由の流⼊増えたとか - 指導コースの書き⽅を変えたからCVRが上がったとか 先⽣⾃⾝の活動の結果が⼀部数値化されて⾒ることができる。 余談ですが、アクセス元⽐率は開発メンバーが提案して追加することになりました。
技術的な解説
アーキテクチャ概観 保護者様はWebまたは アプリでアクセス Laravelで標準出⼒に アクセス情報をJSON出⼒ →fluentbitでS3へ流す S3に吐き出されたJSONを Athenaでクエリする。 ⽇次バッチで集計し、 RDSに⼊れておく
先⽣が管理画⾯から アクセス数を閲覧
技術的なポイント - toCなので突発的にアクセスが増えたときに不要な負荷を掛けたくない - アクセス記録は直接DBに書き込まずスケールしやすい標準出⼒→S3 - もともと標準出⼒はJSONで吐く運⽤だったので S3に吐き出してそのままAthenaでクエリするところまでスムーズに組めた - アクセス元を収集するためにReferrerを活⽤し、
CSR/SSR両⽅で収集するのが少し⼤変だった - フロントはReactで組んでいるが、 `@tanstack/react-table`や`victory`を利⽤して爆速実装
ここ気になる⽅ 懇親会で訊いてください!!!!!!
リリース後のサポート体制
先⽣向けにアナリティクス機能⾃体の勉強会を実施 - 数値だけ⾒せても改善できるかは別 - 機能の勉強会を実施して、 SEOの基礎知識も込みで伝える - 週1回のペースで実施 - ⼀⼈ひとりに属⼈的にレビューするよりも
N⼈に対して勉強会1〜2hで済むので 効率性はUpしている
SEOの考え⽅から、数値を⾒ての改善プロセスを提⽰
Twitter上での先⽣の反応
先⽣がマナリンクの考え⽅を汲み取ってくれました
まとめと告知
まとめ - toCのサービスかつ、ユーザーがコンテンツを掲載するサービスでは ユーザーの協⼒なしに「良いプロダクト」にはなりえない - ユーザーの協⼒を得るには、良い機能の開発と、ユーザーに浸透させる 取り組みの両輪が必要 - マナリンクの場合は、先⽣に協⼒して頂く形でプロダクトを改善している -
先⽣がTwitterに取り組むので、機能開発に対する感想に触れられる
告知!いきなり採⽤をしています!って⾔ってもハードルが⾼いので‧‧‧ 弊社メンバーと勉強会 or ボルダリングしませんか?(実績多数) React/TypeScript/Laravel/PHP/DDD周りでの 1時間程度の勉強会@御茶ノ⽔オフィス またはオフィス徒歩5分に国内最⼤級の ボルダリング場があります!ので、そちらでも!
ご清聴ありがとうございました!