esaのデザインの話 - 自分たちのWebサービスを作るデザイナーとしてやっていること / Design Talk of esa

Slide 1

Slide 1 text

ࣗ෼ͨͪͷ8FCαʔϏεΛ࡞ΔσβΠφʔͱͯ͠΍͍ͬͯΔ͜ͱ esaͷσβΠϯͷ࿩ @ken_c_lo TAEKO AKATSUKA Hackers Champloo 2018 / 2018.06.30

Slide 2

Slide 2 text

!2 w ੺௩ົࢠ w !LFO@D@MP w FTB--$ w ϓϩάϥϚʔਓσβΠφʔਓਓͷձࣾ w ౦ژɾौ୩ʹΦϑΟεʢ࠷ۙ͸ϑϧϦϞʔτʣ w ૑ۀऀɾσβΠφʔ

Slide 3

Slide 3 text

https://esa.io

Slide 4

Slide 4 text

MarkdownͰॻ͚Δ৘ใڞ༗αʔϏε esaΛ͝ଘ஌ͷํʁ ůŢ

Slide 5

Slide 5 text

!5 esa — ϋοΧʔζνϟϯϓϧʔ w ೥ʹొஃʮFTBJPͷͭ͘Γ͔ͨʯ w IUUQTFTBQBHFTJPQTIBSJOHQPTUTCEDBDEDEBFTMJEFTIUNM w ೥࿈ଓεϙϯαʔπʔϧεϙϯαʔ w FTB͕ॳΊͯձࣾͱͯ͠εϙϯαʔͨ͠Πϕϯτ w ٱ͠ৼΓʹԭೄʹདྷΕ·ͨ͠ʢ೥ͿΓ౓໨ʣ w ԭೄ࠷ߴʂϋΧνϟϯ࠷ߴʂ

Slide 6

Slide 6 text

!6 ຊ೔ͷ͓୊ w FTBͷσβΠϯϓϩηεͷ঺հ w ࣗ෼ͨͪͷαʔϏεΛσβΠϯ͢Δ͜ͱ ࣗ෼ͷαʔϏεΛ࡞Γ͍ͨਓɺ 8FCαʔϏεͷσβΠϯʹڵຯ͕͋Δਓͷ ࢀߟʹͳΕ͹޾͍Ͱ͢

Slide 7

Slide 7 text

!7 esa͸झຯͷϓϩμΫτ͔Β ελʔτ͠·ͨ͠ w ৄ͍͠஀ੜͷ༷ࢠ͸ʮFTBJPͷͭ͘Γ͔ͨʯ w IUUQTFTBQBHFTJPQTIBSJOHQPTUTCEDBDEDEBFTMJEFTIUNM

Slide 8

Slide 8 text

։ൃ߹॓Ͱ!GVLBZBUTVͱFTBΛ࡞Δ 2014.05 0ϲ݄ w झຯͰຖ೔։ൃΛଓ͚Δ w ஥ؒ͏ͪͷ೔ใڞ༗ʹ࢖͏ 2014.11 ๏ਓԽ0QFOЌϦϦʔε 6ϲ݄ 2015.01 ਖ਼ࣜ༗ྉ൛ϦϦʔε 8ϲ݄ 2016.02 ࠇࣈԽ 20ϲ݄ w ೥݄ɺ w ϋοΧʔζνϟϯϓϧʔొஃ 2018.06 ݱࡏ೥໨ɺ໿ ͷاۀɾஂମ͕ར༻ 49ϲ݄ w !QQXPSLT͕KPJOɺࣾһ໊ʹ

Slide 9

Slide 9 text

੺௩ݸਓͷܦྺ w σβΠφʔྺ20೥ w ࠷ॳ͸ࢴഔମͷάϥϑΟοΫσβΠφʔͩͬͨ w ϙελʔɺύϯϑϨοτɺࡶࢽɾॻ੶ࢽ໘ɺϩΰͳͲ w 8FCσβΠφʔྺ16೥͘Β͍ w ࠷ॳ͸੩తαΠτɺ޿ࠂܥͷλΠΞοϓίϯςϯπ౳͕ଟ͔ͬͨ w 8FCαʔϏεͷ6*σβΠφʔྺ12೥͘Β͍ w 8FCαʔϏεΛझຯͰ࡞͍ͬͯΔྺ6೥͘Β͍

Slide 10

Slide 10 text

Slide 11

Slide 11 text

Slide 12

Slide 12 text

߹ಉձࣾFTB w ΤϯδχΞਓσβΠφʔਓ w 3VCZPO3BJMTΛ࢖ͬͨ8FCαʔϏε։ൃ w શһ͕։ൃऀ w શһ͕ܦӦऀ w શһ͕ࣗࣾαʔϏεͷϢʔβʔ w ࠷ۙ͸J04΋΍͍ͬͯ·͕͢ɺ8FC͕த৺

Slide 13

Slide 13 text

Designer Engineer w 6*σβΠϯ w ϏδϡΞϧσβΠϯ w ίϯηϓτϝΠΩϯά w 3BJMTͷWJFX )BNM w $444BTT+4গ͠ w Πϥετ w άοζ੍࡞ w اը w 6*ઃܭ w Ϣʔβʔαϙʔτ w όάमਖ਼ w ܦཧɾࣄ຿ɾܦӦ w ޿ใ w Ӧۀ w 5XJUUFS w Τΰαʔν w ϢʔβʔΠϯλϏϡʔ w डୗ։ൃ w όοΫΤϯυ 3VCZPO3BJMT w ϑϩϯτΤϯυ +4 w Πϯϑϥ w ؂ࢹ w ۀ຿ͷࣗಈԽ w $IBU0QT w ޻࡞ ࠓ೔࿩͢ͷ͸͜ͷ΁Μͷ࿩

