SketchとAbstractとZeplinを使ってデザイン連携が楽になった話

Slide 1

Slide 1 text

01 2 8 02102 0 .. 2 01 2 8 02102 0 .. 2 4LFUDIʴ"CTUSBDUʴ;FQMJOͰ 6*σβΠϯͷ࡞ۀޮ཰͕ൈ܈ʹྑ͘ͳͬͨ࿩ ג ࣜ ձ ࣾ ε λ σ Ο ε τ ా த ༐ Ұ ࿕

Slide 2

Slide 2 text

01 2 8 02102 0 .. 2 ాத ༐Ұ࿕ : V J DI J S P 5 B O B L B ͨͳΏ͏ גࣜձࣾελσΟετ 6*σβΠφʔ झຯ͸ອըɾΞχϝؑ৆ɺΠϥετɺΠϯςϦΞάοζ ऩूɺεϊϘɺμʔπɺFUDʜ

Slide 3

Slide 3 text

01 2 8 02102 0 .. 2 ςΟʔνϛʔɾϏζ ϓϩμΫτʹ͍ͭͯ

Slide 4

Slide 4 text

01 2 8 02102 0 .. 2 ύιίϯΛ࢖ΘͣεϚʔτϑΥϯ͚ͩͰ ը૾ɾಈըϕʔεͷϚχϡΞϧ࡞੒ɾ഑৴ͱӾཡ؅ཧ͕Մೳ ϓϩμΫτʹ͍ͭͯ ύιίϯ Ͱ΋0,ʂ εϚϗ͚ͩͰ ϚχϡΞϧ ࡞੒Մೳ

Slide 5

Slide 5 text

01 2 8 02102 0 .. 2 ಋೖاۀࣾ਺ ʢ༗ঈܖ໿ͷΈʣ ࣾ ˞೥݄̐ ݱࡏ ϓϩμΫτʹ͍ͭͯ

Slide 6

Slide 6 text

01 2 8 02102 0 .. 2 ϓϩμΫτʹ͍ͭͯ

Slide 7

Slide 7 text

01 2 8 02102 0 .. 2 ຊ୊ ͯͯ͞͞

Slide 8

Slide 8 text

01 2 8 02102 0 .. 2 σβΠϯϑΝΠϧͬͯ ͲΜͳײ͡Ͱڞ༗͍ͯ͠·͔͢ʁ ຊ୊Ͱ͢

Slide 9

Slide 9 text

01 2 8 02102 0 .. 2 %FTJHOFS ։ൃ෦ Θͨ͠Ͱ͢ &OHJOFFS Y ຊ୊Ͱ͢

Slide 10

Slide 10 text

01 2 8 02102 0 .. 2 ݟ͖͑ͯͨ ʮ̎ͭͷ՝୊ʯ

Slide 11

Slide 11 text

01 2 8 02102 0 .. 2 ʮ̎ͭͷ՝୊ʯ ෳ਺ਓͰͷσβΠϯϑΝΠϧͷڞಉฤू؅ཧํ๏ΛͲ͏͢Δ͔ σβΠφʔಉ࢜ͰͷσβΠϯϑΝΠϧڞ༗ํ๏ʹ͍ͭͯ ՝ ୊ 1 σβΠφʔ➔ΤϯδχΞ΁ͷσβΠϯϑΝΠϧͷڞ༗ํ๏ʹ͍ͭͯ ՝ ୊

Slide 12

Slide 12 text

01 2 8 02102 0 .. 2 ՝୊̍ෳ਺ਓͰͷσβΠϯϑΝΠϧͷڞಉฤू؅ཧʹ͍ͭͯ ෳ਺ਓͰͷσβΠϯϑΝΠϧͷ ڞಉฤू؅ཧʹ͍ͭͯ ՝୊̍

Slide 13

Slide 13 text

01 2 8 02102 0 .. 2 ՝୊̍ෳ਺ਓͰͷσβΠϯϑΝΠϧͷڞಉฤू؅ཧʹ͍ͭͯ ࢖͍ͬͯΔ6*੍࡞πʔϧ ಈ࡞΋͍ܰ͠ɺϕΫλʔϑΝΠϧରԠ͍ͯ͠ΔͷͰ ΊͬͪΌ࢖͍΍͍͢ʂ

