What we do for quality as merpay frontend

Transcript

1. 1 What we do for quality as merpay frontend @naughtLdy
2. 2 Introducing Merpay Frontend
3. 3 Product Details For Customer • Campaign
 • Coupon
 • Deferred Payment
 • Net Payment
 • P2P Transfer
 • Application Form
 • Partner Dashboard
 For Partner • Customer Support Tool 
 • Merchant Support Tool 
 For Operator
4. 4 Tech Stacks Application CI / CD Infra Monitoring Tools
5. 5 Product Release
6. 6 Product Release History 2019/2 3 Merpay 1st release Code Payment / Coupon Merpay Smart Payment Net payment 5 4 2020/7 2021/3 Merpay Smart Payment (fixed amount) Send/Receive Virtual Card
7. 7 Product Release History - Focus Topics 2019/2 3 Merpay 1st release Code Payment / Coupon Merpay Smart Payment Net payment 5 4 2020/7 2021/3 Merpay Smart Payment (fixed amount) Send/Receive Virtual Card Release First Eliminate Technical Debt Quality • Merpay Frontend のこれまでとこれから • メルペイのエンジニア組織を EMとして振り返ってみた Tech Blog
8. 8 The Quality of our products
9. 9 Product Quality Why work on it ? • Improve the customer experience
 • How can we improve the customer experience
 • It can be improved by increasing the quality indicators
 such as Test, Perf, a11y, etc.
 

10. 10 Product Quality Perf Test a11y
11. 11 Where to start • Data Visualization Team 
 ◦ Making up the measurement system 
 ◦ Defining Data Format 
 
 • Perf / Test / a11y Team 
 ◦ Defining the quality criteria 
 ◦ How to measure
 ◦ How to improve
 Team Strategy
12. 12 Where to start • Data Visualization Team 
 ◦ Making up the measurement system 
 ◦ Defining Data Format 
 
 • Perf / Test / a11y Team 
 ◦ Defining the quality criteria 
 ◦ How to measure
 ◦ How to improve
 Team Strategy
13. 13 How to visualize Job Schedule Job Sink Logging BigQuery
14. 14 Data Format { "type": "{{ data type }}" , "project": "{{ project name }}" , "data": { // want to upload data // need to same type definition per type } } • type ◦ perf, test, a11y ... ◦ use for Logging Sink • project ◦ use for Looker
15. 15 Data storage method Sink type = perf type = test type = a11y Each team can display chart using project key Logging BigQuery BigQuery BigQuery
16. 16 Conclusion • Merpay frontend is working on perf, test and a11y as quality • Setting baseline for each quality and working to improve them • We are using Looker ML dashboard to visualize each microservice
17. 17 Thanks