数理的アプローチで挑むスマホUIのデザイン改善：タップ成功率推定ツール「Tappy」の社内活用事例 / Improving Smartphone UI Design with a Mathematical Approach: In-house Use Case of the Tap Success Rate Estimation Tool "Tappy"

by LINEヤフーTech (LY Corporation Tech)

Slide 1

Slide 1 text

*NQSPWJOH4NBSUQIPOF6*%FTJHO XJUIB.BUIFNBUJDBM"QQSPBDI *OIPVTF6TF$BTFPGUIF5BQ4VDDFTT3BUF &TUJNBUJPO5PPM5BQQZ -:3FTFBSDI 3%%FQBSUNFOU )VNBO$PNQVUFS*OUFSBDUJPO5FBN 4IPUB:BNBOBLB

Slide 2

Slide 2 text

• #BDLHSPVOE • %FNPOTUSBUJPOPG5BQQZ • 3FMBUFEXPSL • *OIPVTFVTFDBTFT • *NQPSUBODFPGEFTJHOJOHCFUUFSJOUFSGBDFT "HFOEB

Slide 3

Slide 3 text

+PJOFE:BIPP+"1"/3FTFBSDI -FBEFS )VNBO$PNQVUFS*OUFSBDUJPO5FBN 3FTFBSDI"SFB )VNBODPNQVUFSJOUFSBDUJPO )$* BOEVTFSJOUFSGBDFT 6* &TQFDJBMMZ IPXUPEFTJHOCFUUFSXFCQBHFTBQQTUIBUVTFSTJOUFSBDUXJUI 4FMGJOUSPEVDUJPO 4IPUB:BNBOBLB 1I%JO&OHJOFFSJOH .FJKJ6OJWFSTJUZ *IBWFPOFDBUBOEUXPEPHT

Slide 4

Slide 4 text

5SBEJUJPOBMMZ JUIBTCFFOEJGGJDVMUUPRVBOUJUBUJWFMZFWBMVBUFUIFVTBCJMJUZPGNPCJMF6*T *GBVTFSTVDDFFETUJNFTPVUPGUBQBUUFNQUT UIFUBQTVDDFTTSBUFJT 5BQQZ 5PPMGPSFTUJNBUJOHUBQTVDDFTTSBUFTPG6*FMFNFOUT FH CVUUPOT MJOLT PONPCJMFXFCQBHFTBQQT 😄&BTZUPUBQ 😢'SFRVFOUFSSPST -BSHF TNBMM 4VDDFTT &SSPS TVDDFTTSBUF

Slide 5

Slide 5 text

8IFONBOZ6*TNVTUCFQMBDFEPOBTDSFFO EFTJHOFSTDBOOPUBMXBZTGPMMPXHVJEFMJOFT &H "OESPJEEFTJHOHVJEFMJOFSFDPNNFOET6*FMFNFOUTUPCFBUMFBTUNNJOTJ[F IUUQTTVQQPSUHPPHMFDPNBDDFTTJCJMJUZBOESPJEBOTXFS IMKB ✘ *UJTPGUFOOPUGFBTJCMFUPFOTVSFUIBUFWFSZ6*FMFNFOUJTNNPSMBSHFS 8IFOB6*FMFNFOUJT)NNʷ8NN JUJTVODMFBSIPXBDDVSBUFMZVTFSTUBQJU 4VDDFTTSBUFTBMMPXGPSEFDJTJPOTCBTFEPORVBOUJUBUJWFJOEJDBUPST &H l-FU`TFOTVSFBUMFBTUBTVDDFTTSBUFGPSBMM6*TPOUIJTXFCQBHFz ✘ .FBTVSJOHUBQTVDDFTTSBUFTCZIBWJOHNBOZQFPQMFUBQIVOESFETPGUJNFTJTDPTUMZ %JGGJDVMUZJO6*EFTJHO

Slide 6

Slide 6 text

8FJNQMFNFOUFESFMFBTFEUXPUPPMT 5BQQZXFCBQQ 5BQQZGPS'JHNBQMVHJO

Slide 7

