Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
開発初期からはじめるスタイルガイド
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
m-yoshiro
September 22, 2017
Design
700
3
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
開発初期からはじめるスタイルガイド
社内イベント `Designer's MTG #1 「失敗事例・成功事例」` で発表した資料です。
m-yoshiro
September 22, 2017
More Decks by m-yoshiro
See All by m-yoshiro
雑に出してみるデザイントークン適用率
myoshiro
0
200
デザイントークンの適用率計測とその活用
myoshiro
0
1.2k
画像の減色処理とOctree
myoshiro
1
460
CSS Houdiniであそぶ
myoshiro
0
210
Template Literal Typesであそぶ
myoshiro
1
210
Selector-2-regexp というツールを作った
myoshiro
0
260
わたしたちのコーディングのUX
myoshiro
1
320
Data Studio Community Visualizationを触ってみた
myoshiro
1
610
UIデザインと関わろう
myoshiro
0
570
Other Decks in Design
See All in Design
UI/UX & Web Design Portfolio 2025|Madoka Kumagai
madoka_portfolio
4
250
kintone開発におけるライターの役割の変化〜AI活用を添えて〜 / Changes in the Role of Writers in Kintone Development
keroyama
0
100
AI時代、デザイナーの価値はどこに?
tararira
2
1.5k
なぜ、インサイトを貯めるのか?
tajima_kaho
2
2.1k
Connpass-Xperia_Camera_App_by_HCD.pdf
sony
1
660
「バイブコーディングって何?」から始まった、 AIとの一年間と、その先のこと
seto
0
590
decksh object reference
ajstarks
2
1.7k
AIでデザインをつくる:基礎編
kenichiota0711
4
3.2k
結びながら、ひらく - にじむ境界のデザイン
hilokifigma
4
1.7k
ISO 9241-171:2025っていうのがあってな
shosira
1
190
hicard_credential_202601
hicard
0
250
AIスライドデザインを生成する仕組みを社内共有する
kenichiota0711
7
5.6k
Featured
See All Featured
Neural Spatial Audio Processing for Sound Field Analysis and Control
skoyamalab
0
330
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
162
16k
How to Ace a Technical Interview
jacobian
281
24k
Code Review Best Practice
trishagee
74
20k
The agentic SEO stack - context over prompts
schlessera
0
810
Avoiding the “Bad Training, Faster” Trap in the Age of AI
tmiket
0
170
The AI Revolution Will Not Be Monopolized: How open-source beats economies of scale, even for LLMs
inesmontani
PRO
3
3.5k
Why Your Marketing Sucks and What You Can Do About It - Sophie Logan
marketingsoph
0
170
jQuery: Nuts, Bolts and Bling
dougneiner
66
8.5k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
133
19k
Large-scale JavaScript Application Architecture
addyosmani
515
110k
The Impact of AI in SEO - AI Overviews June 2024 Edition
aleyda
5
1.1k
Transcript
։ൃॳظ͔Β͡ΊΔ ελΠϧΨΠυ 1 ϗεςΟϯάࣄۀ෦σβΠφʔদຊ๕
2 দຊ๕ !CFOOLZPVHJSBJ d
ϜʔϜʔυϝΠϯʂΧʔτԽʂ wυϝΠϯൢചͷ ฮαΠτ wຊ/P
͓ͷ༰ ΧʔτԽͰͷಋೖͷ ϦϦʔεޙͷධՁͷ 4 ελΠϧΨΠυʹ·ͭΘΔ
ຊʹೖΔલʹ 5
ελΠϧΨΠυͱ ৭λΠϙάϥϑΟ σβΠϯϧʔϧͷఆٛ 6 σβΠϯɾઃܭͷҰ؏ੑΛอͭͨΊʹඞཁ 6*ɾίϯϙʔωϯτͷ σβΠϯύλʔϯҰཡ IUUQVYNBJMDIJNQDPNQBUUFSOTGPSNT IUUQTXXXMJHIUOJOHEFTJHOTZTUFNDPNHVJEFMJOFTUZQPHSBQIZ
ࠓճͷϙΠϯτ ࠓ·ͰɺϦϦʔεޙʹߏங͞ΕΔ͜ͱ͕ଟ͍ҹɻ ࠓճ ։ൃॳظ͔Βߏஙʂ 7 ʮελΠϧΨΠυͷߏஙλΠϛϯάʂʯ
ΧʔτԽͰͷಋೖͷ 8
ΧʔτԽϓϩδΣΫτ
w υϝΠϯΛෳߪೖͰ͖ΔΧʔ τػೳͷ։ൃ w ڥ͕ͭʹ͔ΕͯΔ w Χʔτػೳ3BJMT w طଘαΠτ1)1 ΧʔτԽϓϩδΣΫτ
ελΠϧΨΠυಋೖͷཧ༝ w $44ઃܭͷจԽΛ͔ࠜͤΔ w ػೳՃ͕සൟͳαʔϏεɻΤϯδχΞ͕ϑϩϯτ࣮ Ͱ͖ͨ΄͏͕ྑ͍ w υϝΠϯͷߪೖϑϩʔෳࡶɻॳظʹઃܭ͠ͳ͍ͱഁ͠ ͦ͏ɻ w
։ൃऀؒͷίϛϡχέʔγϣϯπʔϧͱͯ͠ظͯͨ͠ 11
ελΠϧΨΠυͷπʔϧબఆ 12
ελΠϧΨΠυͷπʔϧબఆ ಋೖ͍͢͜͠ͱ ૄ݁߹Ͱ͋Δ͜ͱ ͙͢ʹࣺͯΕΔ͜ͱ 13 ̏ͭͷબఆج४
'SBDUBM 14 IUUQGSBDUBMCVJME ಋೖ͍͢͜͠ͱ ૄ݁߹Ͱ͋Δ͜ͱ ͙͢ʹࣺͯΕΔ͜ͱ
15
ߏ w 3BJMTͷTBTTΛ͏ͨΊʹ(VMQͰUBTLΜͩ 16 3BJMT 'SBDUBM 4UZMFHVJEF (VMQ TBTT $44
(VMQͰελΠϧΨΠυΛىಈ͢Δͱ 3BJMTͷTBTT͔Β$44ΛCVJME
ఔ 17 σβΠϯ ϑϩϯτΤϯυ ελΠϧΨΠυ ϫΠϠʔɾϓϩτλΠϓ ڥߏஙɾ४උ ɾ$44ͷϕʔεઃܭߏங ɾίϯϙʔωϯτҰཡγʔτΛ࡞
ɾίϯϙʔωϯτ։ൃ Ͱ͖Δͱ͜ σβΠϯ σβΠϯͷөணख ɾΧϥʔɾλΠϙάϥϑܾఆ ɾίϯϙʔωϯτσβΠϯ ϖʔδσβΠϯ ֤ϖʔδͷαϯϓϧ࡞ 3BJMTө
18 ίϯϙʔωϯτͷΈ߹ΘͤελΠϧΨΠυͰઌʹ࡞
19 খ͍͞ίϯϙʔωϯτ͔Β େ͖ͳߏ
༨ஊ 20 ίϯϙʔωϯτҰཡγʔτΛ࠷ॳʹ࡞͢ΔͷΦεεϝ ݟੵΓ͍͢͠ λεΫͷࡉԽ શମײͷѲ ίϯϙʔωϯτઃܭͷԼॻ͖
21 ภࣥڰͷ͝ͱ͘ɺίϯϙʔωϯτΛϦετΞοϓ
22 ແࣄϦϦʔεʂʂ
ϦϦʔεޙͷධՁͷ 23
Α͔ͬͨ͜ͱ 24
σβΠφʔͱΤϯδχΞͷ ίϯϑϦΫτݮ 25 ! " ελΠϧΨΠυͰ ίʔσΟϯάʂ 3BJMTͰػೳ։ൃ ʹूதʂ ྫ͑ϩάΠϯը໘
όοΫͱϑϩϯτͷ։ൃڥ͕͔ΕͯΔͷͰόοςΟϯ ά͕ͳ͔ͬͨ
։ൃʹूதͰ͖Δ w ϓϩμΫτͷ༷ͷ੍ݶΛड͚ͣදࣔ֬ೝͰ͖Δ ྫ ϩάΠϯɺߪೖϑϩʔͳͲखଓ͖͕ඞཁͳը໘ 26 ! " ࡞ۀ͍ͨ͠ϖʔδΛ ͙͢ΈΕΔʂ
ϑΥϩʔ͕ݮͬͯ ։ൃʹूதͰ͖Δʂ
ϨϏϡΞʔબͼ͍͢ w ͜ΕΤϯδχΞʁσβΠφʔʁͱ͍͏໎͍͕ݮͬͨ w ڥ͕λεΫͷࡉԽΛଅ͢ϨϏϡʔϙΠϯτ͕໌֬ʹ ͳΔ 27 ! " ελΠϧΨΠυ্ͷߋ৽͔ͩΒ
σβΠφʹϨϏϡʔґཔ ػೳ։ൃ͕ϝΠϯ͔ͩΒ ΤϯδχΞʹϨϏϡʔґཔ
ίϛϡχέʔγϣϯऔΓ͔ͬͨ͢ w ٙ՝ΛελΠϧΨΠυΛΈͳ͕Β֬ೝͰ͖ͨ w Έͳ͕ΒΓͱΓ͢Δ͜ͱͰղܾ·Ͱ͕εϜʔζ 28 ! " ! !
" ςΩετϑΥʔϜͲ͜ʹ͓͘ͷʁ ͜͜Ͳ͏͢Δʁ
ஃͷσβΠϯमਖ਼ɾมߋʹରԠ ͔ͬͨ͢͠ w मਖ਼ରΛ͕͍͢͞͠ɻ w ίϯϙʔωϯτؒͷؔ࿈͕Έ͍͑͢ w मਖ਼ͷࡍʹదͳஅΛߦ͑ͨʢ͠ͷ͗͡Όͳ͍ରԠʣ 29 "
Ұ෦༷ΛΜΰϗΰϗʂ ͋ͷϘλϯϑΥʔϜͱϞʔμϧͰ ΘΕͯΔ͔Β ৽͘͠Ճ͠Α͏ʂ
30 ͜ͷؔੑͱ΄΅શͯͷΈ߹ΘͤΛ ၆ᛌͯ͠ΈΕΔ
ઃܭΛ่ͣ͞ϦϦʔεͰ͖ͨ w ஃͰ͖ͪΜͱରԠͰ͖ͨͷͰɺϦϦʔε࣌ઃܭ͕ ่Εͳ͔ͬͨʢ·ͬͨ͘Ͱͳ͍͚Ͳɻɻʣ 31 ! "
Α͔ͬͨ͜ͱ·ͱΊ 32 σβΠφʔͱ ΤϯδχΞͷ ίϯϑϦΫτݮ ։ൃʹूதͰ͖Δ ϨϏϡΞʔ બͼ͍͢ ίϛϡχέʔγϣϯ औΓ͔ͬͨ͢
ஃͷσβΠϯ मਖ਼ɾมߋʹ ରԠ͔ͬͨ͢͠ ઃܭΛ่ͣ͞ ϦϦʔεͰ͖ͨ
Α͔ͬͨ͜ͱ·ͱΊ 33 σβΠφʔͱ ΤϯδχΞͷ ίϯϑϦΫτݮ ։ൃʹूதͰ͖Δ ϨϏϡΞʔ બͼ͍͢ ίϛϡχέʔγϣϯ औΓ͔ͬͨ͢
ஃͷσβΠϯ मਖ਼ɾมߋʹ ରԠ͔ͬͨ͢͠ ઃܭΛ่ͣ͞ ϦϦʔεͰ͖ͨ ޮ্͕͕Δʂ ίϛϡχέʔγϣϯ ͕औΓ͍͢ ։ൃͷஃͰ ཧੑΛอͯΔʂ
՝ 34
՝ w ։ൃڥͰ͔͠ӾཡͰ͖ͳ͍ w ίϯϙʔωϯτͷॴΛ֮͑ͮΒ͍ w ຊՈͱ3BJMT͕ผڥͳͷͰελΠϧΨΠυ͕࿈ܞͰ͖ͳ͍ w TMJNͷม͕ඞཁ w
ελΠϧΨΠυͷ࡞Γ͕ଐਓԽͪ͠Όͬͨɻɻ 35 w ίετͱརӹͷόϥϯε
ίετͱརӹͷόϥϯε w ಋೖʹࡍͯ͠Ұ൪ͷ՝͔ w ࠓޙͷӡ༻Ͱ༗ޮੑΛࣔͤΔΑ͏ʹ͠ͳ͖Ό͍͚ͳ͍ 36
ελΠϧΨΠυΛॳظಋೖͯ͠Έͯ w ελΠϧΨΠυىͷ։ൃָ͕νϯʂ w ࠷ॳʹελΠϧΨΠυͰ࡞ΔΫη͕͍ͭͨ 37
ࢦ͢ελΠϧΨΠυʰυϦϒϯʱʂ 38 ελΠϧΨΠυ͕ϑϩϯτ։ൃͷىͱͳΔ
·ͱΊ w։ൃͷޮΞοϓʂ wίϛϡχέʔγϣϯʹ͑Δʁ wϦϦʔεͷஃʹڧ͍ʂ wελΠϧΨΠυΛ͏จԽ͕͖͍ࠜ͢ 39 ։ൃॳظ͔Βಋೖ͢Δͱʜ
·ͣؾܰʹ࢝ΊͯΈΔͱྑ͛͞ 40