Slide 14

Slide 14 text

!14 esaͷσβΠϯϓϩηε FTBͷσβΠϯ͸ͲͷΑ͏ʹߟ͑ͯ࡞͍ͬͯΔͷ͔ʁ ৭ɺ6*ɺϒϥϯσΟϯά౳ɺσβΠϯϓϩηεͷҰ෦Λ͝঺հ͠·͢

Slide 15

Slide 15 text

!15 esaͷσβΠϯͷํ਑ w ָ͠͞ɾ͔Θ͍͞ɾΏΔ͞ w ৽઱͞ɾ໨৽͠͞ w ΤϯδχΞϑϨϯυϦʔ ࡞Γ࢝Ίͷ͔࣌Βߟ͑ͯͯɺݱࡏ΋มΘΒͳ͍ํ਑

Slide 16

Slide 16 text

!16 ָ͠͞ɾ͔Θ͍͞ɾΏΔ͞ w ۀ຿ͬΆ͞Λײ͡ͳ͍ɺ࢖ָ͍ͬͯͯ͠΋ͷʹ w ೔ใ΍υΩϡϝϯτΛॻ͘͜ͱ͸ࣗ෼ͨͪʹͱͬͯͱͯ΋ָ͍͜͠ͱ w ॻָ͘͠͞ɺಡΉָ͠͞Λ఻͍͑ͨ w ָ͕͠͞ɺϞνϕʔγϣϯΛ্͛Δ w ΩϟϥΫλʔ

Slide 17

Slide 17 text

!17 ৽઱͞ɾ໨৽͠͞ w طଘͷ৘ใڞ༗αʔϏεͱ͸ҰઢΛըͨ͠งғؾ w ͔͠͠ɺحΛͯΒΘͣଟ͘ͷਓʹೃછΈਂ͍6* w ৽͗͢͠Δ΋ͷ͸ଟ͘ͷਓʹͱͬͯ࢖͍ͮΒ͍ɹ w ڝ߹ͱ͸গ͠ҧͬͨ෼໺ͷ΋ͷΛࢀߟʹ͢Δ w ΤσΟλ w ϑΝΠϧΤΫεϓϩʔϥʔ w ΤσΟτϦΞϧσβΠϯ

Slide 18

Slide 18 text

!18 ΤϯδχΞϑϨϯυϦʔ w ΤϯδχΞจԽͱ૬ੑͷྑ͍΋ͷʹ w 3FTQFDU(JU)VC w ΤϯδχΞ͔Βੜ·ΕΔΑ͍श׳͕ະདྷΛ੾Γ։͘ w ͔ͭΤϯδχΞҎ֎΋࢖͍ͨ͘ͳΔ਌͠Έ΍͢͞ w ΤϯδχΞతࢥ૝ͷڧ͞Λɺ͔Θ͍͞ͰόϥϯεΛऔͬͯத࿨ ΤϯδχΞจԽʹɺඇΤϯδχΞΛר͖ࠐΈ͍ͨ

Slide 19

Slide 19 text

!19 esaͷΧϥʔ FTBͷΧϥʔεΩʔϜ͸ͲͷΑ͏ʹߟܾ͑ͯΊ͔ͨ main-color #0a9b94 text-color #3c4a60 accent-color #f29600 base-color #efede0

Slide 20

Slide 20 text

!20 esaͷϝΠϯΧϥʔͷ৚݅ FTBʹͱͬͯΑ͍৭͸Կ͔Λߟ͑ͯΈΔ w ໨ʹ΍͍͞͠৭ w ϦϯΫ৭ʹ΋࢖͑Δ৭ w ڝ߹͕গͳ͍৭ w ΧδϡΞϧͰ໌Δ͍৭ w ઌೖ؍ͷগͳ͍৭ main-color #0a9b94

Slide 21

Slide 21 text

!21 ৚݅ʹ͋͏৭Λফڈ๏Ͱ୳ͦ͏ GSPNIUUQTqBUVJDPMPSTDPNQBMFUUFEFGP

Slide 22

Slide 22 text

!22 ໨ʹ༏͍͠৭ ೔ৗతʹ࢖͏௕͘ݟΔը໘ͳͷͰɺ͋·Γܹࢗతͳ৭͸ආ͚͍ͨ Ϣʔβʔͷ࡞ۀͷअຐʹͳΒͳ͍Α͏ʹ ☓ஆ৭ܥ w ͪΐͬͱΪϥΪϥͦ͠͏ w ͔Θ͍͍͚Ͳπʔϧͱͯ͠௕͍࣌ ؒ໨ʹ͢Δʹ͸఍߅͕͋Δ ☓ࢵ w ͪΐͬͱΪϥΪϥͦ͠͏

Slide 23

Slide 23 text

!23 ϦϯΫ৭ʹ΋࢖͑Δ৭ ϝΠϯΧϥʔΛϦϯΫͷจࣈ৭ʹ΋ྲྀ༻͠ɺ৭਺Λ͓͑͞γϯϓϧͳը໘ʹ͍ͨ͠ ☓ԫ৭ w จࣈ৭ʹ͸ݟͮΒ͍ ☓੺ w XBSOJOHܥͱ͔ͿΔ ☓Ϟϊτʔϯܥ w ී௨ͷจࣈ৭ͱ͔ͿΔ

Slide 24

Slide 24 text