Slide 7 text

6TFSTFOUFSB63-BOE TFMFDUBTNBSUQIPOF 4J[FBOE UBQTVDDFTTSBUFPGFBDI6* FMFNFOUBSFEJTQMBZFE %FNPWJEFP5BQQZXFCBQQ IUUQTUBQQZZBIPPDPKQ

Slide 8

Slide 8 text

• 0QUJNJ[JOHBEQMBDFNFOUUISPVHI%0.BOBMZTJT<8V /FVSPDPNQVUJOH> • %FUFDUJOHQIJTIJOHBUUBDLTUISPVHI%0.BOBMZTJT<.BP 1SPDFEJB$PNQVU4DJ> • &TUJNBUJOHUBQQBCMFFMFNFOUTJOTDSFFOTIPUTVTJOHDPNQVUFSWJTJPO <4DIPPQ $)*> • %FUFDUJOHUBQQBCMFFMFNFOUTJOTDSFFOTIPUTVTJOHBVUPNBUFECPUT<8V 6*45> ✔5BQQZDBOJEFOUJGZXIFUIFSFWFSZQJYFMPOUIFTDSFFOJTUBQQBCMF XJUIBMNPTUOPMBH 3FTFBSDISFMBUFEUP5BQQZXFCBQQ

Slide 9

Slide 9 text

%JGGJDVMUZJOEFUFDUJOH6*TUISPVHI$7 &YBNQMFTXIFSFDPNQVUFSWJTJPOUFDIOJRVFTDBOOPUEJTUJOHVJTIUBQQBCMFBSFBT )ZQFSMJOL )ZQFSMJOL )ZQFSMJOL )ZQFSMJOL )ZQFSMJOL )ZQFSMJOL )ZQFSMJOL )ZQFSMJOL )ZQFSMJOL )ZQFSMJOL )ZQFSMJOL )ZQFSMJOL 'SPNBQQFBSBODFBMPOF JUJTEJGGJDVMUUPEFUFSNJOFFYBDUMZ XIJDIBSFBTBSFUBQQBCMF 0OMZUIFUFYUJUTFMGJTUBQQBCMF 5IFBSFBBSPVOEUIFUFYU JTBMTPUBQQBCMF 5IFUBQQBCMFSFHJPODIBOHFTEFQFOEJOH POUIFQMBDFNFOUPGTVSSPVOEJOHMJOLT

Slide 10

Slide 10 text

:PVDBOTUBSUVTJOHJUSJHIUBXBZ CZFOUFSJOH5BQQZJOUIF QMVHJOTFBSDIGPSN %FNPWJEFP5BQQZGPS'JHNBQMVHJO IUUQTXXXGJHNBDPNDPNNVOJUZQMVHJOUBQQZ

Slide 11

Slide 11 text

3FBTPOCFIJOEEFWFMPQJOH5BQQZ *G6*FMFNFOUTBSFUPPTNBMM VTBCJMJUZEFDSFBTFT *G6*FMFNFOUTBSFUPPMBSHF VTFSTXJMMOFFEUPTDSPMMNPSF &WFOKVTUBDDVSBUFMZVOEFSTUBOEJOHUIFUBQTVDDFTTSBUFDBOIFMQTVQQPSU6*EFTJHO

Slide 12

Slide 12 text

3FBTPOCFIJOEEFWFMPQJOH5BQQZ l8FTIPVMENBLFJUCJHHFS CFDBVTFVTFSTUFOEUPNJTTJDPOTz l*U`TOPUVTFEWFSZPGUFO TPJU`TGJOFUPLFFQJUTNBMMz #ZVTJOH5BQQZ EFWFMPQNFOUUFBNTDBOEJTDVTT6*EFTJHOCBTFEPORVBOUJUBUJWFNFUSJDT /PUGSFRVFOUMZVTFE

Slide 13

Slide 13 text

