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
m-yoshiro
September 22, 2017
Design
3
650
開発初期からはじめるスタイルガイド
社内イベント `Designer's MTG #1 「失敗事例・成功事例」` で発表した資料です。
m-yoshiro
September 22, 2017
Tweet
Share
More Decks by m-yoshiro
See All by m-yoshiro
雑に出してみるデザイントークン適用率
myoshiro
0
160
デザイントークンの適用率計測とその活用
myoshiro
0
1.1k
画像の減色処理とOctree
myoshiro
1
350
CSS Houdiniであそぶ
myoshiro
0
170
Template Literal Typesであそぶ
myoshiro
1
200
Selector-2-regexp というツールを作った
myoshiro
0
250
わたしたちのコーディングのUX
myoshiro
1
300
Data Studio Community Visualizationを触ってみた
myoshiro
1
570
UIデザインと関わろう
myoshiro
0
540
Other Decks in Design
See All in Design
Yumika Yamada Portfolio
yumii
0
870
#Dubois Challenge 2025: Economics
ajstarks
0
140
Storyboard Honey
rocioparronrubio
0
290
生成AIを活用した組み込みSW設計書検索システム開発
licux
7
1.2k
事例で学ぶ!今日から使えるWebサービスUI改善ポイント
ncdc
0
180
RAKSUL_DESIGN_DECK_20250319
raksulrecruiting
0
410
1920*1080pxに設定したケース / Google Slide Size Test
arthur1
0
3k
【30人中30人が3ヶ月平均180万収入アップ】マズロー安達の弟子、成功事例集
maslow_akkun
0
160
Flow, Not Stock 知識触媒としてのIA
5kaichi
1
300
バイアスを凌ぐデザインとコード ―異動直後にどうふるまうか―
kkaru
0
470
[2025.6.30 もがく中堅デザイナー、キャリアの分岐点] なんでもやる系デザイナーのもがきかた
taka_piya
1
1.4k
エンジニアでも捗る デザイナー的思考入門
tinykitten
PRO
1
1.1k
Featured
See All Featured
The Cost Of JavaScript in 2023
addyosmani
51
8.6k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
50k
Art, The Web, and Tiny UX
lynnandtonic
299
21k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
8
340
Raft: Consensus for Rubyists
vanstee
140
7k
How to Ace a Technical Interview
jacobian
278
23k
Building Better People: How to give real-time feedback that sticks.
wjessup
367
19k
Product Roadmaps are Hard
iamctodd
PRO
54
11k
Automating Front-end Workflow
addyosmani
1370
200k
A Modern Web Designer's Workflow
chriscoyier
695
190k
The Invisible Side of Design
smashingmag
301
51k
[RailsConf 2023] Rails as a piece of cake
palkan
55
5.7k
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