複雑な構成要素を持つUIとの向き合い方〜新・支出グラフでの実例〜 / B43 TECH TALK

by nakamuuu

Slide 1

Slide 1 text

ෳࡶͳߏ੒ཁૉΛ࣋ͭ6*ͱͷ޲͖߹͍ํ ʙ৽ɾࢧग़άϥϑͰͷ࣮ྫʙ

Slide 2

Slide 2 text

4NBSU#BOL *OD J04"OESPJE"QQMJDBUJPO%FWFMPQFS தଜܙଠ !DIJDLNVVV ࣗݾ঺հ !OBLBNVVV

Slide 3

Slide 3 text

No content

Slide 4

Slide 4 text

৽ɾࢧग़άϥϑ l·ͱΊը໘z͕lࢧग़ը໘zͱͯ͠ϦχϡʔΞϧ🎉

Slide 5

Slide 5 text

৽ɾࢧग़άϥϑ ৽͍͠ࢧग़άϥϑ͸lߏ੒ཁૉ͕ଟ͍zͷ͕ಛ௃ શମ༧ࢉ ूܭظؒ ࢧग़ֹ ࢒Γ༧ࢉ άϥϑ લ݄ͷ໨҆ϥΠϯ ֹۚͷ໨੝Γ ༧ࢉͷ໨ඪઢ ʜ ʜ

Slide 6

Slide 6 text

৽ɾࢧग़άϥϑ ࣌ؒ࣠ࢧग़ͷঢ়گϢʔβʔૢ࡞Ͱද͕ࣔେ͖͘มΘΓ͏Δ 📅݄ͷ్தͳΒʁ 📝༧ࢉઃఆ͕ͳ͔ͬͨΒʁ 🔥༧ࢉΛ௒͍͑ͯͨΒʁ 👆άϥϑʹ৮ΕͨΒʁ

Slide 7

Slide 7 text

ࠓ೔͓࿩͢͠Δ͜ͱ ςʔϚ 6*ͷߏ੒ཁૉΛ෼ղ͠ ֤ཁૉͷݺশ΍ ৼΔ෣͍Λఆٛ͢Δ ߏ੒ཁૉͷఆٛ ઃܭϑΣʔζʹ͓͚Δlෳࡶͳߏ੒ཁૉΛ࣋ͭ6*zͱͷ޲͖߹͍ํ 6*ͷදࣔʹཁ͢Δ৘ใΛ ໢ཏతʹ੔ཧͯ͠ σʔλιʔεΛઃܭ͢Δ σʔλιʔεͷઃܭ 6*ʹର͢ΔϢʔβʔૢ࡞΍ දࣔঢ়ଶΛચ͍ग़͠ հࡏ͢Δঢ়ଶΛ੔ཧ͢Δ ΠϯλϥΫγϣϯͷ੔ཧ

Slide 8

Slide 8 text

ߏ੒ཁૉͷఆٛ

Slide 9

Slide 9 text

ߏ੒ཁૉͷఆٛ ৽͍͠ࢧग़άϥϑ͸lߏ੒ཁૉ͕ଟ͍zͷ͕ಛ௃ શମ༧ࢉ ूܭظؒ ࢧग़ֹ ࢒Γ༧ࢉ άϥϑ લ݄ͷ໨҆ϥΠϯ ֹۚͷ໨੝Γ ༧ࢉͷ໨ඪઢ ʜ ʜ

Slide 10

Slide 10 text

ߏ੒ཁૉͷఆٛ ͦΕͧΕͷߏ੒ཁૉͷ໋໊

Slide 11

Slide 11 text

ߏ੒ཁૉͷఆٛ w ଞͷߏ੒ཁૉ΍σʔλ΁ͷґଘ͕গͳͦ͏ͳͱ͜Ζ͔ΒਐΊΔ w ྫ೔෇ͷ໨੝ΓʢूܭظؒͷΈʹґଘʣ w ྫֹۚͷ໨੝Γʢࢧग़ֹͷ࠷େ஋ͷΈʹґଘʣ w ʮ࠲ඪฏ໘ʢ໨੝ΓؚΉʣˠάϥϑຊମˠͦͷଞͷ෇ଳ৘ใʯͷ ॱͰৼΔ෣͍ΛܾΊ͍ͯͬͨ ߏ੒ཁૉ୯ҐͰৼΔ෣͍Λܾఆ

