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.
→
Pちゃん
November 09, 2015
Design
950
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
エンジニアのためのデザインの話
BKDC vol.1
Pちゃん
November 09, 2015
More Decks by Pちゃん
See All by Pちゃん
API になろう / Let's become an API
p1ch_jp
0
3.7k
天下一 Dev Server 武道会 / World Dev Server Tournament
p1ch_jp
2
1k
この先生きのこるためのPostCSS実践入門
p1ch_jp
1
1.6k
Other Decks in Design
See All in Design
つくり方を変えていく | change-how-we-build
mottox2
2
1.4k
いいUIとは?初心者向けに事例をもとにUIデザインを分解
yuichi_hara7
9
4.2k
少人数チームで_使われるプロダクトにたどり着くための_デザインハーネス.pdf
nishame
1
1.4k
設計と制作 意図を形に表す / Design and Making: Intent Made Form
usagimaru
3
2.1k
AIスライド生成を進化させるMDファイル
kenichiota0711
1
1.7k
AVI 2026 Keynote "Vision-Driven Design"
ishii_mit
0
130
デザインとフロントエンドの境界が融ける Claude Code × Figma
littlebusters
2
3.5k
富山デザイン勉強会_ブラッシュアップデザイン.pdf
keita_yoshikawa
0
120
Kouseki | CREATIVE CLASS成果物
yuri9911
0
150
Accelerating performance improvement based on a software review evaluation matrix
kitanosirokuma
0
290
もっともらしさ生成器と暮らす – AI懐疑派の試行錯誤
sekiguchiy
0
150
Design dependencies
teba_eleven
0
160
Featured
See All Featured
Build The Right Thing And Hit Your Dates
maggiecrowley
39
3.4k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
49
10k
Designing Powerful Visuals for Engaging Learning
tmiket
1
530
The Organizational Zoo: Understanding Human Behavior Agility Through Metaphoric Constructive Conversations (based on the works of Arthur Shelley, Ph.D)
kimpetersen
PRO
0
430
Building an army of robots
kneath
306
46k
Ten Tips & Tricks for a 🌱 transition
stuffmc
0
180
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
21
1.6k
Leadership Guide Workshop - DevTernity 2021
reverentgeek
1
360
JAMstack: Web Apps at Ludicrous Speed - All Things Open 2022
reverentgeek
1
590
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
17k
Google's AI Overviews - The New Search
badams
0
1.6k
Measuring Dark Social's Impact On Conversion and Attribution
stephenakadiri
2
270
Transcript
ΤϯδχΞͷͨΊͷ σβΠϯͷ 1ͪΌΜ IUUQQDIKQ!QDI@KQ
1ͪΌΜJT୭ 1ͪΌΜɺͨͩͷίʔμʔɻ ݝཱ͓͖ͩΕ͍͖Ε͍େֶͷҰճੜɻ
աڈʹ͜Μͳ͜ͱͬͯ·ͨ͠ ੲσβΠφʔΛࢦͯͨ͠ɻ த͔Βߴʹ͔͚ͯҹܥσβΠϯࣄॴͰमߦɻ ߴͰํసͯ͠ΤϯδχΞΛࢤ͢ɻ ߴ͔Β8FC੍࡞ձࣾͰΞϧόΠτɻ ͦΜͳ͜ΜͳͰɺ ͦ͜ΒลͷେֶੜΑΓ͔σβΠϯ͔Δɻ ؾ͕͢Δɻ
͜͏͍͏ͷΛͳ͍ͨ͘͠ʂͱࢥͬͯདྷ·ͨ͠ɻ ΤϯδχΞʮԶηϯε͕ͳ͍͔ΒσβΠϯͰ͖ͳ͍ɻʯ ΤϯδχΞʮԶֆ͕͔͚ͳ͍͔ΒσβΠϯͰ͖ͳ͍ɻʯ ΤϯδχΞʮԶʹ#PPUTUSBQ͕͋Δɻ͔ͩΒɺେৎɻʯ
σβΠϯJTԿʁ
σβΠϯͱΞʔτͷҧ͍ԿͰ͔͢ʁ
σβΠϯղܾͰ͋Γ ΞʔτࣗݾදݱͰ͋Δ
σβΠϯղܾɺ σβΠϯղܾɻ େࣄͳ͜ͱͳͷͰճݴ͍·ͨ͠ɻ
Զηϯε͕ͳ͍͔ΒσβΠϯͰ͖ͳ͍ɻ ͦΜͳ͜ͱͳ͍Αɺղܾͱ͍͏ҙຯͰ σβΠϯϓϩάϥϛϯάࣅͨΑ͏ͳϞϊ ͦͯ͠ɺղܾ ηϯεײ֮ͰͲ͏ʹ͔ͳΔͷͰͳ͍ɻ
͋͑ͯݴ͓͏ɺ σβΠϯϩδοΫͰ͋Δͱ
ϩδΧϧɺ ނʹ୭ͰͰ͖Δ σβΠφʔηϯε͕͋Δ͔ΒσβΠϯ͕Ͱ͖Δ Θ͚Ͱ͋Γ·ͤΜɻ ϧʔϧΛक͍ͬͯΔ͔Βɺ͍͑ͨใΛ͑Δ ͨΊͷσβΠϯ͕Ͱ͖͍ͯΔͷͰ͢ɻ
σβΠϯͷ جຊ࢛ݪଇ ۙ ྻ ίϯτϥετ ෮
ۙ
ۙͱ
ؔཁૉΛ͚ۙͮ ͦ͏Ͱͳ͍ཁૉΛ͢
ݝཱ͓͖ͩΕ͖Ε͍େֶ ֶ෦հ ηΫγʔσβΠϯֶ෦ ηΫγʔϓϩάϥϛϯάֶ෦ ϠΫβֶ෦ ͓େమͷᎄ ͱʹ͔͘ηΫγʔʹΕ ඞཁҎ্ʹϏϏΔͳ งғؾ࣮ફͰ௫Ί ֶΛݟ͔͚ͨΒԥΕ
ݝཱ͓͖ͩΕ͖Ε͍େֶ ɹֶ෦հ ɹɹηΫγʔσβΠϯֶ෦ ɹɹηΫγʔϓϩάϥϛϯάֶ෦ ɹɹϠΫβֶ෦ ɹ͓େమͷᎄ ɹɹͱʹ͔͘ηΫγʔʹΕ ɹɹඞཁҎ্ʹϏϏΔͳ ɹɹงғؾ࣮ફͰ௫Ί ɹɹֶΛݟ͔͚ͨΒԥΕ
ݝཱ͓͖ͩΕ͖Ε͍େֶ ɹֶ෦հ ɹɹηΫγʔσβΠϯֶ෦ ɹɹηΫγʔϓϩάϥϛϯάֶ෦ ɹɹϠΫβֶ෦ ɹ͓େమͷᎄ ɹɹͱʹ͔͘ηΫγʔʹΕ ɹɹඞཁҎ্ʹϏϏΔͳ ɹɹงғؾ࣮ફͰ௫Ί ɹɹֶΛݟ͔͚ͨΒԥΕ
άϧʔϐϯά
ؔ࿈͢ΔใΛάϧʔϓԽ͢Δ͜ͱͰ ใΛ৫Խ͢Δ͜ͱ͕Ͱ͖Δ
ྻ
ྻͱ
શͯͷཁૉΛҙࣝతʹஔ͢Δ͜ͱ
ཁૉ͕Ε͍ͯͯ ྻ͍ͯ͠Εݟ͑ͳ͍ઢͰ ඥ͚Δ͜ͱ͕Ͱ͖Δ
ݟ͑ͳ͍ઢΛҙࣝ͢Δ ˓ͱ˘Λඥ͚Δ
ใͷ৫ԽΛΑΓڧݻͳͷʹ
ίϯτϥετ
ίϯτϥετͱ
͖ͬΓͨ͠ҧ͍Λग़͢͜ͱͰ ใͷ৫ԽΛࢧԉ͢Δ
ݝཱ͓͖ͩΕ͖Ε͍େֶ ɹֶ෦հ ɹɹηΫγʔσβΠϯֶ෦ ɹɹηΫγʔϓϩάϥϛϯάֶ෦ ɹɹϠΫβֶ෦ ɹ͓େమͷᎄ ɹɹͱʹ͔͘ηΫγʔʹΕ ɹɹඞཁҎ্ʹϏϏΔͳ ɹɹงғؾ࣮ફͰ௫Ί ɹɹֶΛݟ͔͚ͨΒԥΕ
ݝཱ͓͖ͩΕ͖Ε͍େֶ ɹֶ෦հ ɹɹηΫγʔσβΠϯֶ෦ ɹɹηΫγʔϓϩάϥϛϯάֶ෦ ɹɹϠΫβֶ෦ ɹ͓େమͷᎄ ɹɹͱʹ͔͘ηΫγʔʹΕ ɹɹඞཁҎ্ʹϏϏΔͳ ɹɹงғؾ࣮ફͰ௫Ί ɹɹֶΛݟ͔͚ͨΒԥΕ
࣌ʹେʹΕ
དྷͨΕɺ৽ೖੜʂ ݝཱ͓͖ͩΕ͍͖Ε͍େֶͰɺຖ݄ʹͲ ηϯλʔࢼݧʹΑΔબߟΛߦ͍ͬͯ·͢ɻ ͲηϯλʔࢼݧͱɺͲΕ͚ͩηϯλʔʹدΕͨ ͔Ͱֶੜͷ࣮ྗΛఆ͢Δબߟํ๏Ͱ͢ɻ ຖɺ⺧ͷࠩͰଟ͘ͷֶੜ͕ྦΛྲྀ͢ɺඇৗʹ қͷߴ͍બߟͱͳ͓ͬͯΓ·͢ɻ ࢤئऀ֤Ґʹ͓͔Ε·ͯ͠ɺৗࠒ͔Βηϯλʔ ʹدΔֶशΛ৺͕͚͍ͯͩ͘͞ɻ ئॻडظؒd
དྷͨΕɺ৽ೖੜʂ ݝཱ͓͖ͩΕ͍͖Ε͍େֶͰɺຖ݄ʹͲ ηϯλʔࢼݧʹΑΔબߟΛߦ͍ͬͯ·͢ɻ ͲηϯλʔࢼݧͱɺͲΕ͚ͩηϯλʔʹدΕͨ ͔Ͱֶੜͷ࣮ྗΛఆ͢Δબߟํ๏Ͱ͢ɻ ຖɺ⺧ͷࠩͰଟ͘ͷֶੜ͕ྦΛྲྀ͢ɺඇৗʹ қͷߴ͍બߟͱͳ͓ͬͯΓ·͢ɻ ࢤئऀ֤Ґʹ͓͔Ε·ͯ͠ɺৗࠒ͔Βηϯλʔ ʹدΔֶशΛ৺͕͚͍ͯͩ͘͞ɻ ئॻडظؒd
෮
σβΠϯ্ͷԿ͔ͷಛΛ ࡞Λ௨ͯ͠܁Γฦ͢͜ͱ
෮ͱ
࣌ϊοτΛތΔεΫʔϧόεɻӡ ༻࣌ࠁݫकͰࠁΒͣɻ͓େੜ Ͱ͋ΕແྉͰར༻Ͱ͖·͢ɻ ςΟογϡͰ࡞ͬͨ͜ΑΓ͔Βۭ ·ͰԿͰἧ͏ߪങ෦Ͱ͢ɻੜెʹ خ͍͠୯Ґൢച͓ͯ͠Γ·͢ɻ εΫʔϧόε ߪങ෦ʮܹ҆ࡾࠃࢤʯ ෮ͱ
࣌ϊοτΛތΔεΫʔϧόεɻӡ ༻࣌ࠁݫकͰࠁΒͣɻ͓େੜ Ͱ͋ΕແྉͰར༻Ͱ͖·͢ɻ ςΟογϡͰ࡞ͬͨ͜ΑΓ͔Βۭ ·ͰԿͰἧ͏ߪങ෦Ͱ͢ɻੜెʹ خ͍͠୯Ґൢച͓ͯ͠Γ·͢ɻ εΫʔϧόε ߪങ෦ʮܹ҆ࡾࠃࢤʯ ෮ͱ
࣌ϊοτΛތΔεΫʔϧόεɻӡ ༻࣌ࠁݫकͰࠁΒͣɻ͓େੜ Ͱ͋ΕແྉͰར༻Ͱ͖·͢ɻ ςΟογϡͰ࡞ͬͨ͜ΑΓ͔Βۭ ·ͰԿͰἧ͏ߪങ෦Ͱ͢ɻੜెʹ خ͍͠୯Ґൢച͓ͯ͠Γ·͢ɻ εΫʔϧόε ߪങ෦ʮܹ҆ࡾࠃࢤʯ ςΟογϡͰ࡞ͬͨ͜ΑΓ͔Βۭ ·ͰԿͰἧ͏ߪങ෦Ͱ͢ɻੜెʹ
خ͍͠୯Ґൢച͓ͯ͠Γ·͢ɻ εΫʔϧόε ߪങ෦ʮܹ҆ࡾࠃࢤʯ ࣌ϊοτΛތΔεΫʔϧόεɻӡ ༻࣌ࠁݫकͰࠁΒͣɻ͓େੜ Ͱ͋ΕແྉͰར༻Ͱ͖·͢ɻ ෮ͱ
ಉ͡Χλνɾ৭ɾ࣭ײͳͲΛ܁Γฦ͠͏͜ͱͰ σβΠϯʹҰ؏ੑΛ࣋ͨͤΔ͜ͱ͕Ͱ͖Δ
σβΠϯͷ جຊ࢛ݪଇ ۙ ྻ ίϯτϥετ ෮
ৄ͘͠ɺ͜ͷॻ੶Λಡ͏ʂ ΤϯδχΞքͷʮϦʔμϒϧίʔυʯ Έ͍ͨͳॻ੶ͩͧʂ ϊϯσβΠφʔζ σβΠϯϒοΫ
ͨΓલͷ͜ͱ͔͠ॻ͍ͯͳ͍͚Ͳ ΊͬͪΌେࣄɺ࣮ફஈ֊ͰΕ͕ͪ
ͪΖΜɺ͜ͷ࢛ݪଇ͚ͩͰσβΠϯ͕ Ͱ͖ΔΑ͏ʹͳΔΘ͚Ͱͳ͍ɻ
ଞʹɺ৭ɺλΠϙάϥϑΟʔɺ࣭ײʹֶ͍ͭͯͿͱྑ͍ ωΫετεςοϓ Typo ৭ λΠϙάϥϑΟʔ ࣭ײ
࠷దͳσβΠϯͱ࠷దͳΤϯδχΞϦϯά͕͋ͬͯͦ͜ɺ ྑ͍αʔϏεϓϩμΫτ͕ੜ·ΕΔͱ৴ͯ͡Δɻ