Slide 14

Slide 14 text

01 2 8 02102 0 .. 2 ՝୊̍ෳ਺ਓͰͷσβΠϯϑΝΠϧͷڞಉฤू؅ཧʹ͍ͭͯ %FTJHO'JMF ϖʔδ"ʙ'Λ ୲౰͠·͢ɻ ϖʔδ(ʙ-Λ ୲౰͠·͢ɻ

Slide 15

Slide 15 text

01 2 8 02102 0 .. 2 ՝୊̍ෳ਺ਓͰͷσβΠϯϑΝΠϧͷڞಉฤू؅ཧʹ͍ͭͯ Ͳ͏΍ͬͯ̎ਓʢෳ਺ਓʣͰ੍࡞Λ͢Δʁ

Slide 16

Slide 16 text

01 2 8 02102 0 .. 2 ՝୊̍ෳ਺ਓͰͷσβΠϯϑΝΠϧͷڞಉฤू؅ཧʹ͍ͭͯ %FTJHO'JMF $MPVE σβΠϯϑΝΠϧ͸Ϋϥ΢υ্Ͱ؅ཧ͸͍ͯ͠Δ͚Ͳʜ

Slide 17

Slide 17 text

01 2 8 02102 0 .. 2 ՝୊̍ෳ਺ਓͰͷσβΠϯϑΝΠϧͷڞಉฤू؅ཧʹ͍ͭͯ %FTJHO'JMF $MPVE º ಉ࣌ʹҰͭͷϑΝΠϧΛฤू͢Δ͜ͱ͸Ͱ͖ͳ͍

Slide 18

Slide 18 text

01 2 8 02102 0 .. 2 ՝୊̍ෳ਺ਓͰͷσβΠϯϑΝΠϧͷڞಉฤू؅ཧʹ͍ͭͯ ୲౰͢Δϖʔδ͝ͱʹϑΝΠϧΛ෼੍͚ͯ࡞ͯ͠΋ɾɾɾ ౷ ߹

Slide 19

Slide 19 text

01 2 8 02102 0 .. 2 ՝୊̍ෳ਺ਓͰͷσβΠϯϑΝΠϧͷڞಉฤू؅ཧʹ͍ͭͯ ౷ ߹ )FBEFS౳ͷ ڞ௨ύʔπ͕ όϥ͚ͯΔ मਖ਼͢Δ౓ʹ ౷߹͠ͳ͍ͱ͍͚ͳ͍ ͭΒΈ

Slide 20

Slide 20 text

01 2 8 02102 0 .. 2 ՝୊̍ෳ਺ਓͰͷσβΠϯϑΝΠϧͷڞಉฤू؅ཧʹ͍ͭͯ ύʔπͷ؅ཧ͕େมʹͳͬͨΓͳͲ࠷ऴతͳ౷߹͕ΊͬͪΌେมͦ͏ʜ ໘౗ͦ͘͞͏ʂʂʂʂʂ ˣ

Slide 21

Slide 21 text

01 2 8 02102 0 .. 2 ՝୊̎ΤϯδχΞ΁ͷड͚౉͠ɺڞ༗ํ๏ΛͲ͏͢Δ͔ ՝୊̎ ΤϯδχΞ΁ͷड͚౉͠ɺ ڞ༗ํ๏ΛͲ͏͢Δ͔

Slide 22

Slide 22 text

01 2 8 02102 0 .. 2 ՝୊̎ΤϯδχΞ΁ͷड͚౉͠ɺڞ༗ํ๏ΛͲ͏͢Δ͔ Ͱ͖ͨ Αʔ

Slide 23

Slide 23 text

01 2 8 02102 0 .. 2 ՝୊̎ΤϯδχΞ΁ͷड͚౉͠ɺڞ༗ํ๏ΛͲ͏͢Δ͔ ࠷ॳ͸͜Μͳײ͡Ͱ౉ͯ͠·ͨ͠ɻ

Slide 24

Slide 24 text

Slide 25

Slide 25 text

