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
December 05, 2017
Design
72
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
スタイルガイドを開発に導入した
2017年に作ったスライド。ちょと古いです
m-yoshiro
December 05, 2017
More Decks by m-yoshiro
See All by m-yoshiro
雑に出してみるデザイントークン適用率
myoshiro
0
210
デザイントークンの適用率計測とその活用
myoshiro
0
1.2k
画像の減色処理とOctree
myoshiro
1
490
CSS Houdiniであそぶ
myoshiro
0
220
Template Literal Typesであそぶ
myoshiro
1
220
Selector-2-regexp というツールを作った
myoshiro
0
270
わたしたちのコーディングのUX
myoshiro
1
330
Data Studio Community Visualizationを触ってみた
myoshiro
1
620
UIデザインと関わろう
myoshiro
0
580
Other Decks in Design
See All in Design
いいUIとは?初心者向けに事例をもとにUIデザインを分解
yuichi_hara7
11
5.4k
【CEDEC2026】アートとゲームデザインをつなぐVFX設計『GRANBLUE FANTASY: Relink - Endless Ragnarok』における表現と可読性の両立
cygames
PRO
1
1.2k
(2026 FlowCon Keynote) Sociotechnical Architecture Finding Flow
xinyao
0
120
デザインハーネス 〜AIが生成する"デザイン"の妥当性を、誰がどう担保するのか〜 / PdEConf2026 Design Harness
kgsi
11
19k
decksh object reference
ajstarks
2
1.8k
凡庸を落とすハーネス
hiromimaeo
2
810
「おすすめ」はなぜ信用されないのか - 信頼を築くUI/UX設計
ryu1013
0
250
猫魔法「ごろごろ」の紹介
gesho
0
140
エンジニアでも捗る デザイナー的思考入門(bitA Edit 新ver)
tinykitten
1
470
もう迷わない!“なんとなく”を卒業するフォントの選び方【村田俊英】
toshihidemurata
0
930
The Art of Caring
klemens
0
450
ポートフォリオ_あやの
ngyenmazt1412
0
1.6k
Featured
See All Featured
GitHub's CSS Performance
jonrohan
1033
470k
The Curse of the Amulet
leimatthew05
2
14k
A better future with KSS
kneath
240
18k
The AI Revolution Will Not Be Monopolized: How open-source beats economies of scale, even for LLMs
inesmontani
PRO
3
3.7k
Code Review Best Practice
trishagee
74
20k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
52
6.1k
New Earth Scene 8
popppiees
3
2.5k
Exploring the relationship between traditional SERPs and Gen AI search
raygrieselhuber
PRO
2
4.3k
Designing Powerful Visuals for Engaging Learning
tmiket
1
530
How to Build an AI Search Optimization Roadmap - Criteria and Steps to Take #SEOIRL
aleyda
1
2.2k
The agentic SEO stack - context over prompts
schlessera
0
890
HDC tutorial
michielstock
2
840
Transcript
ελΠϧΨΠυΛ ։ൃʹಋೖͨ͠ ੈքً͖ͩͨ͠ দຊ๕ !CFOOLZPVHJSBJ EFTJHOFS (.0ϖύϘגࣜձࣾϗεςΟϯάࣄۀ෦ϩϦϙοϓʂάϧʔϓ
দຊ๕ !CFOOLZPVHJSBJ d Ͱ͍͟ͳʔ
ίϯςϯπ ͡Ίʹ ελΠϧΨΠυΛͲ͏ಋೖ͔ͨ͠ ӡ༻ͯ͠ΈͯͷධՁ ݁ʮελΠϧΨΠυྑ͍ͷͩʂʯ
͡Ίʹ
͡Ίʹ w ͱ͋ΔϓϩδΣΫτͰελΠϧΨΠυΛಋೖͯ͠Έͨ ܦաใࠂͰ͋Δ w ݱࡏਐߦܗͰઓ͍ଓ͍͍ͯΔ ͡Ίʹ
ελΠϧΨΠυͱ w 6*ύλʔϯΛίϯϙʔωϯτ୯ҐͰཧ͢ΔͨΊͷΈ w σβΠϯσʔλͰͳ͘ɺίʔυͰཧ ৄ͘͠γΧ༷ͷهࣄɺಡΜͰ͐͐ IUUQUFDIQFQBCPDPNQFQBHSBN ͡Ίʹ 6*ύʔπͨͪ
ελΠϧΨΠυಋೖͷഎܠ w ϑϩϯτΤϯυଆʢओʹσβΠφʣͷࠔͬͨΛղফ͢Δͨ Ί w ಉ͡ύʔπΛ࡞ͬͨʂ w σβΠϯ͕όϥόϥʂ w ϩάΠϯ͠ͳ͍ͱදࣔ֬ೝͰ͖ͳ͍ʂʜͳͲͳͲ
w ϑϩϯτͱόοΫͷ։ൃΛԁʹਐΊΔͨΊ ͡Ίʹ IUUQTTQFBLFSEFDLDPNNZPTIJSPBUPNJD EFTJHOUPEF[BJOUPQVSPEBLVUP
ελΠϧΨΠυΛͲ͏ಋೖ͔ͨ͠
ϓϩδΣΫτͷഎܠ w ͱ͋ΔαʔϏεͷ৽ػೳ։ൃ w 3BJMT w ϑϩϯτͱόοΫͷ։ൃΛಉ࣌ʹਐΊΔඞཁ͕͋Δ ελΠϧΨΠυͷಋೖ
πʔϧͷબఆ 'SBDUBM w OPEFKTܥͷελΠϧΨΠυπʔϧ w ؆୯ɾαΫοͱ࢝Ί͍͢ w υΩϡϝϯτཧͰ͖Δ w ελϯυΞϩʔϯʢࣺ͍ͯ͢ʂʂʂʣ
w (VMQͷྗआΓ·ͨ͠ ελΠϧΨΠυͷಋೖ IUUQGSBDUBMCVJME
πʔϧͷબఆ ελΠϧΨΠυͷಋೖ ͜Μͳ ײ͡ ϓϨϏϡʔ υΩϡϝϯτ ίʔυ3&"%.&
ߏ w 3BJMTσΟϨΫτϦͱಉ֊ʹTUZMFHVJEFσΟϨΫτϦΛ ؒआΓɻ w 3BJMTଆͷTDTTΛ4UZMFHVJEFσΟϨΫτϦʹCVJME͔ͨͬ͠ ͨͷͰ(VMQͰλεΫΜͩɻ ελΠϧΨΠυͷಋೖ
ߏ ελΠϧΨΠυͷಋೖ BQQ 3BJMT TUZMFHVJEF (VMQͷλεΫେ͖͚ͯͭ͘ TUZMFHVJEF༻ͷ DTTΛCVJME TUZMFHVJEFΛىಈ TUZMFHVJEF
3BJMTͷTDTT ϑΝΠϧΛऔಘ CVJMEޙͷDTT ελΠϧΨΠυͷ ϑΝΠϧ͚ͩࢹ
ϫʔΫϑϩʔ σβΠϯͰ͖Δ ελΠϧΨΠυ্ͰίʔσΟϯά ελΠϧΨΠυΛݩʹ3BJMTʹө ɹ ΤϯδχΞσβΠφ ελΠϧΨΠυͷಋೖ
ӡ༻ͯ͠ΈͯͷධՁ ݱ࣌Ͱͷ
Α͔ͬͨ͜ͱ ίϯϙʔωϯτཧͷԸܙ w ޮྑ͍ઃܭɾίʔσΟϯά͕ߦ͑ͨ w ҰཡͰ͖ΔͷͰɺਐḿɾෆύʔπΛ֬ೝ͍͢͠ w मਖ਼͍͢͠ʢํܾఆ͕ૣ͍ɾΛݟ͚͍ͭ͢ w ൚༻తͳίϯϙʔωϯτ͕ग़དྷ্͕Δ
ӡ༻ͯ͠ΈͯͷධՁ
Α͔ͬͨ͜ͱ ελϯυΞϩʔϯͷԸܙ w ϓϩμΫτͷ༷ͷ੍Λड͚ͣίʔσΟϯάͰ͖Δ ϩάΠϯ ߪೖϑϩʔ w ελΠϧΨΠυ্Ͱϑϩϯτଆͷςετ͕Ͱ͖Δ ϒϥβνΣοΫ ӡ༻ͯ͠ΈͯͷධՁ
Α͔ͬͨ͜ͱ ϑϩϯτΤϯυͱόοΫΤϯυ w ޓ͍ͷਐḿͷӨڹΛड͚ͣʹ࡞ۀ͘͢͠ͳͬͨ w ίϯϙʔωϯτ໊Λࣔ͘͢͠ͳ͖ͬͯͨ w ελΠϧΨΠυͷ63-໊લͰύʔπΛࣔ͢ɻڞ௨ݴ ޠ͕ੜ·Εͭͭ͋Δʁ ӡ༻ͯ͠ΈͯͷධՁ
ΘΔ͔ͬͨ͜ͱ w πʔϧͷӡ༻ํ๏͕͏·͘ڞ༗Ͱ͖ͯͳ͔ͬͨ w গͣͭͬͯ͠Β͑ΔΑ͏ʹͳ͖ͬͯͨ w ӡ༻ϧʔϧ͕ʑͩͬͨ w πʔϧͷςϯϓϨʔτ͕TMJNʹରԠͯ͠ͳ͍ͷͰΤϯδχ ΞʹखؒΛ͔͚ͯΔ
ӡ༻ͯ͠ΈͯͷධՁ
૯ׅ
ελΠϧΨΠυྑ͍ͷͩʂ
૯ධ w ϑϩϯτΤϯυ։ൃͱ͍͏ͰɺޮΞοϓʂʂ w ࠷ॳେม͚ͩͲίϯϙʔωϯτ͕ἧ͔ͬͯΒͷεϐʔυ ײ͕͍ɻ w มߋ͕ൃੜͯ͠मਖ਼͕༰қɻʢରԠํͷܾఆָʣ ૯ׅ
૯ධ w ল w GSBDUBMͷฤूํ๏ɺυΩϡϝϯτԽͰ͖ͯͳ͍ʜ w ӡ༻ϧʔϧΡʂ w νʔϜͷίϯηϯαεେࣄʹ ૯ׅ
ελΠϧΨΠυͷ ελϯυΞϩʔϯԽ
ελϯυΞϩʔϯ w αʔϏεʹҰͭͷελΠϧΨΠυɺෳϓϩδΣΫτͰར ༻ w ઐ༻ͷϨϙδτϦͰཧ w TVNNPEVMFOQNͰ֤ϓϩδΣΫτʹΠϯετʔϧ w ෳͷϨϙδτϦʹލͬͯҰͭͷελΠϧΨΠυͰҰ؏
ͨ͠σβΠϯཧ͕Մೳɻ ϢʔβʹҰ؏ͨ͠69ΛఏڙͰ͖Δ w ͦ͏ɺσβΠϯγεςϜ
͋Γ͕ͱ͏͍͟͝·ͨ͠ɻ