!24 ڝ߹͕গͳ͍৭ ϝΠϯΧϥʔΛϦϯΫͷจࣈ৭ʹ΋ྲྀ༻͠ɺ৭਺Λ͓͑͞γϯϓϧͳը໘ʹ͍ͨ͠ ☓ϒϧʔ w ৘ใܥͷαʔϏεʹଟ͍ w ੨͍ΞΠίϯ͹͔ͬΓฒ ΜͩΓ͢Δ ☓ԫ྘ w ੨΄ͲͰ͸ͳׂ͍͕ͱ͋ Δײ͡

Slide 25

Slide 25 text

!25 ΧδϡΞϧͰ໌Δ͍৭ ָ͍͠ײ͡Λ૝ىͤ͞Δ৭ ☓ࢵ w γοΫͰΤϨΨϯτ ☓ೱࠠɾϞϊτʔϯ w ҉͍ w ͔ͬͪΓਅ໘໨

Slide 26

Slide 26 text

!26 ઌೖ؍ͷগͳ͍৭ ͍ΖΜͳਓʹ࢖ͬͯ΄͍͠ͷͰɺͳΔ΂͘૝ى͞ΕΔઌೖ؍΍όΠΞε͕গͳ͍ɺ ͋Δछແػ࣭Ͱɺதཱతͳ৭ʹ ☓ࢵ w ߴوͳײ͡ w ޷͖ݏ͍Θ͔ΕΔ ☓੺ܥ w ঁࢠͬΆ͍ͱ͍͏ઌೖ؍ʁ w ͜͜ʹ͸ͳ͍͚ͲϐϯΫ΋ ☓㐋ɾΦϨϯδ w ݩؾͳײ͡ w ޷͖ݏ͍͕গ͠Θ͔Εͦ͏

Slide 27

Slide 27 text

!27 ফڈ๏ͰɺΤϝϥϧυάϦʔϯ͕࢒ͬͨ ̋ΤϝϥϧυάϦʔϯ w ໨ʹ༏͘͠ɺϦϯΫ৭ʹ΋࢖͑Δ w ڝ߹αʔϏε΋͋·Γଟ͘ͳ͍ w ΧδϡΞϧͰ໌Δ͍ײ͡ w όΠΞε͕গͳ͍৭ w ࣗ෼ͷ޷͖ͳ৭Ͱ΋͋Δʢॏཁʣ

Slide 28

Slide 28 text

!28 ໌౓Λௐ੔͢Δ ݱࡏͷNBJODPMPS ໌౓ ໌౓ ໌౓ ໌౓ ໌Δ͍தʹ΋མͪண͖͕͋Γɺจࣈ৭ʹ࢖ͬͯ΋ݟ΍͍͢໌౓ʹ ৭૬ˠ ࠼౓ˠ ໌౓ˠ

Slide 29

Slide 29 text

!29 ໌౓ൺֱ ☓໌౓ ˚໌౓ ☓໌౓ ̋໌౓

Slide 30

Slide 30 text

!30 ໌౓ൺֱ ☓໌౓ ˚໌౓ ☓໌౓ ໌౓͸ѱ͘͸ͳ͍ͷ͕ͩɺͪΐͬͱམͪண͖͕ͳ͍ ̋໌౓

Slide 31

Slide 31 text

!31 ໌౓ൺֱ ☓໌౓ ˚໌౓ ☓໌౓ νΧνΧ͢ΔɺಡΈͮΒ͍ ѱ͘͸ͳ͍͕ɺϦϯΫ͕ฒ ΜͰ͍Δͱ೿खͳײ͡ ಡΈ΍͍͢ɾམͪண͖ ҉ͯ͘ɺී௨ͷจࣈ৭ͱ۠ ผ͕෇͖ͮΒ͘ͳͬͯ͘Δ ̋໌౓

Slide 32

Slide 32 text

!32 ͱ͜ΖͰࡢ೔ɺԭೄ͔ΒϦϦʔε͠·ͨ͠ ϝΠϯΧϥʔΛม͑ΒΕΔػೳ

Slide 33

Slide 33 text

!33 ςʔϚΧϥʔΛબ΂Δػೳ Ͳͷ৭΋͕Μ͹ͬͯબΜͩΜͰ͕͢ɺ΍ͬͺΓσϑΥϧτͷ྘͕Ұ൪ͬ͘͠Γ͘Δ

Slide 34

Slide 34 text

!34 esaͷςΩετΧϥʔ r text-color #3c4a60 accent-color #f29600 base-color #efede0 ࣮͸ɺࠇͰ΋άϨʔͰ΋ͳ͍ɻೱࠠͳͷͩͬͨɻ

Slide 35

Slide 35 text

!35 esaͷςΩετΧϥʔ ࣮͸ɺࠇͰ΋άϨʔͰ΋ͳ͍ɻೱࠠͳͷͩͬͨɻ text-color #3c4a60 black #000000 dark gray #444444

Slide 36

Slide 36 text

!36 black #000000 dark gray #444444 text-color #3c4a60

Slide 37

Slide 37 text

!37 black #000000 dark gray #444444 text-color #3c4a60 εϥΠυͩͱͳ͔ͳ͔Θ͔ΓͮΒ͍ΜͰ͕͢ʜNN Α͔ͬͨΒɺखݩͷFTBͷจࣈ৭ΛΠϯεϖΫλͱ͔Ͱ͍ͬͯ͡Έ͍ͯͩ͘͞ɻ

Slide 38

Slide 38 text

!38 ςΩετΧϥʔʹগ͠৭ຯΛՃ͑Δ main-color #0a9b94 text-color #3c4a60 a base-color #efede0 main-color #0a9b94 text-color #3c4a60 accent-color #f29600 base-color #efede0 w ΍ΘΒ͔͘ચ࿅͞Εͨҹ৅ʹͳΔ w ը໘ʹʮ৭ؾʯ͕ग़Δɻແຯס૩ɾߗ͕͞཈͑ΒΕΔ w ϝΠϯΧϥʔͷΤϝϥϧυάϦʔϯͱΑ͘ௐ࿨͢Δ੨ܥʹৼΔ w ʢஆ৭ܥͩͱগ͠ೱ஡ܥʹৼͬͨΓ͢Δ͜ͱ͕ଟ͍ʣ

