2019/11/09 北海道札幌の勉強会「SaCSS Special25 : BRANDING SPECIAL(SaCSS vol.108)」で発表した内容です https://sacss.net/special25/
খ͘͞͡ΊΔσβΠφʔͷใൃ৴ʙϒϩά4/4ͱͷ͖߹͍ํʙɹ4B$444QFDJBM#3"/%*/(41&$*"-
View Slide
֯ాҁՂ ͢Έ͔ͩ͋8FCσβΠφʔ ΠϥετϨʔλʔɹϑϦʔϥϯε TQJDBHSBQIɹגࣜձࣾΩςϨπϝϯόʔ
೦ͳ͕Β4&0ͱ͔ಡ·ΕΔϥΠςΟϯάͱ͔ανίͱ͔ϑΥϩϫʔΛ૿͢ํ๏ͱ͔ϊϋܥͷ͋Γ·ͤΜɻ
ւಓ
ೆϑΟϦϐϯηϒౡ
༷ʑͳͱ͜ΖʹηϛφʔߨࢣͰݺΜͰ͍͖ͨͩɺຊͷࣥචɾ৽ฉࡶࢽͷܝࡌͳͲͳͲʜ
େࡕͰࡉʑͱϑϦʔϥϯεΛӦΜͰ͍ͨࢲʹ͜ΜͳػձΛӡΜͰ͖ͯ͘Εͨͷʮϒϩάͱ4/4ʯͰͨ͠
5XJUUFS͔Βʑͷؾ͖ͮɺΠϥετɺࠂɺ͍Ζ͍Ζϒϩά͔ΒσβΠϯΠϥετͷهࣄOPUF͔Β5XJUUFSͷิ5JQTͷΞʔΧΠϒΠϥετ4/4͔ΒΠϥετͷΞʔΧΠϒ
ใΛಧ͚ΔͨΊʹߟ͑Δ͜ͱϒϩάͱ4/4ͷ͍͍ؔใൃ৴ͷڧ͍ຯํʓʓ͔ͩΒͰ͖ͳ͍ʜʁ·ͱΊ0102030405
ใΛಧ͚ΔͨΊʹߟ͑Δ͜ͱ01
Θͨ͠ͷʮใൃ৴ʯͱσβΠϯؔͷ5JQTॳ৺ऀ͚ͷͭ·͖͍ͮ͢ϙΠϯτͳͲσβΠϯͷجૅσβΠφʔҎ֎ʹಡΜͰΒ͑Δநతͳωλອըࠒײͨ͜͡ͱ͓͠Ζ͔ͬͨ͜ͱͳͲϏοάϥΠτͱεϞʔϧϥΠτ4 #ͦΜͳ࣌͜Εݏͳ͕͍ͭͳ͘ͳỳͨΒͲ͏ͳΓ·͔͢ϋỽϐồͰ͢ớϚΠφεỜớϓϥεỜớϚΠφεỜΘͨ͠ఱ࠽ΧΠτֶՊͱΖΏʹʅ Ϝ Aʅ Ϝ Aֶͱ͍͏͔ࢉۤखʜϚΠφεͱϚΠφεͰͳΜͰϓϥεʹͳΔͷͦΕͰ͢Ͷͦ͏͍͏͜ͱͰ͢
ใൃ৴ͰΉ͔͍ͣ͜͠ͱͲ͏ͬͯಡΜͰΒ͏ʁΘͨ͠ͷߟ͑Ͱେ͖͘ ͭʂʂ
ͦΕΛ୳͍ͯ͠Δਓʹݟ͚ͭͯΒ͏ͱʹ͔͘ਓ͕ଟ͍ͱ͜Ζʹݟͤʹߦ͘Θͨͬͪ͜͠Ͱ͢1 2
ਓ͕ଟ͍ͱ͜ΖͬͯɺϥΠόϧଟ͍͡ΌΜʁ
ʮݟͯΒ͏͔͚͠ʯͮ͘ΓσβΠφʔͷಘҙͰ͢ΑͶγΣΞ͞Εͦ͏ͳ͖ͯ͢ͳਤղσβΠφʔͳΒΘ͔Γ͢͞ϏδϡΞϧʹͩ͜ΘΔʂ
ͦΕɺγΣΞ͞ΕͯتΜͰΔ͚ͩ͡Όͳ͍ͷʁ
͓͠Ζ͍͓͠Ζ͍͓͠Ζ͍͓͠Ζ͍͓͠Ζ͍͓͠Ζ͍ֆ͕͖ֆ͕͖ֆ͕͖ֆ͕͖ֆ͕͖ֆ͕͖ֆ͕͖ֆ͕͖ڵຯ͋Γڵຯ͋Γڵຯ͋Γڵຯ͋Γڵຯ͋Γڵຯ͋Γڵຯ͋Γڵຯ͋Γڵຯ͋Γڵຯ͋Γڵຯ͋Γ͓͠Ζ͍
ۜߦͷΧϨϯμʔͳͥʮಈʯʮඒ͍͠෩ܠʯͳͷ͔ΒͬͨΧϨϯμʔͶͪ͜ΌΜ͔Θ͍͍Ͷ͔͜Θ͍͍͋ɺ̋̋ۜߦ̋̋ۜߦ
Ͱɺͨ͘͞ΜγΣΞ͞ΕͨΒʜͰɺͨ͘͞ΜγΣΞ͞ΕͨΒʜؒҧͬͨ͜ͱΛॻ͘ͱ൷͞ΕΔΜ͡Όͳ͍͔େͨ͜͠ͱͳ͍ͬͯࢥΘΕͨΒஏ͔͍ͣ͠มʹड͚औΒΕͯԌ্ͨ͠ΒͲ͏͠Α͏ؒҧͬͨ͜ͱΛॻ͘ͱ൷͞ΕΔΜ͡Όͳ͍͔େͨ͜͠ͱͳ͍ͬͯࢥΘΕͨΒஏ͔͍ͣ͠มʹड͚औΒΕͯԌ্ͨ͠ΒͲ͏͠Α͏
Ͱɺͨ͘͞ΜγΣΞ͞ΕͨΒʜͰɺͨ͘͞ΜγΣΞ͞ΕͨΒʜؒҧͬͨ͜ͱΛॻ͘ͱ൷͞ΕΔΜ͡Όͳ͍͔େͨ͜͠ͱͳ͍ͬͯࢥΘΕͨΒஏ͔͍ͣ͠มʹड͚औΒΕͯԌ্ͨ͠ΒͲ͏͠Α͏ؒҧͬͨ͜ͱΛॻ͘ͱ൷͞ΕΔΜ͡Όͳ͍͔େͨ͜͠ͱͳ͍ͬͯࢥΘΕͨΒஏ͔͍ͣ͠มʹड͚औΒΕͯԌ্ͨ͠ΒͲ͏͠Α͏Θ͔ΔʂʂʂʂʂΘͨ͠ΊͪΌ͜Θ͍ʂʂʂʂ
Ή͠ΖγΣΞ͞Εͨํ͕͍͍ʂ͜ͱ͔Γؒҧͬͨ͜ͱΛॻ͘ͱ൷͞ΕΔΜ͡Όͳ͍͔େͨ͜͠ͱͳ͍ͬͯࢥΘΕͨΒஏ͔͍ͣ͠มʹड͚औΒΕͯԌ্ͨ͠ΒͲ͏͠Α͏ؒҧͬͨ͜ͱΛॻ͘ͱ൷͞ΕΔΜ͡Όͳ͍͔େͨ͜͠ͱͳ͍ͬͯࢥΘΕͨΒஏ͔͍ͣ͠มʹड͚औΒΕͯԌ্ͨ͠ΒͲ͏͠Α͏ؒҧͬͨ··ʹ͓ͯ͘͠ΑΓ͍͍ʂษڧͯ͠·ͨൃ৴Ͱ͖Δ͕ଟ͚Εɺ͖ʹͳͬͯ͘ΕΔͻͱ૿͑ΔʂσβΠφʔͱͯ͠ɺਖ਼͑͘͠Δ࿅शʹͳΔʂ
ϒϩάͱ4/4ͷ͍͍ؔ02
4/4ΛΖ͏ʂͬͯͰͳ͍
ॱ൪ͲͪΒͰ͍͍ϒϩάॻ͍ͨͧʔ5XJUUFSͰ֦ࢄʂ35ʂ35ʂ݁ߏಡ·ΕͯΔهࣄॻ͜͏ϒϩάهࣄΛॻ͍ͯ4/4͔Β༠ಋ 4/4ͷԠΛݟͯϒϩάهࣄΛॻ͘1 2
ඈͿ ඈͿಡΉ͓͠Ζཱ͍ͬͨײಈͨ͠4/4λΠϜϥΠϯ 4/4λΠϜϥΠϯ4/4λΠϜϥΠϯϒϩάϝσΟΞهࣄ͓͠Ζཱ͍ͬͨײಈͨ͠4/4͔Βϒϩάʹ༠ಋ4/4ʹίϯςϯπΛࡌͤΔίϯςϯπίϯςϯπ ίϯςϯπγΣΞ35γΣΞͷϋʔυϧ͕͍
17 48 150 2594/4γΣΞʹͻͱख͔͚ؒͯΈΔ
4/4ͱϒϩάผ͍·ฉ͍ͯཉ͍͠ʂਓ͕ଟ͍ͱ͜ΖͰͣͬ͢ͱಡΜͰཉ͍͠୳͍͢͠ͱ͜Ζʹஔ͘Ͳͬͪେࣄ
Γ্͕͍ͬͯΔͱ͜Ζʹஔ͍ͯΈΔࣈશظؒσʔλ
4/4༻ը૾41༏ઌॎͰจࣈେ͖͘ 1$Ͱେ͖͍͚ͯͬͨ͘ͲʜεϚϗʹ߹ΘͤͨจࣈαΠζ
ॎॻ͖ͷຊͱྲྀΕ͕ٯະདྷ աڈ ະདྷաڈॎॻ͖ͱ૬ੑѱ͍ʜ
ອըͷྲྀΕٯʹ
ಈըʢεΫϦʔϯΩϟϓνϟʣ͓͢͢Ί
ใൃ৴ͷڧ͍ຯํ03
ʮใʯΛ͍࣋ͬͯΔਓͱʮΘ͔Βͳ͍ʯΛ͍࣋ͬͯΔਓ
ͦͦʮใൃ৴ʯͷʮใʯͬͯͲ͔͜Βʁਓ͔ΒڭΘͬͨΓຊΛಡΜͩΓηϛφʔͰฉ͍ͨΓ
ʮใʯʹ͔ΕΔਓʹͳΖ͏ใ ใใใ ใใ
ͲΜͳਓʹʮใʯΛ͋͛ͨ͘ͳΔʁૉʹฉ͚Δਓڭ͑ͨ͜ͱΛ࣮ߦ͢ΔਓγΣΞ͢Δؾ࣋ͪͷ͋ΔਓใΛ͍࣋ͬͯΔਓ
ਓ͔ΒΒͬͨใΛγΣΞ͢Δใใਆ ̋̋͞Μ͕ڭ͑ͯ͘ΕͨΑʔ
ʮಡΉਓͷ͜ͱΛߟ͑ͯʯͬͯΑ͘ݴ͏͚Ͳํྑ͕͠Ұ൪͍͍ڭ͑ͯ͘ΕΔਓ ಡΉਓΘͨ͠
ใΛγΣΞ͢Δ͚ͩͰใൃ৴ใݩ
ʮΘ͔Βͳ͍ʯใൃ৴ʹͱͬͯๅʂ
୭͕Ή͔͠ॳ৺ऀͰʮΘ͔Βͳ͍ʯ͜ͱΕ͕ͪΠϚίί͜͜ͷ͜ͱ֮͑ͯ·͔͢ʜʁ
࠷ۙฐࣾʹ৽ਓσβΠφʔ͞Μ͕ೖΓ·ͨ͜͠ΕͲ͏ΔΜͰ͔͢ʁ͕͜͜Θ͔Βͳͯ͘
ͦ͏ݴΘΕͯΈΕੲΘ͔Βͳ͔ͬͨͳ͋
ॳ৺ऀ͚ใൃ৴͕Ͱ͖ͨ3,646 1.7ສ 1,375 5,436 144 971 2,011 8,480
ʮΘ͔Βͳ͍ʯʹ͔ΕΔͷɺ͋Γ͕͍ͨ͜ͱΘ͔Βͳ͍Θ͔Βͳ͍Θ͔Βͳ͍Θ͔Βͳ͍Θ͔Βͳ͍Θ͔Βͳ͍
ΒͬͨʮΘ͔Βͳ͍ʯͷ͑Λใൃ৴͢ΔใͳΔ΄Ͳ Θͨ͜͠͏ߟ͑ͯ·ʔ͢Θ͔Βͳ͍
ݟ͑Δͱ͜ΖͰ͑ͨΒɺ୭͔ͷͨΊʹͳΔ͔
ʓʓ͔ͩΒͰ͖ͳ͍ʜʁ04
͍͔͠Βใൃ৴Ͱ͖ͳ͍
σβΠϯϑΝΠϧͷʹ࡞ͬͯΩϟϓνϟ͢Δۀͷ߹ؒʹύοͱ࡞ΕΔͷ͔Β࢝ΊΑ͏͋Εͬ͜Μͳػೳ͋ͬͨΜͩʙͰͰ͖Δؾ͖ ࡞Δ ൃ৴
͔ͬ͠Γ࡞Δͷࣄͱͯ͠औΓΉ࡞ྫΛ࡞Δͷ͕ҙ֎ͱ͔͔࣌ؒΔࣾڞ༗ࢿྉͱͯ͠ॻ੶ηϛφʔʹྲྀ༻Ͱ͖Δ
֮͑ͯΒ͏ʮΩϟϥ͚ʯେࣄ͍͍ͭΔΩϟϥ ͍ͭ͏৭ ͍ͭ͏ϑΥϯτलӳؙΰ
डୗͷࣄ͔ͩΒσβΠϯΛެ։Ͱ͖ͳ͍
ςʔϚͷ͋Δ՝ʹऔΓΜͰΈΔϩ ΰϚʔΫื ूకΊΓɿ
ྫ͑ɺʮ."9$)"--&/(&ʯΫϦΤΠςΟϒίϯςετIUUQTCMPHTBEPCFDPNKBQBODDHFOFSBMBEPCFNBYKBQBONBYDIBMMFOHF
ΫϦΤΠςΟϒๅ୳͠ɺଞͷਓͷٕ౪͏
·ͱΊ05
ʮ͔ΕΔ͜ͱΛΖ͏ʯͱ͍͏Ͱͳ͍
σβΠφʔͷࣄʮ͑Δ͜ͱʯ
ʮ಄ͷதʹ͋Δʯʮ֎ʹग़͢ʯେ͖͘ҧ͏ߟ͑͜ͱ
ʮͰɺͲ͏ͤͳΒʜʯ͏ҰɺͷੵΈॏͶ
ϑΥϩϫʔʮ͖ͬͯͨ͜ͱͷ݁ՌʯಘΒΕͨͷʮܦݧʯ΄Μͱ͏ʹ͋Γ͕͍ͨͰ͢
͠νϟϯεͷ৲ඌ͕ݱΕͨΒΓ·͢ʂʂʂ
ʮ͡ͿΜͷ࣠ʯΛ࡞Δ͜ͱͦΕΛ৴ͯ͡Β͑ΔؔੑΛ࡞Δ͜ͱϏ γο
ʮΘͨ͠ͷΛฉ͍ͯΒ͑ΔਓʯʹͳΔ
ࠓͷ͓·ͱΊγΣΞ͞ΕΔཧ༝ͨ͘͞Μ͍͍͋ͬͯϒϩάͱ4/4૬ޮՌ͕ૂ͑ΔεϚʔτϑΥϯΛߟ͑ͨը૾࡞ΛಡΉਓ͚ͩ͡Όͳ͍ɺࡾํΑ͠Λࢦͦ͏ʮ͜ͷਓ͔ͩΒʯͱݴΘΕΔ͡ͿΜͷ࣠Λ࣋ͱ͏