01 2 8 02102 0 .. 2 ՝୊̎ΤϯδχΞ΁ͷड͚౉͠ɺڞ༗ํ๏ΛͲ͏͢Δ͔ ࠷ ॳ ͸ ͜ Μ ͳ ײ ͡ Ͱ ౉ ͠ ͯ · ͠ ͨ ɻ ग़དྷ্͕ͬͨσβΠϯʹϓϥάΠϯπʔϧͰNBSHJO΍ϑΥϯταΠζɺΧ ϥʔίʔυΛՄࢹԽ 45&1 4LFUDI্͔Β"SUCPBSE಺ͷσʔλΛը૾อଘɻΞΠίϯͳͲ΋ผ్ը૾Խ 45&1 ը૾Λ%SPQCPYʹ֨ೲ 45&1 4MBDLͰΤϯδχΞʹ63-Λڞ༗ 45&1 ՝୊̎ΤϯδχΞ΁ͷड͚౉͠ɺڞ༗ํ๏ΛͲ͏͢Δ͔ େن໛ͳϓϩδΣΫτͷ৔߹ʜ ΞΠίϯ౳ͷૉࡐը૾ɺϖʔδ਺͕ଟ͍ ˣ ΊͬͪΌ໘౗͍͘͞ʂʂʂʂʂʂ Ұͭͷϖʔδʹର͢Δ޻਺͕૿͑Δ ˣ

Slide 26

Slide 26 text

01 2 8 02102 0 .. 2 Ͳ͏͢Ε͹͍͍Μͩɾɾɾ

Slide 27

Slide 27 text

01 2 8 02102 0 .. 2 ͲͷΑ͏ʹղܾ͔ͨ͠ ղܾࡦ

Slide 28

Slide 28 text

01 2 8 02102 0 .. 2 ղܾࡦ

Slide 29

Slide 29 text

01 2 8 02102 0 .. 2 ղܾࡦ

Slide 30

Slide 30 text

01 2 8 02102 0 .. 2 " C T U S B DU Ξ ϒ ε τ ϥ Ϋ τ ͱ ͸ ʁ

Slide 31

Slide 31 text

01 2 8 02102 0 .. 2 "CTUSBDUͱ͸ 4LFUDIͰ࡞ͬͨσβΠϯϑΝΠϧΛ (JUతʹόʔδϣϯΛ؅ཧͰ͖Δπʔϧ

Slide 32

Slide 32 text

01 2 8 02102 0 .. 2 "CTUSBDUͱ͸ σ β Π φ ʔ ൛ ͷ ( JU) V C ɺ # JUC V D L F U ͷ ༷ ͳ ΋ ͷ Ͱ ͢ ɻ

Slide 33

Slide 33 text

01 2 8 02102 0 .. 2 "CTUSBDUͱ͸ ෳ਺ਓͰͷ࡞ۀ͕Ͱ͖Δʂ

Slide 34

Slide 34 text

01 2 8 02102 0 .. 2 %FTJHO'JMF .BTUFS #SBODI" #SBODI# #SBODI" .FSHF 6QEBUF #SBODI# .FSHF "CTUSBDUͱ͸ ৽نͷ ϖʔδΛ ࡞Ζ͏ ύʔπͷ मਖ਼Λ ͠Α͏

Slide 35

Slide 35 text

01 2 8 02102 0 .. 2 ಋೖͨ݁͠Ռͦͷ̍ "CTUSBDUΛಋೖͨ݁͠Ռʜ ՝୊̍ ෳ਺ਓͰͷσβΠϯϑΝΠϧͷ ڞಉฤू؅ཧʹ͍ͭͯ

Slide 36

Slide 36 text

01 2 8 02102 0 .. 2 ಋೖͨ݁͠Ռͦͷ̍ ύʔπͷ؅ཧ͕େมʹͳͬͨΓͳͲ࠷ऴతͳ౷߹͕ΊͬͪΌେมͦ͏ʜ ໘౗ͦ͘͞͏ʂʂʂʂʂ ˣ ˣ ͚ͩͬͨͲʜ

Slide 37

Slide 37 text

01 2 8 02102 0 .. 2 ಋೖͨ݁͠Ռͦͷ̍ ख࡞ۀͰσʔλͷ౷߹Λߦ͏ඞཁ͕ͳ͘ͳΓ·ͨ͠ʂ .BTUFSͰσβΠϯϑΝΠϧΛҰͭͰ؅ཧ͢ΔͷͰʜ