Slide 39

Slide 39 text

!39 esaͷϕʔεΧϥʔ ίίͷ৭ main-color #0a9b94 base-color #efede0

Slide 40

Slide 40 text

!40 άϨʔʹͯ͠ΈΔͱྫྷ͍ͨײ͡ʹ… ࢖͍ͨ͞൒ݮ

Slide 41

Slide 41 text

!41 ϕʔεΧϥʔʹ΋গ͠৭ຯΛՃ͑Δ main-color #0a9b94 text-color #3c4a60 a base-color #efede0 main-color #0a9b94 text-color #3c4a60 a base-color #efede0 w ϝΠϯΧϥʔͱͷௐ࿨ w ϏϏουͳ৭ΞΠϘϦʔˠ΍ΘΒ͔ͰԹ͔Έͷ͋Δҹ৅ͷը໘ʹ

Slide 42

Slide 42 text

!42 ৭͸Sassͷม਺ʹͯ͠Ұݩ؅ཧ w ৭ม͑ͨ͘ͳͬͨ࣌ʹָ w ଞͷ৭΋ࢼͯ͠ݕূɾௐ੔͕͠ ΍͍͢

Slide 43

Slide 43 text

!43 esaͷλΠϙάϥϑΟ ςΩετʹؔ͢ΔσβΠϯͷߟ͑ํ

Slide 44

Slide 44 text

!44 esaͷλΠϙάϥϑΟͰ ؾΛ͚͍ͭͯΔ͜ͱ w ॻ͍ͯͯʛಡΜͰͯ ετϨε͕ͳ͍ w ॻ͍ͯͯʛಡΜͰͯ ָ͍͠ɺΘ͘Θ͘͢Δ w ྑ͍΋ͷΛ ॻ͍͍ͯΔʛಡΜͰ͍Δʣؾ෼ʹͳΕΔ w จষ͚ͩͰ͸ͳ͘ίʔυͷՄಡੑ w ॻ͖खͷࢥߟΛॿ͚ΔσβΠϯʢॻ͖ͳ͕Βߟ͑Δʣ ͜ͷ΁ΜΛ৺͕͚ͯ࡞ΔΑ͏ʹ͍ͯ͠·͢

Slide 45

Slide 45 text

!45 δϟϯϓ཰͕ߴ͍ͷ͕ಛ௃ w FTBͷδϟϯϓ཰ͷߴ͞ʹ͸ɺେ͖ͭ͘ͷҙਤ͕͋Γ·͢ ʢδϟϯϓ཰ຊจʹର͢Δɺݟग़͠ɾλΠτϧͷจࣈαΠζͷେ͖͞ͷൺ཰ʣ

Slide 46

Slide 46 text

!46 title reaction h1 h2 h3 tag ຊจ link category WIP action ཁૉ͕݁ߏଟ͍

Slide 47

Slide 47 text

!47 δϟϯϓ཰ͰཁૉؒͷϝϦϋϦΛग़͢ ☓δϟϯϓ཰খ ϝϦϋϦ͕ͳ͍ɻ λΠτϧͷ಺༰͕໨ʹೖͬͯདྷͮΒ͍ɻ εΧεΧͯ͠ऐ͍͠ײ͕͢͡Δׂʹɺཁૉؒͷ ҧ͍͕Θ͔ΓͮΒͪ͘͝Όͪ͝Όͨ͠ײ͡ʹ ̋δϟϯϓ཰େ λΠτϧ͕ೖ͖ͬͯ΍͍͢ɻ ཁૉؒͷҧ͍͕Θ͔Γ΍͍͢ ը໘ʹϦζϜ͕ੜ·Εɺ͍͖͍͖ͱ͢Δɻ

Slide 48

Slide 48 text

!48 ΤσΟτϦΞϧσβΠϯΛҙࣝ FTBͷهࣄϖʔδ͸ɺࡶࢽ΍৽ฉͳͲͷࢴ໘σβΠϯΛͪΐͬͱҙࣝͯ͠·͢ w ߴ͍δϟϯϓ཰ w ܩઢɾۭ͔͍ؒͮ w άϦουϨΠΞ΢τʢ͋·Γ࢖͑ͯͳ͍ʣ ಡΉ࣌ͷշద͞ɺோΊΔتͼʹ͍ͭͯ௕೥ࢼߦࡨޡ͞Ε͖ͯͨ෼໺ ʢࡶࢽ΍৽ฉهࣄΛॻ͍͍ͯΔΑ͏ͳؾ෼Ͱॻ͍ͯཉ͍͠ʣ

Slide 49

Slide 49 text

