モンストのお問い合わせフォームを支える技術 / 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グループ
   

   View Slide

2. 1
   ⾃⼰紹介
   •  統括管理本部 CS部 CREグループ所属
   •  2012年新卒⼊社
   •  〜2015年3⽉: SNS「mixi」の開発
   •  サービス開発・保守 (ブラウザ・ネイティブアプリ)
   •  2015年4⽉〜: 現部署
   

   View Slide

3. 2
   CREとは
   •  Customer Reliability Engineering
   •  顧客信頼性エンジニアリング
   •  Googleが提唱した役割 (2016年10月)
   •  弊社でのCRE設⽴は2017年12⽉
   •  CS部門の開発チームとしては2011年4月頃から
   

   View Slide

4. 3
   XFLAG スタジオにおけるCRE
   •  顧客信頼性の向上のために動く
   •  CSスタッフ向けの管理画面の開発・運用
   •  バージョンアップに沿って開発
   •  お問い合わせの技術調査
   •  不具合の修正
   •  不具合で不利益を被ったユーザーの抽出・補填
   •  関わるスタッフの作業効率化・⾃動化のために動く
   •  業務効率化ツールの開発
   •  Zendeskまもるくん
   •  CREから主体的に動くケースも多い
   

   View Slide

5. 4
   今⽇の話
   

   View Slide

6. お問い合わせフォームについて
   •  技術的な話あるの？
   •  静的HTMLじゃないの？
   5
   

   View Slide

7. 6
   あります
   

   View Slide

8. モンストにおけるお問い合わせ
   •  データ移⾏に関するお問い合わせが最多
   •  アプリ内イベントに連動して増加する傾向
   7
   2018年7月1日 ルシファー獣神化発表
   

   View Slide

9. データ移⾏のお問い合わせフォーム
   •  専⽤のフォームを⽤意して、お問い合わせトップページ
   からリンクしている
   •  復旧したいアカウントを特定するための内容を⼊⼒して
   もらうようになっている
   •  他社さんも似たような傾向
   8
   

   View Slide

10. パズドラのフォーム
    9
    

    View Slide

11. Fate Grand Orderのフォーム
    10
    

    View Slide

12. モンストのフォーム
    11
    

    View Slide

13. モンストのフォーム
    12
    

    View Slide

14. モンストのフォーム
    13
    

    View Slide

15. メリット
    •  ⼊⼒候補をajaxで取得しユーザーの⼊⼒を補助
    •  モンスター名・わくわくの実
    •  4個の入力項目で採用
    •  ⼊⼒内容のブレがほぼ発⽣しない
    •  入力内容の確認作業を一部システムで自動化している
    •  CSスタッフの労力を軽減
    •  ⼊⼒候補はアプリ内データと同期している
    •  フォームはいつでも最新の状態！
    14
    

    View Slide

16. 実は台湾版でも！
    15
    

    View Slide

17. アプリ内データとの同期の仕組
    16
    

    View Slide

18. まとめ
    17
    •  モンストのデータ移⾏フォームでは、アプリ内データを
    ⼀部引⽤している
    •  ユーザーの⼊⼒補助とシステムによる⼀部⾃動化の両⾯
    でメリットがある
    •  今回紹介した事例のように、ちょっとした⼯夫で効率化
    できるシーンがCSの現場では多い
    

    View Slide

19. Thank you!
    

    View Slide