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.
→
Yutaro Murakami
May 21, 2021
Design
500
1
Share
かたちをつくるとはどういうことなのか?
Yutaro Murakami
May 21, 2021
More Decks by Yutaro Murakami
See All by Yutaro Murakami
ラフとUIデザイン〜UIデザインにおけるラフの使い分けのすゝめ〜
yutaromurakami
2
1.8k
「文脈を理解する」ということについて 考えてみる
yutaromurakami
0
760
欧文WebTypography初級編:基礎知識の学びと実践
yutaromurakami
0
400
ゆめみで実践するOOUI:画面ではなくオブジェクトをとらえる方法
yutaromurakami
2
630
道具的存在なソフトウェアのデザイン
yutaromurakami
1
2.4k
Other Decks in Design
See All in Design
公開スライド)熊本市様-電子申請中級編
garyuten
0
1.3k
PAMPHLET.pdf
mhand01
0
130
情報を翻訳する-伝わる可視化3原則とオープンデータ活用-
hjmkth
1
260
Spacemarket Brand Guide
spacemarket
2
860
root COMPANY DECK / We are hiring!
root_recruit
3
28k
Accelerating performance improvement based on a software review evaluation matrix
kitanosirokuma
0
240
タイル紹介サイト「タイルだもんで」
calpin
0
140
全員がアウトプットを出せる時代、 誰を採用する?
nishame
0
560
コンテンツ作成者の体験を設計する
chiilog
0
170
はじめての演奏会フライヤーデザイン
chorkaichan
1
300
AI時代、デザイナーの価値はどこに?
tararira
2
1.1k
2026年、デザイナーはなにに賭ける?
0b1tk
0
560
Featured
See All Featured
HTML-Aware ERB: The Path to Reactive Rendering @ RubyCon 2026, Rimini, Italy
marcoroth
1
140
Lightning talk: Run Django tests with GitHub Actions
sabderemane
0
190
Organizational Design Perspectives: An Ontology of Organizational Design Elements
kimpetersen
PRO
1
720
Agile that works and the tools we love
rasmusluckow
331
21k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
32
3.3k
Between Models and Reality
mayunak
4
320
Color Theory Basics | Prateek | Gurzu
gurzu
0
320
brightonSEO & MeasureFest 2025 - Christian Goodrich - Winning strategies for Black Friday CRO & PPC
cargoodrich
3
720
Google's AI Overviews - The New Search
badams
0
1k
Typedesign – Prime Four
hannesfritz
42
3.1k
Become a Pro
speakerdeck
PRO
31
6k
svc-hook: hooking system calls on ARM64 by binary rewriting
retrage
2
280
Transcript
͔ͨͪΛͭ͘ΔͱͲ͏͍͏͜ͱͳͷ͔ʁ ଜ্༤ଠ
ࣗݾհ ໊લ ଜ্༤ଠ ઐྖҬ ΠϯλϥΫγϣϯσβΠϯ 69σβΠϯ 4/4 Twitterɿ@WeiweYuʢYutaro Murakamiʣ
͔ͨͪΛͭ͘Δͱ͍͏͜ͱ ͔ͨͪͱ ͜͜Ͱݴ͏͔ͨͪͱɺ͍ΘΏΔ ਓ͕ؒޒײΛ௨ͯ͠ೝࣝ͢Δ͜ͱ͕ Ͱ͖Δͷͩͱߟ͍͑ͯ·͢ɻ ͭ·ΓιϑτΣΞͷΠϯλϑΣʔε Ͱ͋ͬͨΓɺ๏ͳͲͷΈͰ͋ͬͨΓɺ ݐஙͰ͋ͬͨΓɺ ༷ʑͳදݱͱͯ͠զʑ͕ೝࣝͰ͖Δͷ ͩͱͯ͠ߟ͍͖͑ͯ·͢ɻ
ೝࣝ͢Δ ֮͢Δ
͔ͨͪΛͭ͘Δͱ͍͏͜ͱ զʑɺೋͭͷ৮Εಘ͵ͷͷؒͷ͋ΔछͷௐΛ୳͍ͯ͠Δɻ ͦΕɺ·ͩզʑ͕σβΠϯ͍ͯ͠ͳ͍ܗͱɺత֬ʹද͠ಘͳ͍ίϯςΫετͷؒͷௐͰ͋Δɻ bb `` ΫϦετϑΝʔɾΞϨάβϯμʔʮܗͷ߹ʹؔ͢Δϊʔτʯ
͔ͨͪΛͭ͘Δͱ͍͏͜ͱ ࢲ͕ͨͪͦ͜ʹݟ͍ͯΔ͔ͨͪɺ࣮ର͚ͩͰͳ͘ɺ ରͱؔΘΓ͋͏ࢲͷՄೳతੈքͦ͜ʹఏҊ͞Ε͔ͨͨͪͰ͋Δͱߟ͑Δ͜ͱ͕Ͱ͖Δɻ bb `` ਢӬ߶࢘ʮσβΠϯͷܙใσβΠϯ͔Βࣾձͷ͔ͨͪͮ͘Γʯ
͔ͨͪΛͭ͘Δͱ͍͏͜ͱ ࣗର͕ଘࡏ͍ͯ͠Δதͷੈք ڥ͔ΒӨڹΛड͚ɺ·ͨͦͷੈքʹ ଘࡏ͢Δਓؒʹରͯ͠ՄೳੑҙຯΛ ఏࣔ͢ΔͷͰ͋Δͱߟ͑Δ͜ͱ͕ Ͱ͖Δͱࢥ͍·͢ɻ ՄೳੑҙຯΛ ఏࣔ͢Δ ଘࡏ͍ͯ͠Δੈքɺڥɺจ຺
σβΠφʔ͕σβΠϯΛ͢Δͱ͖ σβΠφʔ·ͣʰਓؒͷ׆ಈʱΛඳ͖ɺ࣍ʹୈೋͷରͰ͋ΔʰΠϯλϥΫγϣϯʱʹண͢Δɻ ͦͷ׆ಈͷͳ͔Ͱɺਓ͕ؒͦͷಓ۩ʢίϯϐϡʔλʣΛ͍͔ʹར༻͠ɺ ͲͷΑ͏ʹಓ۩ͱΠϯλϥΫτ͢Δͷ͔Λඳ͘ͷͩɻΠϯλϥΫγϣϯ͕ඳ͔ΕΔͱɺ ୈࡾͷରͰ͋ΔʰίϯϐϡʔλʢιϑτΣΞɾΞϓϦέʔγϣϯʣʱͷػೳͱΠϯλϑΣʔεΛ ͔ͨͪͮ͘Δ͜ͱ͕σβΠφʔͷࣄʹͳΔɻ bb `` ਢӬ߶࢘ʮσβΠϯͷܙใσβΠϯ͔Βࣾձͷ͔ͨͪͮ͘Γʯ
σβΠφʔ͕σβΠϯΛ͢Δͱ͖ ਓؒத৺ઃܭϓϩηε ར༻ঢ়گͷ Ѳͱ໌ࣔ ઃܭղܾҊͷ ࡞ ཁٻੳͱ ༷Խ ཁٻʹର͢Δ ධՁ
ਓؒத৺ઃܭ ϓϩηεͷܭը ϢʔβʔཁٻΛຬ ͨ͢ͷ࣮ݱ ʮ*40ʯ
σβΠφʔ͕σβΠϯΛ͢Δͱ͖ ͜ΕΒΛΈ͍ͯ͘ͱɺզʑ͕σβΠϯ ͢Δ࣌ʹ͍͖ͳΓ͔ͨͪͱͳΔͷΛ ͭ͘Γ࢝ΊΔͷͰͳ͘ɺ·ͣਓؒͷ׆ಈ ࣗମͦΕ͕ߦΘΕ͍ͯΔ ੈքɺจ຺Λ໌ࣔతʹ͠ɺͦΕΒΛ ͱʹ͔ͨͪΛ͍ͭͬͯ͘͘ͱ͍͏ ׆ಈΛ͍ͯ͠Δͱೝࣝ͢Δ͜ͱ͕Ͱ͖·͢ɻ
σβΠφʔ͕σβΠϯΛ͢Δͱ͖ ࠓճͷͰݴ͏ͱɺ͔ͨͪΛ࡞͍ͬͯ͘ ͱ͍͏ͷɺಛʹ ʰ2. ཁٻੳͱ༷Խʱ ↓ ʰ3. ઃܭղܾҊͷ࡞ʱ ͷؒʹͳΔͱߟ͍͑ͯ·͢ɻ ͜͜ͷํ๏OOUIʢΦϒδΣΫτ
ࢦϢʔβʔΠϯλϑΣʔεʣͰͭͳ͙ ͜ͱ͕Ͱ͖Δͱݸਓతʹೝ͍ࣝͯ͠·͢ ͕ɺͦͦͲΜͳΦϒδΣΫτΛ Ͳ͏͔ͨͪʹ͢Δͱྑ͍ͷ͔ʁ
ͲͷΑ͏ʹ͔ͨͪΛͭ͘Δͷ͔ʁ ਓͷಛੑੑ࣭ʹযΛ͋ͯΔ δΣϑɾϥεΩϯ ʮ࡞ۀʹର͢Δχʔζͱ͍͏ͷ͕Ϣʔβຖʹ ҟͳ͍ͬͯΔͱͯ͠ɺϢʔβूஂଟ͘ͷҰ ൠతͳ৺ཧଐੑΛڞ༗͍ͯ͠ΔͷͰ͢ʯ ιϑτΣΞͰݴ͏ͱɺσβΠϯύλʔϯͳͲ ͕͜Εʹͯ·Δ͔͠Ε·ͤΜɻ ASzx
ͲͷΑ͏ʹ͔ͨͪΛͭ͘Δͷ͔ʁ Ϣʔβʔ͔Β ΛूΊΔ ϓϦϯλʔͰૹΔ ۀ ຊ࣭తͳରʢΦϒδΣΫτʣͷ ໌֬Խ ͦͷ׆ಈۀຊ࣭తʹԿΛ͍ͯ͠Δͷ͔ʁ Λ໌֬ʹ͢Δɻ ͦͷ݁Ռɺۀͷதʹଘࡏ͍ͯ͠Δ
ΦϒδΣΫτͰͳ͘ɺϢʔβʔ͕ຊ࣭తʹ औΓѻ͍ͬͯΔରʢΦϒδΣΫτʣΛநग़͢ Δ͜ͱ͕େࣄͳͷͰͳ͍͔ͱߟ͑·͢ɻ
ͲͷΑ͏ʹ͔ͨͪΛͭ͘Δͷ͔ʁ Ϣʔβʔ͔Β ΛूΊΔ ϓϦϯλʔͰૹΔ ۀ σʔλ ඞཁͱ͍ͯ͠Δ ૹ͍ͬͯΔͷ ຊ࣭తͳରʢΦϒδΣΫτʣͷ ໌֬Խ
ͦͷ׆ಈۀຊ࣭తʹԿΛ͍ͯ͠Δͷ͔ʁ Λ໌֬ʹ͢Δɻ ͦͷ݁Ռɺۀͷதʹଘࡏ͍ͯ͠Δ ΦϒδΣΫτͰͳ͘ɺϢʔβʔ͕ຊ࣭తʹ औΓѻ͍ͬͯΔରʢΦϒδΣΫτʣΛநग़͢ Δ͜ͱ͕େࣄͳͷͰͳ͍͔ͱߟ͑·͢ɻ ྫ͑͜ͷ߹ͩͱɺ େࣄͳͷʮϓϦϯλʔʯͰͳ͘ɺʮσʔλʯɻ
ͲͷΑ͏ʹ͔ͨͪΛͭ͘Δͷ͔ʁ Cognitive Characteristics Physical Characteristics Organic Handful Can be cut
/ peeled / sliced Sharp Hard Handy ্ֶʮϓϩϨλϦΞσβΠϯʯΑΓචऀ࡞