!49 ߴ͍δϟϯϓ཰͸ɺΘ͘Θ͘͢Δ δϟϯϓ཰Λ্खʹۦ࢖͢Δͱɺ؍Δਓͷ৺Λߴ༲ͤ͞ΔΑ͏ͳޮՌ͕͋Δ ʰԬຊҰએͷ౦ژσβΠϯʱΑΓIUUQTXXXBNB[PODPKQEQ ʢͪΐͬͱۃ୺ͳྫͰ͕͢ɺʮ৺གྷΔδϟϯϓ཰ʯͷΑ͍ྫͩͳ͋ͱɻʣ

Slide 50

Slide 50 text

!50 esaͷUIσβΠϯ FTBͷ6*σβΠϯͷҰ෦ͷߟ͑ํΛ঺հ

Slide 51

Slide 51 text

!51 ΧςΰϦͷσβΠϯ FTBͷ6*σβΠϯͷҰྫͱͯ͠ɺΧςΰϦσβΠϯ͕Ͱ͖Δ·ͰΛ঺հ͠·͢

Slide 52

Slide 52 text

!52 ·ͣ͸ΞΠσΞΛςΩετʹdump ࢓༷ͷΞΠσΞ΍ࢀߟࢿྉͳͲΛɺ(JU)VC*TTVF΍FTB ʹॻ͖ग़ͯ͠νʔϜͰڞ༗͠ɺσΟεΧογϣϯΛॏͶΔ

Slide 53

Slide 53 text

!53 esaͷΧςΰϦ͸ຊ࣭తʹ͸Կʹ͍ۙͷ͔ʁ ֊૚ߏ଄Λ୧͍ͬͯ͘ɺ࢖͍׳Εͨ6* ϑΝΠϧΤΫεϓϩʔϥʔ Λͭ͘Ζ͏ɹ Ϟμϯͳݟͨ໨ͷϑΝΠϧΤΫεϓϩʔϥʔ

Slide 54

Slide 54 text

!54 खඳ͖ͷϥϑ खඳ͖ͷϥϑͷஈ֊Ͱେମ࢓্͕Γʹ͍ۙ΋ ͷ͕ग़དྷ্͕͍ͬͯΔ *MMVTUSBUPS΍4LFUDIͰɺݪੇେͷϥϑΛ ࡞੒ʢ࠷ॳ͸നόʔδϣϯ΋ݕ౼͍ͯͨ͠ʣ ݪੇେͷϥϑ

Slide 55

Slide 55 text

!55 ΤϯδχΞͱ૬ஊ͠ͳ͕Β࣮૷ (JU)VCͷϓϧϦΫ্ͰɺσβΠφʔ͸WJFX ෦෼ΛɺΤϯδχΞ͸+4ɺόοΫΤϯυ෦෼ Λ࣮૷͠ͳ͕Βঃʑʹਫ਼౓ΛߴΊ͍ͯ͘

Slide 56

Slide 56 text

!56 esaͷUIͷ࡞ΓͷΤοηϯε w طଘͷ৭Μͳ΋ͷ͔ΒώϯτΛಘΔ w खඳ͖ͷϥϑͷ࣌఺Ͱ͋Δఔ౓ݻΊΔ w ΤϯδχΞͱҰॹʹσβΠϯ͢Δɹ 6*ͮ͘ΓͷϓϩηεͷதͰɺಛʹॏཁͩͱࢥ͍ͬͯΔ͜ͱ

Slide 57

Slide 57 text

!57 طଘͷ৭Μͳ΋ͷ͔ΒώϯτΛಘΔ w ͍ۙ෼໺ͷڝ߹αʔϏε΋΋ͪΖΜࢀߟ ʹ͢Δ͕ʜ w ৽چɺδϟϯϧ΍ϝσΟΞʹͱΒΘΕͣ ༷ʑͳ΋ͷ͔ΒώϯτΛಘΔ w εΫϦʔϯ͚ͩͰͳ͘ɺࢴഔମ΍ɺϦΞϧͳϓϩμΫτʹ ΋ώϯτ͸͋Δ w ڑ཭ͷ཭Εͨ෼໺͔ΒώϯτΛಘΔͱɺಠࣗੑ͕ग़Δ w ϨΨγʔͳ6*ˠϞμϯʹΞϨϯδ w ʮ͜ͷػೳͱɺຊ࣭తʹ͍ۙମݧΛ΋ͭ ΋ͷ͸Կ͔ʁʯͱ͍͏໰͍Λৗʹ࣋ͭ ௨஌σβΠϯͷώϯτ͸ോ࣌ܭ

Slide 58

Slide 58 text

!58 खඳ͖ͷϥϑͰΞΠσΞΛݻΊΔɹɹ w खඳ͖ͷϥϑ͸ɺ΄΅ඞͣඳ͘ w ࡶͰԼखͰ0,ɺ͖Ε͍ʹඳ͘͜ͱʹͩ͜ΘΒͳ͍ w खඳ͖ͷϥϑͷ࣌఺ͰɺΞΠσΞ΍഑ஔ ཁૉɺϨΠΞ΢τΛ໌֬ʹ͓ͯ͘͠ w ಄ͷதͰ͸׬੒͍ͯ͠Δ͘Β͍ͷঢ়ଶʹ͓ͯ͘͠ w ʢࣗ෼͸࠷ॳ͸ͳ͔ͳ͔Ͱ͖ͳ͔͚ͬͨͲ܇࿅ͰͰ͖ΔΑ ͏ʹͳͬͨɻʣ w ΠϥϨͳͲͷυϩʔΠϯάιϑτͷ্΍ɺίʔσΟϯά͠ ͍ͯΔ࣌͸ɺࡉ෦Λ٧ΊΕ͹͍͍͚ͩͷঢ়ଶʹ͓͖ͯͨ͠ ͍ʢεΫϦʔϯͷதͰେ͖ͳ໎͍͕ग़Δͱ͋·Γ͏·͍͘ ͔ͳ͍ʣ

Slide 59

Slide 59 text

!59 ΤϯδχΞͱҰॹʹUIσβΠϯ͢Δ w ૣ͍ஈ֊͔Βɺ౎౓ΤϯδχΞͱڞ༗ɾ ૬ஊͭͭ͠ɺϑΟʔυόοΫ΋Β͍ͳ͕ ΒਐΊΔ w (JU)VC*TTVF΍FTBΛ࢖ͬͯڞ༗ w Α͍ΞΠσΞΛ΋Β͑ͨΓɺ࣮૷ํ๏Λ໛ࡧͨ͠ΓɺΤϯ δχΞͷ࣮૷Ϟνϕʔγϣϯ΋ߴ·Δ w σβΠφʔΑΓ΋ΤϯδχΞͷํ͕໌֬ ͳ6*ͷΠϝʔδΛ͍࣋ͬͯΔ͜ͱ΋ଟ͍ w ػೳʹΑͬͯ͸ɺΤϯδχΞओಋͰ6*Λ ࡞Δ͜ͱ΋͋Δ

Slide 60

Slide 60 text

!60 esaͷϒϥϯσΟϯά ωʔϛϯάɾϩΰɾίϯηϓτ

Slide 61

Slide 61 text

!61 esaͷωʔϛϯά ͳͥɺFTBͱ͍͏໊લʹͨ͠ͷ͔ʁʜ͖͔͚ͬ͸͠ΐ͏΋ͳ͍͜ͱͩͬͨɻ w FTBΛ࡞ͬͨ։ൃ߹॓ͷͱ͖ ʹɺ!GVLBZBUTVͷϒϥ΢β ʹʮΤαʯͱ͍͏ϒοΫϚʔ Ϋ͕͋ΔͷΛݟ͚ͭͨ w ʮΤΰαʔνʯͷུΒ͍͠ w ΈΜͳͷπϘʹೖͬͨ w αʔϏε໊΋ʮΤαʯͰ͍͍ ͡ΌΜ w 5XJUUFSͷௗΞΠίϯ͕͍ͭ ͯͨ͜ͱ͔ΒɺΩϟϥ΋ௗ͕ طఆ࿏ઢʹͳͬͨ ωʔϛϯά͸೰Ή͜ͱ͕ଟ͍ͷͰɺϥοΩʔͳέʔεͩͱࢥ͍·͢ɻ

Slide 62

Slide 62 text

!62 esaͱ͍͏໊લͷྑ͠ѱ͠ w ޠײɾڹ͖ʢ͑͞ʣ w ୹͞ɺݺͼ΍͢͞ w ͔Θ͍͞ɺ਌͠Έ΍͢͞ɺΏΔ͞ w ΦϦδφϦςΟɺҹ৅ʹ࢒Δ w ҰݟɺԿ͔ͩΑ͘Θ͔Βͳ͍ʢڵຯΛͦͦΔʣ w ݁Ռతʹίϯηϓτͱ͏·͘ඥ෇͍ͨʢޙड़ʣ w ࠃࡍతʹෆརʢӳޠͩͱΤαͬͯಡΈͮΒ͍ʣ w ಡΈํ͕Θ͔Βͳ͍ͱ͍͏ਓ͕݁ߏ͍Δ w ;͚ͨ͟ײ͕͢͡Δ w ໊ࣾΛݴ͏࣌ஏ͔͍ͣ͠ʢ׳Εͨʣ w ڝ߹ʢ&VSPQFBO4QBDF"HFODZʣ w ʢϤʔϩού൛/"4"Έ͍ͨͳͱ͜Ζʣ ྑ͍఺ ѱ͍఺

Slide 63

Slide 63 text

!63 esaͷϩΰλΠϓ FTBͱ͍͏ΏΔ໊͍લͱ૬൓ͯ͠ɺϩΰλΠϓ͸ςοΫͳײ͡ʹ͔ͨͬͨ͠ɻʢத࿨ʣ esa طଘॻମΛϕʔεʹͯ͠ɺΑΓ௕ํܗʹۙͮ͘Α͏ʹௐ੔ɻ ॊΒ͔͕͞ऑ·ΓɺεΫΤΞͳҹ৅ʹɻ

Slide 64

Slide 64 text

!64 esaͷΩϟϥΫλʔ w ⒡⾚⒡ ͱ͍͏ֆจࣈ͕΋ͱ΋ͱ஥ؒ಺Ͱྲྀߦ͓ͬͯΓɺͦΕ͕ϕʔεʹ w ͜ͷ΁ΜͷܦҢ͸ͪ͜Βʹৄ͘͠IUUQTTQFBLFSEFDLDPNLFO@D@MPGBMTFLPUP w લड़ͷωʔϛϯάͷܦҢ΋͋ΓɺτϦʹ͠Α͏ͱࢥ͍ͬͯͨ w ͔Θ͍͍͚Ͳɺᇪͼͳ͍ w ແද৘ͰͪΐͬͱਓΛ۬ͬͨײ͡ˠUFDIΆ͞ ⒡㱿⒡

Slide 65

Slide 65 text

!65 w زԿֶతͳ଄ܗʹدͤΔ w ଄ܗΛγϯϓϧʹ w ྠֲઢ͸ͳ͘໘͚ͩͰදݱ w ओு͗͢͠ͳ͍ɾॊΒ͔͞ زԿֶతʹ ໘͚ͩͰදݱ ଄ܗΛγϯϓϧʹ → γϯϘϦοΫʹ

Slide 66

Slide 66 text

!66 όϦΤʔγϣϯ ৭ΜͳόʔδϣϯΛ࡞ͬͯ༡ΜͰ͍·͢ʢ͝౰஍FTBɾقઅFTBʣ

Slide 67

Slide 67 text

!67 άοζల։৭ʑ w ͋Γ͕͍ͨ͜ͱʹɺҙ֎ͱചΕ͍ͯΔ w ࡞Γ͍ͨάοζΛ࡞Γ͍ͨΑ͏ʹ࡞ΕΔͷͰָ͍͠ TIPQFTBJPʹ͓ͯങ͍ٻΊ͍͚ͨͩ·͢

Slide 68

Slide 68 text

!68 esaͷίϯηϓτ ʮ৘ใΛɺҭ͍ͯͨɻʯ

Slide 69

Slide 69 text

!69 ࡞Γͳ͕Βɺ࢖͍ͳ͕Βݟ͖͑ͯͨίϯηϓτ w ։ൃͷ࠷ॳ͔Β͸͖ͬΓܾΊ͍ͯ ͨΘ͚Ͱ͸ͳ͔ͬͨ w ʮ৘ใΛɺҭ͍ͯͨɻʯͱ͍͏ϫʔ υͷॳग़͸։ൃΛ͸͡Ί͔ͯΒϲ ݄ޙɻ w ஥ؒ಺͚ͩͰ࢖͍͸͡ΊͯɺFTB ͷྑ͞Λ࣮ײ͔ͯ͠ΒͦΕΛݴޠ Խͨ͠ɻ ίϯηϓτॳग़ͷLPͷϥϑ ࠷ॳ͸ʮ৘ใΛɺҭͯΑ͏ɻʯ ͩͬͨΒ͍͠ʢ֮͑ͯͳ͍ʣ

Slide 70

Slide 70 text

!70 esaಛ༗ͷػೳʮWIPʯ͕Ωʔʹ w 8*18PSLJOHJO1SPHSFTTʢ࡞ۀதʣ w ॻ్͖தͷυΩϡϝϯτΛʮ8*1ʯͱͯ͠νʔϜϝΠτʹڞ༗Ͱ͖Δɻ w 8*1ͷઃܭࢥ૝ʹ͍ͭͯৄ͘͠͸IUUQTTQFBLFSEFDLDPNLFO@D@MPXJQ WIPͳهࣄ͸άϨʔΞ΢τ͠ ͯදࣔ͞Εɺߋ৽ͯ͠΋௨஌ ͕ඈ͹ͳ͍Α͏ʹͳ͍ͬͯΔɻ

Slide 71

Slide 71 text

!71 Ұ౓ʹ׬ᘳΛ໨ࢦ͢ͷͰ͸ͳ͘ɺ ͩΜͩΜͱΑ͍ͯ͘͜͠͏ͱ͍͏Ձ஋؍ ʮҭͯΔʯ w զʑ͕ීஈߦ͍ͬͯΔɺFTBͦͷ΋ͷͷ࡞Γํʹ΋௨͡ΔՁ஋؍ w զʑ͚ͩͰͳ͘ɺ਎ͷճΓͷ։ൃऀʢFTBΛ࢖ͬͯཉ͍͠ਓୡʣʹ΋ڞ ௨͢ΔՁ஋؍ w ࣗ෼͕ͨͪීஈ͔Βେ੾ʹ͍ͯ͠ΔՁ஋؍ʹؾ͖ͮɺݴޠԽ͢Δ w τϦͬΆ͞ɺΤαͬΆ͞΋ײͤ͡͞ΔϫʔυˠΑΓڧݻͳੈք؍ʹ

Slide 72

Slide 72 text

!72 ʮ৘ใΛҭͯΔʯΛਤʹ͢Δ w τϦҭͯΔˠʦཛˠ੒௕ˠ૥ͮ͘ΓʧˠετʔϦʔʹ͢Δ w ϏδϡΞϥΠζ͢Δ͜ͱͰɺΑΓੈք؍͕͸͖ͬΓݟ͑ͯ͘Δ

Slide 73

Slide 73 text

!73 ͞Βʹৄ͘͠ݴޠԽɺϝοηʔδΛ఻͑Δ w IUUQTFTBJPDPODFQU

Slide 74

Slide 74 text

!74 طʹͦ͜ʹ͋ΔՁ஋؍Λɺܗʹͯ͠఻͑Δ w զʑ։ൃऀࣗ਎ͷಓඪʹͳΔ w ϓϩμΫτͷશͯΛʮ৘ใΛҭͯΔʯͨΊʹ࡞Ζ͏ͱ͍͏ҙࢥܾఆʹ w ϢʔβʔͱϓϩμΫτΛͭͳ͙Ս͚ڮʹͳΔ w ίϯηϓτ΁ͷڞײ͕ɺΑ͍ϢʔβʔΛूΊΔ w ͪ͜Β͔Βͷԡ͠෇͚Ͱͳ͘ɺࣗ཯෼ࢄతʹɺϢʔβʔͦΕͧΕͷΑΓྑ͍ FTBͱͷ޲͖߹͍ํΛൃݟ͢Δ ίϯηϓτ

Slide 75

Slide 75 text

!75 ۟ಡ఺Λ͚ͭɺࣈؒΛۭ͚Δ͜ͱͰɺ  ޠΓ͔͚ΔΑ͏ͳϝοηʔδੑ͕ੜ·ΕΔɻ ͓·͚: ίϐʔ·ΘΓͷTips ৘ใΛҭ͍ͯͨ ৘ ใ Λ ɺ ҭ ͯ ͨ ͍ ɻ

Slide 76

Slide 76 text

!76 ·ͱΊ ࣗ෼ͨͪͷ8FCαʔϏεΛ࡞ΔσβΠφʔͱͯ͠ɺ ԿΛ௥ٻ͍͖͍ͯͨ͠ͷ͔ʁ

Slide 77

Slide 77 text

!77 ࠓ·Ͱ࡞͖ͬͯͨ झຯͷϓϩμΫτͨͪ

Slide 78

Slide 78 text

Slide 79

Slide 79 text

2011.12 w/ @shu0115 ؆୯Ոܭ฽αʔϏε ϨγʔτΛஷΊͳ͍͍ͯ͘Ոܭ฽ 2013.04 w/ @katton, @ppworks 2013.09 w/ @ppworks and Team pplog 2014.05 w/ @fukayatsu ύʔϚϦϯΫͷͳ͍ϒϩά ʮϙΤϜʯ͕ॻ͚ΔαʔϏε λεΫ؅ཧπʔϧ ̍ਓ1JWPUBM5SBDLFSతͳ ͋Δڞ௨఺͕͋Δ͜ͱʹؾ͍ͮͨ ࠓ·ͰͰ͖ͳ͔ͬͨ͜ͱɺॻ͚ͳ͔ͬͨ͜ͱ͕ɺ ͪΐͬͱͨ͠࢓૊Έ΍σβΠϯ͕ ΋ͨΒ͢ʮΏΔ͞ʯʹΑͬͯͰ͖ΔΑ͏ʹͳΔ ʮΏΔ͠ͷσβΠϯʯ ͱউखʹݺΜͰɺڵຯΛ͍࣋ͬͯΔɻ ࠷ॳ͔Β͜͏͍͏΋ͷΛ࡞Ζ͏ͱ໨ࢦ͍ͯͨ͠Θ͚͡Ό͍͚Ͳɺ ޙ͔Βߟ͑Δͱ͍ͭ΋ࣗ෼͕࡞͖ͬͯͨ΋ͷ͸͜Εͩͬͨͱؾ͍ͮͨɻ

Slide 80

Slide 80 text

ΏΔ͠ͷσβΠϯͱ͸ w ΍Γ͍ͨ͜ͱΛ΍ͬͯɺࣗ෼Β͠͞Λग़ͯ͠΋͍͍Μ ͩΑͱ͍͏ʮ༐ؾ͚ͮʯ w ྫ 8*1͔ͩΒ·ͩະ׬੒ͷΞΠσΞΛॻ͍ͯ΋େৎ෉ w ·ͩ୭͔ͷ৺ͷதʹ͋Δ͚ͩͷૉఢͳ΋ͷΛɺͻͱͭͰ΋ଟ͘ੈք ʹ۩ݱԽ͍ͨ͠ ਓ͕͍͖͍͖ͱ͢Δɻ ͦΕͧΕ͕ɺࣗ෼Β͠͞Λൃشͯ͠ɺΑΓָ͘͠ੜ͖͍͚ͯΔɻ ΏΔ͠ɺΏΔ͞ʹΑͬͯɺ

Slide 81

Slide 81 text

ࣗ෼ͨͪͷϓϩμΫτΛ࡞Δ͜ͱ w ࣗ෼ͷσβΠφʔͱͯ͠ͷڵຯɾؔ৺Λ௥ٻ͢Δ͜ͱ͕ Ͱ͖Δ w Ϣʔβʔʹରͯ͠ྑ͍΋ͷΛఏڙ͢Δ͜ͱ͚ͩʹ஫ྗ͠ ͯɺਖ਼໘͔ΒऔΓ૊ΊΔ w طଘͷ૊৫ͷҰһͩͱ೉͍͜͠ͱ΋ʜಛʹ੓࣏ʹؔ͢Δίετ͕େ͖͔ͬͨɻ w ʢෆՄೳͰ͸ͳ͍ͱࢥ͏͚Ͳɺࣗ෼ͷྗ͕ٴ͹ͳ͔ͬͨPS޲͍ͯͳ͔ͬͨʣ w झຯͷΑ͏ʹָ͠ΜͰ࡞Δ͜ͱͱɺਓʹՁ஋Λఏڙͯ͠ Ϗδωεͱͯ͠੒ཱͤ͞Δ͜ͱͷཱ྆

Slide 82

Slide 82 text

डୗͷσβΠφʔͱ͸ҧ͏ʁ w ʮର৅ΛΑΓ͍͖͍͖ͱͤ͞ Δ͜ͱʯ͕σβΠϯͷتͼ w ͢Ͱʹ͋Δ΋ͷ͕ɺͲ͏΍ͬͨΒ΋ͬͱʮΒ͠ ͞ʯΛൃش͍͖͍͖ͯ͠ͱଘࡏ͢Δ͜ͱ͕Ͱ͖ Δ͔ʁߟ͑ɺ۩ݱԽ͢Δ w ࣗݾදݱͰ͸ͳ͘ɺଞऀͷදݱͷ͓ख఻͍ w ʜͱ͍͏ҙຯͰ͸ɺࠜͬ͜͸͋·ΓมΘΒͳ͍ FTB͕ճΓ͸͡ΊΔલ͸ɺͣͬͱडୗσβΠφʔͩͬͨʢࠓͰ΋ͨ·ʹ΍Δ͠ɺ੥ෛͷ࢓ࣄ͸޷͖ʣ w ͍͖͍͖ͱͤ͞Δର৅͕ෆಛఆଟ ਺ʹͳΔ w ͍͖͍͖ͱ͢Δ࢓૊ΈΛߟ͑Δ w ΑΓεέʔϥϒϧʹͳΔ w ϨΠϠʔ্͕͕ͭΔײ͡͸͋Δ w ࠷ऴతͳҙࢥܾఆݖ͕ࣗ෼ʹ͋Δ w ྑ͘΋ѱ͘΋ࣗ෼ͨͪͰܾΊͯɺ੹೚Λ΋ͭ ಉͩ͡ͱࢥ͏ ҧ͏͔΋ʁ ී௨ͷσβΠφʔͷ࢓ࣄͷԆ௕ઢ্ʹ͋Δ

Slide 83

Slide 83 text

!83 ਓΛ͍͖͍͖ͱͤ͞Δ΋ͷΛ σβΠϯ͍͖͍ͯͨ͠ ͜Ε͔Β΋ɺ