3FMBUFESFTFBSDIPOUBSHFUQPJOUJOH 7BSJBCJMJUZPGUBQQFEQPJOUT "JNFEQPTJUJPO 'JUUT`MBX <'JUUT > 1SFEJDUUBQUJNF𝑇 𝑇 = 𝑎 + 𝑏 log! 𝐷 𝑊 + 1 4DINJEU`TMBX <4DINJEU > 1SFEJDUUBQQPJOUWBSJBCJMJUZ𝜎 𝜎 = 𝑎 + 𝑏 𝐷 𝑇 &SSPSSBUFNPEFM <8PCCSPDL > 𝐸𝑅 = 1 − erf 2.066 𝑊 𝐷 2 "!#$ % − 1 2

Slide 14

Slide 14 text

$MJDLDPPSEJOBUFTGPMMPXBOPSNBMEJTUSJCVUJPO 7BSJBODF𝜎!DBOCFFTUJNBUFECBTFEPOUIFTJ[F𝑊 𝜎! = 𝑎 + 𝑏𝑊! 1SPCBCJMJUZUIBUBDMJDLGBMMTXJUIJOUIFUBSHFUJT𝑆𝑅 = 𝑃 − " ! ≤ 𝑋 ≤ " ! = erf " ! !# 5IFPSFUJDBMCBDLHSPVOEPG5BQQZ 3FMBUJPOTIJQCFUXFFOUBSHFUTJ[F8BOEDMJDLDPPSEJOBUFWBSJBODFМ<#J 6*45> %JTUBODF𝐷 4J[F𝑊 4VDDFTT &SSPS &SSPS 𝑥! 𝑥" 'SFRVFODZ 𝜎! [mm!] 𝑊! [mm!] ZY 3

Slide 15

Slide 15 text

VTFSTUBQQFEWBSJPVTCVUUPOTUJNFT UBQT <:BNBOBLB *44> 'PSFMMJQUJDBMUBSHFUT UIFIJUBSFBJTDBMDVMBUFEVTJOHUIFCPVOEJOHSFDUBOHMF 5BQDPPSEJOBUFTBSFOPSNBMMZEJTUSJCVUFEFWFOGPSSFDUBOHVMBSUBSHFUT<6TVCB *44> .PWFNFOUEJTUBODFIBTMJUUMFFGGFDUPOUIFWBSJBODFPGUBQQPJOUT<:BNBOBLB *44> .PEFMBOEEBUBVTFEGPS5BQQZ 𝑋~𝑁(𝜇! , 𝜎! ") 𝑌~𝑁(𝜇# , 𝜎# ") 𝑃 𝑆 = / $ 1 2𝜋𝜎% exp − 𝑥" 2𝜎% " 1 2𝜋𝜎& exp − 𝑦" 2𝜎& " 𝑑𝑥𝑑𝑦 8 ) 𝑅 = 𝑥, 𝑦 | − 𝑊 2 ≤ 𝑥 ≤ 𝑊 2 , − 𝐻 2 ≤ 𝑦 ≤ 𝐻 2 𝜎% " = 𝑎 + 𝑏𝑊" 𝜎& " = 𝑐 + 𝑑𝐻"

Slide 16

Slide 16 text

"UBTLXIFSFQBSUJDJQBOUTUVSOCBDLBUBOBJNFEQPTJUJPO "GUFSNBOZSFQFUJUJPOT UIFUVSOBSPVOEQPJOUTGPSNBOPSNBMEJTUSJCVUJPO #FDBVTFUIJTJTTJNJMBSUPUBSHFUDMJDLJOHPOB1$ JUJTGSFRVFOUMZDJUFEFWFOJOSFDFOUSFTFBSDIQBQFST &OEQPJOUWBSJBCJMJUZJOBJNJOHUBTL "SFTFBSDIUPQJDTUVEJFETJODFUIFUIDFOUVSZ 8PPEXPSUI 345IFBDDVSBDZPGWPMVOUBSZNPWFNFOU1TZDIPMPHJDBM3FWJFX .POPHSBQI 4VQQMFNFOUT 7PM /P QQr 5VSOBSPVOEQPJOUTGPMMPX BOPSNBMEJTUSJCVUJPO

Slide 17

Slide 17 text

3FDFOUXPSLPOTVDDFTTSBUFNPEFMT 5BQQJOHPONPWJOHDJSDVMBSUBSHFUT <)VBOH 6*45> $MJDLJOHPONPWJOHUBSHFUTPG BSCJUSBSZTIBQFT <;IBOH $)*>