Slide 12

Slide 12 text

ߏ੒ཁૉͷఆٛ w ೔෇ͷ໨੝Γ։࢝೔ʙऴྃ೔ͷؒͷ೔༵೔ͷ೔෇Λநग़ͯ͠දࣔ w ֹۚͷ໨੝Γ࠷େͷࢧग़ֹ͔Βܾఆ w ສ ສ ສ ສ ສʜͷ༧Ίنఆ͞Εͨ஋Λ্୺ͷֹۚʹ͢Δ w Լ୺ͷʮʯ͸ৗʹදࣔʢฦۚͰͷෛͷࢧग़ʹ͸ରԠ͠ͳ͍ʣ 📝ྫ೔෇ͷ໨੝Γֹۚͷ໨੝Γʢ࠲ඪฏ໘ʣ

Slide 13

Slide 13 text

ߏ੒ཁૉͷఆٛ ֤ߏ੒ཁૉͷදࣔʹඞཁͳ৘ใ͕໢ཏͰ͖ͨΒ ɹσʔλߏ଄ͷɹ΁ʜ σʔλιʔεͷઃܭ w 6*Λߏ੒͢Δ͢΂ͯͷߏ੒ཁૉʹରͯ͠ৼΔ෣͍Λܾఆ͢Δ w ͦͷաఔͰ֤ߏ੒ཁૉͰඞཁͱͳΔσʔλΛϦετΞοϓ͠ɺ ౎߹ͷΑͦ͞͏ͳσʔλߏ଄΋Πϝʔδ͓ͯ͘͠💭

Slide 14

Slide 14 text

σʔλιʔεͷઃܭ

Slide 15

Slide 15 text

σʔλιʔεͷઃܭ w ಛఆ೔࣌఺Ͱͷࢧग़ֹ΍࢒Γ༧ࢉͳͲ ʮ೔࣍ͷεφοϓγϣοτʯΛࣔ͢ ϔομʔ෦෼ άϥϑຊମ w ूܭظؒͷશମΛ௨ͨ͠ࢧग़ֹͳͲͷ ʮ࿈ଓͨ͠ਪҠʯΛࣔ͢

Slide 16

Slide 16 text

ʮ೔࣍ͷεφοϓγϣοτʯʮ࿈ଓͨ͠ਪҠʯͷ૒ํΛදࣔ͢Δ্Ͱ Ҋͷσʔλߏ଄Λݕ౼ σʔλιʔεͷઃܭ ɾࢧग़ֹ ɾ࢒Γ༧ࢉ ɾ໨҆ͷࢧग़ֹ ʓ݄೔ ʜ ϝΠϯάϥϑ೔໨ ʜ ɾ೔෇ɾֹۚ ໨҆ͷάϥϑ೔໨ ʜ ɾ೔෇ɾֹۚ

Slide 17

Slide 17 text

σʔλιʔεͷઃܭ +40/্Ͱ҉໧తʹੜ͡͏ΔنଇΛॻ͖ग़ͯ͠ΈΔ \ TUBSU@EBUF FOE@EBUF ✏TUBSU@EBUFʙFOE@EBUFͷ͢΂ͯͷ೔෇ؚ͕·ΕΔ TOBQTIPUT< \ EBUF ✏/VMMͳΒ͹Ҏ߱ͷATOBQTIPUTAͷશͯͷཁૉ΋/VMM BNPVOU /VMMBCMF ✏/VMM͔൱͔͸ATOBQTIPUTAͷશͯͷཁૉͰἧ͍ͬͯΔ HVJEF@BNPVOU/VMMBCMF ^ \ EBUFl BNPVOU /VMMBCMF

Slide 18

Slide 18 text

