モンストのお問い合わせフォームを支える技術 / Dive into mixi night 2018-08-22

Dive into mixi night! #3 の登壇資料です。

https://mixi.connpass.com/event/90827/

Transcript

1. モンストのお問い合わせ フォームを⽀える技術 2018.08.22 橋本 淳 株式会社ミクシィ 統括管理本部 CS部 CREグループ
2. 1 ⾃⼰紹介 •  統括管理本部 CS部 CREグループ所属 •  2012年新卒⼊社 •  〜2015年3⽉: SNS「mixi」の開発 •  サービス開発・保守 (ブラウザ・ネイティブアプリ) •  2015年4⽉〜: 現部署
3. 2 CREとは •  Customer Reliability Engineering •  顧客信頼性エンジニアリング •  Googleが提唱した役割 (2016年10月) •  弊社でのCRE設⽴は2017年12⽉ •  CS部門の開発チームとしては2011年4月頃から
4. 3 XFLAG スタジオにおけるCRE •  顧客信頼性の向上のために動く •  CSスタッフ向けの管理画面の開発・運用 •  バージョンアップに沿って開発 •  お問い合わせの技術調査 •  不具合の修正 •  不具合で不利益を被ったユーザーの抽出・補填 •  関わるスタッフの作業効率化・⾃動化のために動く •  業務効率化ツールの開発 •  Zendeskまもるくん •  CREから主体的に動くケースも多い
5. 4 今⽇の話
6. お問い合わせフォームについて •  技術的な話あるの？ •  静的HTMLじゃないの？ 5
7. 6 あります
8. モンストにおけるお問い合わせ •  データ移⾏に関するお問い合わせが最多 •  アプリ内イベントに連動して増加する傾向 7 2018年7月1日 ルシファー獣神化発表
9. データ移⾏のお問い合わせフォーム •  専⽤のフォームを⽤意して、お問い合わせトップページ からリンクしている •  復旧したいアカウントを特定するための内容を⼊⼒して もらうようになっている •  他社さんも似たような傾向 8
10. パズドラのフォーム 9
11. Fate Grand Orderのフォーム 10
12. モンストのフォーム 11
13. モンストのフォーム 12
14. モンストのフォーム 13
15. メリット •  ⼊⼒候補をajaxで取得しユーザーの⼊⼒を補助 •  モンスター名・わくわくの実 •  4個の入力項目で採用 •  ⼊⼒内容のブレがほぼ発⽣しない •  入力内容の確認作業を一部システムで自動化している •  CSスタッフの労力を軽減 •  ⼊⼒候補はアプリ内データと同期している •  フォームはいつでも最新の状態！ 14
16. 実は台湾版でも！ 15
17. アプリ内データとの同期の仕組 16
18. まとめ 17 •  モンストのデータ移⾏フォームでは、アプリ内データを ⼀部引⽤している •  ユーザーの⼊⼒補助とシステムによる⼀部⾃動化の両⾯ でメリットがある •  今回紹介した事例のように、ちょっとした⼯夫で効率化 できるシーンがCSの現場では多い
19. Thank you!