Slide 18

Slide 18 text

*UJTPGUFOTUBUFEUIBUNPEFMTGPSFTUJNBUJOHTVDDFTTSBUFTDBOTVQQPSUEFTJHOFST • lPVSXPSLBMTPQSPWJEFTUIFGPMMPXJOHJOTJHIUTGPSJOUFSGBDF EFTJHOJOWPMWJOHQPJOUJOHBUNPWJOH UBSHFUTz<;IBOH $)*> • lPVSNPEFMDBOIFMQJNQSPWFJOUFSGBDFEFTJHOJOSFBMXPSMEBQQMJDBUJPOTTVDIBT73 BQQMJDBUJPOTBOEHBNFTz<)VBOH $)*> • lJUDBOCFVTFECZ6*EFTJHOFSTJOEFTJHOJOHBOEFWBMVBUJOHUPVDITDSFFOVTFSJOUFSGBDFTz <.B 6*45> )PXFWFS UIFSFXFSFOPTUVEJFTFYBNJOJOHXIFUIFSTVDINPEFMTBSFBDUVBMMZVTFGVMJOUIF6*EFTJHO XPSLPGQSPGFTTJPOBMEFTJHOFSTBOEFOHJOFFST *OPVSSFTFBSDI XFDPOEVDUFEJOUFSOBMJOUFSWJFXTXJUIVTFSTPGUIFXFCBQQWFSTJPOPG5BQQZ $MBJNTGPSNPEFMTJOQSFWJPVTTUVEJFT

Slide 19

Slide 19 text

5IFUBQTVDDFTTSBUFGPSUIFIBNCVSHFSNFOVXBTMPXFSUIBOFYQFDUFE #ZFYQBOEJOHUIFUBQQBCMFBSFBUPJODMVEFUIFTVSSPVOEJOHXIJUFTQBDF UIFTVDDFTTSBUFXJMMJODSFBTFUPPWFS 6TFDBTF :BIPP+"1"/5SBWFM

Slide 20

Slide 20 text

'PSBETPG:BIPP+"1"/4IPQQJOH JO:BIPP+"1"/4FBSDI UBQQJOHUIFMJOLUIBUJOEJDBUFTB TIPQPGGFSTTVQFSJPSTIJQQJOHTIPXTBOFYQMBOBUJPO CVUUIFTVDDFTTSBUFXBTMPXFSUIBOFYQFDUFE 4JODFUIJTMJOLJTOPUVTFEWFSZGSFRVFOUMZBOEFYQBOEJOHJUTUBQQBCMFBSFBJTBMPXQSJPSJUZ UIFEFDJTJPOXBTNBEFUPQPTUQPOFBOZNPEJGJDBUJPOT 6TFDBTF :BIPP+"1"/4FBSDI

Slide 21

Slide 21 text

6TFSTDBOSBUFBQSPEVDUCZUBQQJOHl˒zCVUUIFTVDDFTTSBUFXBTMPXFSUIBOFYQFDUFE #FDBVTFUIFTFBSFOPUGSFRVFOUMZVTFECVUUPOTBOEUIFGFBUVSFJTOPUFTTFOUJBMGPS QVSDIBTJOHQSPEVDUT UIFEFDJTJPOXBTNBEFUPQPTUQPOFBOZNPEJGJDBUJPOT 6TFDBTF :BIPP+"1"/4IPQQJOH

Slide 22

Slide 22 text

"NPOHUIFGFFECBDLCVUUPOTGPSBSUJDMFJNQSFTTJPOT POMZUIFl/FX1FSTQFDUJWFz CVUUPOIBEBIJHIUBQTVDDFTTSBUF "$44DPOGJHVSBUJPOFSSPSXBTGPVOEBOEGJYFE 6TFDBTF :BIPP+"1"/5FDI#MPH Before correction After correction

