メドレー開発部TechLunchで発表した内容を掲載しました。
メドレーで開発部では、隔週で社内勉強会が開かれています。 今回は、「CLINICS DLS - 凡事徹底デザイン言語システムのご紹介 -」というタイトルで、DLSの導入によりUIの基盤をつくることで、開発におけるコミュニケーションの質を高めた取り組みについて発表しました。 発表者:前田 邦織
ຌࣄపఈσβΠϯݴޠγεςϜͷ͝հCLINICS DLS.FEMFZ *OD,VOJPSJ.BFEB!+VOF
View Slide
CLINICS DLSࣗݾհϚΤμΫχΦϦσβΠϯ'ྟػԠมϚϯ#008:ώϜϩοΫ.49ΞΠϧτϯɾηφߏཁૉͷࡀَ݄ՇਓͷࢠͲϏʔϧABOUT DLS
%-4ͱCLINICS DLS ABOUT DLS
Design Language SystemCLINICS DLS ABOUT DLS
σβΠϯݴޠΛىͱͨ͠ɺڞ௨ೝ͕ࣝͯΔ6*ઃܭͷߏஙCLINICS DLS ABOUT DLSDesign Language System
CLINICS DLS ABOUT DLS"JSCOCͰɺ%FTJHO-BOHVBHF4ZTUFNͱ͍͏ͷΛӡ༻͍ͯ͠Δͱ͍͏ͷΛΔ͜Μͳײ͡ͷσβΠϯΨΠυϥΠϯతͳͷairbnbసࡌɿ
8IZ6TF%-4σβΠϯγεςϜ͕ඞཁͳཧ༝CLINICS DLS ABOUT DLS
CLINICS DLS ABOUT DLS$-*/*$4σόΠεͰల։8FC J04 "OESPJE
8FC J04 "OESPJE͜Ε·Ͱͷ՝CLINICS DLS ABOUT DLS ಉҰαʔϏεͰ͋Γͳ͕ΒɺσόΠεຖͷ6*ʹ͕ࠩੜ͍ͯ͡Δɻ ୲ΤϯδχΞຖʹ6*ͷղऍ͕ҧ͏ɻ σβΠϯ͕ఆ·ͬͯͳ͍ͨΊɺ࣮ޙͷखΓ͕ੜ͍ͯͨ͡ɻ
CLINICS DLS ABOUT DLS6*ύʔπΛཧ্ͨ͠Ͱɺػೳ࣮͍ͨ͠ɻཧ͢ΔͨΊͷσβΠϯΛ͍ͨ͠ɻ1IPUPCZ্࢙࠷ඒ͍͠ΫʔϖQFVHFPUDPVQF
CLINICS DLS ABOUT DLS"JSCOCͰɺ%FTJHO-BOHVBHF4ZTUFNͱ͍͏ͷΛӡ༻͍ͯ͠Δͱ͍͏ͷΛΔΓɺ͜ΕΛͭ͘Δ͔͠ͳ͍airbnbసࡌɿ
CLINICS DLS ABOUT DLS͔͠͠ɺલాσβΠφʔ͚ͩͲσβΠϯΨΠυϥΠϯ͖ͯͳͷ͕ݏ͍Ͱ͢ɻ
CLINICS DLS ABOUT DLS୯ʹσβΠϯΨΠυϥΠϯΛ࡞Δ͚ͩͩͱͦͷޙͷӡ༻Ͱ׆༻͞Εͨࢼ͕͠ͳ͍͔ΒͳͥͳΒʢϚΤμͷ߹ʣ
CLINICS DLS ABOUT DLSAirbnbͷ։ൃऀͨͪɺͲͷΑ͏ʹӡ༻͍ͯ͠Δͷ͔….
CLINICS DLS ABOUT DLSσβΠϯݴޠɺଞͷݴޠͱಉ༷Ͱ͢ɻσβΠϯݴޠΛڞ༗͠ɺͦΕΛ༻͢Δͯ͢ͷਓ͕ཧղͰ͖ͳ͍߹ɺޡղ͕ੜ͡·͢ɻ
CLINICS DLS ABOUT DLSσβΠϯݴޠͱίʔυ͠͠ڞ༗͞ΕΔͨΊɺ΄΅ಉ࣌ʹɺͯ͢ͷωΠςΟϒϓϥοτϑΥʔϜͰػೳΛߏஙͯ͠ϦϦʔε͢Δ͜ͱ͕Ͱ͖·͢ɻϓϩμΫτΤϯδχΞϏϡʔίʔυͰͳ͘ػೳϩδοΫͷ࡞ʹઐ೦Ͱ͖ΔͨΊɺ։ൃҰൠతʹߴͰ͢ɻ ͞ΒʹɺΤϯδχΞͱઃܭऀڞ௨ݴޠΛڞ༗͠·͢ɻσβΠφʔγεςϜʹڵฃ͍ͯ͠·ͨ͠ɻ ͜ΕʹΑΓɺύσΟϯάɺΧϥʔɺλΠϓͷબͰͳ͘ɺσβΠϯͷ࣮ࡍͷίϯηϓτܦݧʹযΛͯͨϨϏϡʔ͕ՄೳʹͳΓ·͢ɻ DLSϏδϡΞϧελΠϧΛڞ༗͠ɺ୯ҰͷγεςϜͷߩݙΛ߹ཧԽ͠·͢ɻ ͜ͷγεςϜʹΑΓɺࢲͨͪશһ͕ΞΠσΞͷϓϩτλΠϓԽ࣮ݧΛૉૣ͘ίετͰߴਫ਼Ͱߦ͑ΔΑ͏ʹͳΓ·͢ɻࢲɺ͜ΕΒͷγεςϜΛࢧԉͯ͠ɺࢲ͕ͨͪকདྷతʹ࡞Γ͍࣮ͨࡍͷϢʔβʔΤΫεϖϦΤϯείϯηϓτʹͬͱूதͰ͖Δͱ৴͍ͯ͡·͢ɻ
CLINICS DLS ABOUT DLSͪΌΜͱ੍Λͭ͘Γɺܧଓతʹӡ༻͞ΕΔͷɻ%-4Λىͱͯ͠6*͕ߏங͞ΕΔঢ়ଶ
CLINICS DLS ABOUT DLSσβΠϯΨΠυϥΠϯYγεςϜ࣮ͷίϯϙʔωϯτઃܭDesign x Technology
CLINICS DLS ABOUT DLS"OESPJE
CLINICS DLS ABOUT DLSJ04
CLINICS DLS ABOUT DLSҰίϯϙʔωϯτઃܭΛͯ͠͠·͑ɺύοσΟϯάΧϥʔɺجຊϨΠΞτߟ͑ͳͯ͘%-4ʹैͬͨσβΠϯ͕ߏங͞ΕΔ
CLINICS DLS ABOUT DLSͳʹΛࢦ͔ͨ͠ͱ͍͏ͱɻ
CLINICS DLS ABOUT DLSσβΠϯϧʔϧͷࡦఆ
CLINICS DLS ABOUT DLSσβΠϯϧʔϧͷࡦఆͰͳ͘
CLINICS DLS ABOUT DLSσβΠϯΛߟ͑Δ࣌ؒΛݮΒͯ͠Ұ؏࣭ͨ͠Λ୲อ͠ɺػೳ࣮͕εϐʔσΟʹߦ͑Δঢ়ଶʹ͢Δ
CLINICS DLS ABOUT DLS݁Ռͱͯ͠ɺαʔϏεͷ69ΛߴΊΔ͜ͱʹྗͰ͖Δ
CLINICS DLS ABOUT DLS%-4ར༻ऀʹΠϯλϏϡʔͯ͠Έ·ͨ͠ɻ
CLINICS DLS ABOUT DLS࣮࣌ʹؾΛ͚ͭͨɾશը໘ͷॻ͖͑Λ͠ͳͯ͘ͳΒͳ͍ͷͰɺͦ͜ΒΜΛؾΛ͚ͭͨɻDLS͍ͬͯ͏Θ͚͡Όͳ͍͚ͲɻಋೖલޙͰҙ͕ࣝมΘͬͨͳͲ͋Δ͔ɻɾͦͦϧʔϧ͕ͭ͘ΒΕͯͳ͔͔ͬͨΒɺσβΠϯϑΝΠϧݟͳͯ͘UIΈཱͯΒΕΔͷͰɺ࡞ۀޮ͕Α͘ͳͬͨɻɾ৽͍͠ը໘͍··ͰͷύʔπΛྲྀ༻͔ͯͭ͑͠ΔɻɾWEBͱ͔͜͏͍͏ͷ͕Ͱ͖ͨͷ͕ɺ͋ͨΓ·͑ͩͬͨͷͰͨΓલͳঢ়ଶʹͳͬͨ͜ͱ͕Α͔ͬͨɻɾωΠςΟϰͬͯҙຯͰ͍͏ͱɺωΠςΟϒͬͯҙຯͰ͍͏ͱʢͳ͔ͥ̎ݴ͏ʣOSಠࣗͷUIͷ֓೦ͷҧ͍͋ΔͷͰɺɹͦΕΛؚΊͨڞ௨ೝ͕ࣝͰ͖Δͱͬͱ͍͍͔ͳͬͯײ͔͡ͳʁwebʹੜ͖Δͱ͍͍ΑͶɻಋೖͯ͠Α͔ͬͨɾ͕ࠩͳ͘ͳͬͨɻAndroidͱiOSͷUIύʔπͷ͕ࠩͳ͘ͳͬͨͷɺΑ͔ͬͨɻɾϝΠϯͷύʔπͷ͕ࠩͳ͘ͳͬͨ͜ͱͰɺΛ͘͢͠ͳͬͨɻڞ௨ೝࣝͪ͘͢ͳͬͨɻAndroid Engineer
CLINICS DLS ABOUT DLS࣮࣌ʹؾΛ͚ͭͨɾCLASS໊Λ͋ͯΔ͚ͩͰɺStoryboardͰUIύʔπΛ֬ೝͰ͖ΔΑ͏ʹ࣮ͨ͠ɻɾϚʔδϯͳͲͷϧʔϧɺύʔπ୯ҐͰ࣋ͨͤΔ͜ͱʹΑΓɺύʔπͷΈ߹Θ͚ͤͩͰͦΕͳΓʹϨΠΞτ͕ΊΔঢ়ଶʹͳͬͨɻಋೖલޙͰҙ͕ࣝมΘͬͨͳͲ͋Δ͔ɻɾσβΠϯ෦ʹ͍ͭͯɺߟ͑Δඞཁ͕ͳ͘ͳͬͨɻɾͱ͘ʹϚʔδϯͱ͔ɺ͜Ε·ͰݸผͰߟ͑ͯͨͷ͕ɺDLSͷج४ʹ͕ͨ͠͏͜ͱͰɺޮతʹͳͬͨɻಋೖͯ͠Α͔ͬͨɾύʔπԽͨ͜͠ͱͰɺ࣮ࣗମޮ͖ͯʹͳͬͨɻɾࣅͨΑ͏ͳը໘ͯ͢ݸผʹͭͬͯͨ͘ͷͰɺҰՕॴ͔͑ͨΒશ෦ม͑ΒΕΔΑ͏ʹͳͬͨͷྑ͔ͬͨɻiOS Engineer
8FC J04 "OESPJE%-4࣮ޙCLINICS DLS ABOUT DLS σόΠεຖͷ6*ͷࠩΛͳͤͨ͘ɻ ୲ΤϯδχΞಉ࢜Ͱίϛϡχέʔγϣϯ͕׆ൃʹͳΓɺ6*ઃܭʹ͓͍ͯڞ௨ೝࣝΛ࣋ͯΔΑ͏ʹͳͬͨɻ σβΠϯ͕ఆ·Γɺ࣮ޙͷखΓ͕ܹݮͨ͠ɻ
CLINICS DLS ABOUT DLSσβΠϯݴޠͱɺ·͞ʹσβΠϯΛ௨ͯ͡ίϛϡχέʔγϣϯ͕औΕΔͦΜͳૉఢͳγεςϜͰͨ͠ɻ