σʔλιʔεͷઃܭ w σʔλϕʔε"1*αʔόʔϞόΠϧΞϓϦͷҰ࿈Λ௨ͯ͠ɺදݱྗ͕ Ұ൪௿͍ഔମʹͳΓ΍͍͢ͷ͕Ϩεϙϯεʹ༻͍Δ+40/ w දݱྗ͕௿͍ʹʮ҉໧తͳ੍໿΍/VMMBCMFͳ஋͕ੜ͡΍͍͢ʯ w ྫ͑͹4XJGUͰ͸FOVNͷBTTPDJBUFEWBMVFʢ௚࿨ܕͷσʔλߏ଄ʣ΍ 'BJMBCMF*OJUJBMJ[FSͳͲΛ༻͍ͯ҉໧తͳ੍໿Λຬͨ͞ͳ͍Πϯελϯεͷ ੜ੒Λ੍ݶͰ͖Δ w +40/Ͱදͨ࣌͠ʹ҉໧తͳ੍໿͕গͳ͘ͳΔ͔͕൑அࡐྉͱͯ͠༗༻ w ࢧग़άϥϑͰ͸ʮ࿈ଓͨ͠ਪҠʯʹدͤͨσʔλߏ଄Λબ୒ͨ͠

Slide 19

Slide 19 text

ΠϯλϥΫγϣϯͷ੔ཧ

Slide 20

Slide 20 text

ΠϯλϥΫγϣϯͷ੔ཧ ৽͍͠ࢧग़άϥϑͰ͸աڈͷࢧग़܏޲΋֬ೝͰ͖Δ💸

Slide 21

Slide 21 text

ϔομʔ෦෼ͷ ظؒࢧग़ֹ ύʔςΟΫϧͷදࣔ )BQUJD'FFECBDL ΠϯλϥΫγϣϯͷ੔ཧ 👆άϥϑ্ͷυϥοάૢ࡞ ΠϯδέʔλͷҐஔ ܾࡁͨ͠ళฮ໊ͷදࣔ

Slide 22

Slide 22 text

ϑΥʔΧε͞Ε͍ͯΔ೔෇ ΠϯλϥΫγϣϯͷ੔ཧ 👆άϥϑ্ͷυϥοάૢ࡞ lૢ࡞zͱlදࣔzͷؒʹհࡏ͢Δ.VUBCMFͳঢ়ଶΛநग़͢Δ ϑΥʔΧε͞Ε͍ͯΔ೔෇ ϔομʔ෦෼ͷ ظؒࢧग़ֹ ύʔςΟΫϧͷදࣔ )BQUJD'FFECBDL ΠϯδέʔλͷҐஔ ܾࡁͨ͠ళฮ໊ͷදࣔ ʢ೔෇ͷมಈʣ

Slide 23

Slide 23 text

ΠϯλϥΫγϣϯͷ੔ཧ lૢ࡞zͱlදࣔzͷؒʹհࡏ͢Δঢ়ଶΛநग़͢Δ͜ͱͰ 4XJGU6*+FUQBDL$PNQPTFͰͷ࣮૷ํ਑΋ఆ·Δ

Slide 24

Slide 24 text

·ͱΊ

Slide 25

Slide 25 text

·ͱΊ ςʔϚ ઃܭϑΣʔζʹ͓͚Δlෳࡶͳߏ੒ཁૉΛ࣋ͭ6*zͱͷ޲͖߹͍ํ 6*ͷߏ੒ཁૉΛ෼ղ͠ ֤ཁૉͷݺশ΍ ৼΔ෣͍Λఆٛ͢Δ ߏ੒ཁૉͷఆٛ 6*ͷදࣔʹཁ͢Δ৘ใΛ ໢ཏతʹ੔ཧͯ͠ σʔλߏ଄Λઃܭ͢Δ σʔλιʔεͷઃܭ 6*ʹର͢ΔϢʔβʔૢ࡞΍ දࣔঢ়ଶΛચ͍ग़͠ հࡏ͢Δঢ়ଶΛ੔ཧ͢Δ ΠϯλϥΫγϣϯͷ੔ཧ

Slide 26

Slide 26 text

͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