Slide 23

Slide 23 text

63-TBOBMZ[FE 6OJRVFVTFST 6OJRVF63-T 5PUBMOVNCFSPGBOBMZTFTTIPXO JOUIJTGJHVSFJT 0WFSPGUIFSFNBJOJOH63-T XFSFBOBMZ[FEUJNFT 6TBHFTUBUVTPG5BQQZXFCBQQ 'JSTUUISFFNPOUITBGUFSUIFQVCMJDSFMFBTF +BOVBSZ r"QSJM 63-TBOBMZ[FEPSNPSFUJNFT

Slide 24

Slide 24 text

"NPOHUIFTNBSUQIPOFNPEFMTVTFEGPSBOBMZTJT UIPTFTFMFDUFEUJNFTPSNPSF 5IFEFGBVMUTFUUJOH J1IPOF XBTUIFNPTU GSFRVFOUMZDIPTFO 5IFSFXFSFBMTPNBOZBOBMZTFTDPOEVDUFEVTJOH NVDIPMEFSNPEFMT FH J1IPOF XIJDIJTPWFSZFBSTPME 6TBHFTUBUVTPGUIF5BQQZXFCBQQ 'JSTUUISFFNPOUITBGUFSUIFQVCMJDSFMFBTF +BOVBSZ r"QSJM

Slide 25

Slide 25 text

VTFSTBSFDVSSFOUMZVTJOHUIFQMVHJO 6TBHFTUBUVTPG5BQQZGPS'JHNBQMVHJO 4JODFJUTQVCMJDSFMFBTF GSPN0DUPCFS

Slide 26

Slide 26 text

*EFBMPQFSBUJPOTJUVBUJPO 5BQQJOHXJUIUIFJOEFYGJOHFSPGUIFEPNJOBOUIBOE 5BQTVDDFTTSBUFTDBOWBSZEFQFOEJOHPOGJOHFSVTFEBOEHSJQQPTUVSF 4DSFFOMBZPVUJTOPUDPOTJEFSFE 5BSHFUTOFBSUIFTDSFFOFEHFUFOEUPIBWFIJHIFSFSSPSSBUFT 5IFQSFTFODFPGPUIFSCVUUPOTOFBSUIFUBSHFUDBOBMTPBGGFDUTVDDFTTSBUFT 4VDDFTTSBUFTBSFDBMDVMBUFEGPSUIFCPVOEJOHSFDUBOHMFGPSTJNQMJDJUZ )5.-BMMPXTGPSCVUUPOTPGBSCJUSBSZTIBQFT 6TJOHNPEFMTGPSTVDIUBSHFUTNBLFTUIJTQPTTJCMFCVUJODSFBTFTDPNQVUBUJPOUJNF -JNJUBUJPOT *UFNTOPUJOWFTUJHBUFEJOUIJTTUVEZ

Slide 27

Slide 27 text

8FBSFDPNQFUJOHXJUIPUIFSNFEJBGPSVTFST`UJNF &H EVSJOHNJOPGEBJMZJOUFSOFUVTF VTFSTTQFOEQBSUPGUIBUUJNFPO-:$PSQPSBUJPOTFSWJDFT #ZQSPWJEJOHDPNGPSUBCMFTFSWJDFTBOEBQQT FH GFXPQFSBUJPOFSSPST • 6TFS`TQFSTQFDUJWF 8BTUFEUJNFEVSJOHJOUFSOFUVTFDBOCFSFEVDFE • 1SPWJEFS`TQFSTQFDUJWF 6TFSTBSFNPSFMJLFMZUPDPOUJOVFVTJOHUIFJSTFSWJDFT 8IZDPOEVDU6*SFTFBSDIBU-:$PSQPSBUJPO 6TFSGSJFOEMZ6*TBSFJNQPSUBOUGPSCPUIVTFSTBOETFSWJDFQSPWJEFST $JUFEGSPN IUUQTXXXTPVNVHPKQNBJO@DPO UFOUQEG 57WJFXNJO *OUFSOFUVTBHFNJO BTPG

Slide 28

Slide 28 text

6TFSTEJTMJLFXFCTFSWJDFTUIBUXBTUFUIFJSUJNF • *GBXFCQBHFMPBETXJUIJOTFD POMZPGVTFSTMFBWF • *GMPBEJOHUBLFTTFD UIFESPQPVUSBUFJODSFBTFTUP 5BQQZEFWFMPQNFOUUFBN`TQFSTQFDUJWF • *OBEEJUJPOUPOFUXPSLSFTFBSDIEFWFMPQNFOU JNQSPWJOH6*EFTJHODBOBMTPQSPWJEFDPNGPSUBCMFTFSWJDFTBOESFEVDFXBTUFEUJNF %FWFMPQNFOUGPSDPNGPSUBCMFTFSWJDFT $JUFEGSPNl%PFT1BHF-PBE5JNF3FBMMZ"GGFDU#PVODF 3BUF 1JOHEPN3PZBMz 1JOHEPN IUUQTXXXQJOHEPNDPNCMPHQBHFMPBEUJNFSFBMMZ BGGFDUCPVODFSBUF

Slide 29

Slide 29 text

&SSPSDMJDLJOHJODVSTBEEJUJPOBMBDUJPOT BOEFYUSBUJNF UPSFDPWFSGSPNUIFFSSPS ᶃ "DDJEFOUBMMZTFMFDUJOHUIFXSPOHMJOL POFBCPWFUIFJOUFOEFEPOF ᶄ $MJDLJOHUIFCSPXTFS`Tl#BDLzCVUUPOUPSFMPBEUIFQSFWJPVTQBHF ᶅ 4DSPMMJOHUISPVHIUIFQBHFUPGJOEBOEDMJDLUIFDPSSFDUMJOLBHBJO 8BTUFEUJNFCZFSSPSPQFSBUJPO &YUSBTUFQTSFRVJSFEUPSFDPWFSGSPNVTFSNJTUBLFT

Slide 30

Slide 30 text

4MJHIUMZPMEFSEBUB ':2GJOBODJBMSFTVMUT NJOQFSVTFSQFSEBZ • /VNCFSPGNPOUIMZMPHHFEJOVTFS*%TNJMMJPO • 5PUBMVTBHFUJNFCZMPHHFEJOVTFST TNBSUQIPOF1$ CJMMJPOIPVST *GFSSPSDMJDLTPDDVSEVSJOHNJO dTFDPGFYUSBXPSLJTOFFEFE dPGUPUBMUJNF ✘*ODPOWFOJFOUBOEXBTUFEUJNFGPSVTFST ✘'PSTFSWJDFQSPWJEFST JUSFQSFTFOUTBTJHOJGJDBOUMPTTPGPQQPSUVOJUZ • *GUIBUXBTUFEUJNFIBECFFOTQFOUVTJOHUIFTFSWJDF JUDPVMEIBWFMFEUPJODSFBTFE TBMFTGPSTIPQQJOHTJUFTPSNPSFBEWJFXTGPSOFXTTJUFT #FDBVTFEFTJHOJOH6*TUIBUQSFWFOUVTFSFSSPSTJTTPJNQPSUBOU XFEFWFMPQFE5BQQZ 6TBHFTUBUVTPG-:$PSQPSBUJPOTFSWJDFT $JUFEGSPNIUUQTTZJNHKQJEPDTJSBSDIJWFTQSFTFOUKQQSFTFOUBUJPOQEG

Slide 31

Slide 31 text

8FBSFDVSSFOUMZXPSLJOHPOSFTFBSDIUPQJDTUIBUNBZCFDPNFBQQTQMVHJOTUPCF SFMFBTFETFWFSBMZFBSTGSPNOPX )JTUPSZPG5BQQZEFWFMPQNFOU 5BQQJOHUBTL +BOVBSZ 1BQFS1VCMJDBUJPO /PWFNCFS 8FCBQQSFMFBTF +BOVBSZ

Slide 32

Slide 32 text

5IBOLZPV 5BQQZXFCBQQ 5BQQZGPS'JHNBQMVHJO