Slide 38

Slide 38 text

01 2 8 02102 0 .. 2 ;FQMJOͱ͸ ; F Q M J O θ ϓ Ϧ ϯ ͱ ͸ ʁ ˞ ਖ਼ ֬ ͳ ಡ Έ ํ ͕ · ͩ Θ ͔ ͬ ͯ ͍ · ͤ Μ

Slide 39

Slide 39 text

01 2 8 02102 0 .. 2 ;FQMJOͱ͸ 6QMPBE 4LFUDIͰ੍࡞ͨ͠σβΠϯϑΝΠϧΛΞοϓϩʔυɻ 4LFUDIΛ͍࣋ͬͯͳ͍ϢʔβʔͰ΋σβΠϯ͕֬ೝͰ͖Δʂ

Slide 40

Slide 40 text

01 2 8 02102 0 .. 2 ಋೖͨ݁͠Ռͦͷ̎ ՝୊̎ ;FQMJOΛಋೖͨ݁͠Ռʜ ΤϯδχΞ΁ͷ ड͚౉͠ɾڞ༗ํ๏ΛͲ͏͢Δ͔

Slide 41

Slide 41 text

01 2 8 02102 0 .. 2 ಋೖͨ݁͠Ռͦͷ̎ # F G P S F ग़དྷ্͕ͬͨσβΠϯʹϓϥάΠϯπʔϧͰNBSHJO΍ϑΥϯταΠζɺΧ ϥʔίʔυΛՄࢹԽ 45&1 4LFUDI্͔Β"SUCPBSE಺ͷσʔλΛը૾อଘɻΞΠίϯͳͲ΋ผ్ը૾Խ 45&1 ը૾Λ%SPQCPYʹ֨ೲ 45&1 4MBDLͰΤϯδχΞʹ63-Λڞ༗ 45&1

Slide 42

Slide 42 text

01 2 8 02102 0 .. 2 ಋೖͨ݁͠Ռͦͷ̎ ग़དྷ্͕ͬͨσβΠϯΛ;FQMJOʹΞοϓϩʔυ͢Δ 45&1 4MBDLʹϦϯΫ͢Δ͜ͱͰࣗಈతʹϝϯόʔʹ௨஌ͯ͠ڞ༗ 45&1 ͜ΜͳʹָʹͳΓ·ͨ͠ʂ " G U F S

Slide 43

Slide 43 text

01 2 8 02102 0 .. 2 ಋೖͨ݁͠Ռͦͷ̎ NBSHJOͳͲͷهࡌ͢ΔࢦఆॻΛ ผ్࡞੒͢Δ͜ͱͳ͘ڞ༗͕ՄೳʹͳΓ·ͨ͠ ίϝϯτͰ΋σβΠϯϑΝΠϧΠϝʔδ಺ʹमਖ਼ࢦࣔ΋ૹΕΔͷͰ ௚ײతʹमਖ਼ՕॴΛཧղͰ͖ΔΑ͏ʹͳͬͯɺ σβΠφʔͱΤϯδχΞͷίϛϡχέʔγϣϯ΋ԁ׈ʹͳΓ·ͨ͠ɻ

Slide 44

Slide 44 text

01 2 8 02102 0 .. 2 ·ͱΊ

Slide 45

Slide 45 text

01 2 8 02102 0 .. 2 ·ͱΊ "CTUSBDU্Ͱ4LFUDIσʔλΛ؅ཧ "CTUSBDUͰ.BTUFS͔Β CSBODIΛ੾ͬͯσβΠϯσʔλΛฤूͯ͠DPNNJU ग़དྷ্͕ͬͨσβΠϯϑΝΠϧΛ;FQMJOʹΞοϓϩʔυ

Slide 46

Slide 46 text

01 2 8 02102 0 .. 2 ·ͱΊ σβΠφʔɺΤϯδχΞؒͰͷڞ༗ํ๏͕ ඇৗʹεϜʔζʹͳΓɺετϨεϑϦʔʹͳͬͨʂ

Slide 47

Slide 47 text

01 2 8 02102 0 .. 2 13 ΤϯδχΞɾσβΠφʔืूதͰ͢ Ұॹʹ͔ͨͨͬͯ͘ΕΔ