Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
エンジニアとデザイナーのあいだ
Search
Yudai Yokoyama
November 25, 2015
Design
98
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
エンジニアとデザイナーのあいだ
2015/11/25 iOS 9 週連続 Boot Camp! 9 週目 発表資料
Yudai Yokoyama
November 25, 2015
More Decks by Yudai Yokoyama
See All by Yudai Yokoyama
スマホアプリデザインの心得 - Developers.IO 2016
udaiadu
0
6.2k
望みを叶えるUIデザイン
udaiadu
0
1.6k
Other Decks in Design
See All in Design
JBUG大阪#9_登壇資料_引き継ぎで困らないためのBacklogWikiの整え方_ミスと属人化を防ぐために、 “次の人が動ける状態”をどう残すか
webnaut
2
250
test deck title
shotamatsuo
0
1.6k
【CEDEC2026】『Shadowverse: Worlds Beyond』続編開発におけるUIデザイン・アニメーション演出の「超進化」 ~継承と挑戦を両立するデザイン手法~
cygames
PRO
3
5.2k
富山デザイン勉強会_デザイン思考.pdf
keita_yoshikawa
3
180
Saving_the_King_-_Storyboard.pdf
terencebasart
0
320
組織で働く大人が「知らないままにやってみる」を取り戻す方法とその意味〜企業で働く実務家による実践知の言語化を事例とした考察〜
chiemitaki
1
400
広い関与の可能性に どう向き合うのか? 私たちは。|Timee MarketingDesign 2026-06-18
bebe
0
1k
ボタンUIの冪等性の話をしたらVimmerに刺さっちゃった
ottatto
3
1.8k
1000人規模の組織でデザインハーネスを導入するための第一歩
pkshadeck
PRO
5
4k
つくり方を変えていく | change-how-we-build
mottox2
2
1.5k
空間アプリ開発のフィードバックをCodexにするための抽象的なデザインツールの模索
karad
0
200
Agentic Design Workflowを育てる 「三層デザインハーネス」の現在地
sayadesign2
0
460
Featured
See All Featured
Rails Girls Zürich Keynote
gr2m
96
14k
The Impact of AI in SEO - AI Overviews June 2024 Edition
aleyda
6
1.2k
New Earth Scene 8
popppiees
4
2.6k
Google's AI Overviews - The New Search
badams
0
1.6k
Ethics towards AI in product and experience design
skipperchong
2
380
GraphQLの誤解/rethinking-graphql
sonatard
75
12k
Skip the Path - Find Your Career Trail
mkilby
1
230
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
46
3k
Visualization
eitanlees
152
17k
For a Future-Friendly Web
brad_frost
183
10k
Believing is Seeing
oripsolob
1
220
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
162
16k
Transcript
None
ࣗݾհ Α͜· Ώ͏͍ͩ @udaiadu ΞϓϦέʔγϣϯΤϯδχΞ / σβΠφʔ 2013/12 ೖࣾ ࠷ۙεϓϥτΡʔϯʹΨνϋϚΓ
લ৬ͭುళ ւಓ ۴࿏ࢢ ग़ ͜Ε·ͰʹݐஙࢪཧΛܦݧ
ࣗݾհ Α͜· @udaiadu ΞϓϦέʔγϣϯΤϯδχΞ / σβΠφʔ 2013/12 ೖࣾ ࠷ۙεϓϥτΡʔϯʹΨνϋϚΓ લ৬ͭುళ
ւಓ ۴࿏ࢢ ग़ ͜Ε·ͰʹݐஙࢪཧΛܦݧ
࣭ Are you ΤϯδχΞ ? 唐突に!
࣭ Are you σβΠφʔ ? 唐突に!!
࣭ Are you Ͳͬͪ ? 唐突に!!!
ϞόΠϧΞϓϦαʔϏε෦ 10% 10% 10% 70% Ϋϥεϝιου ΤϯδχΞ σβΠφʔ Ͳͬͪ PMɾPL
͓Θ͔Γ͍͚ͨͩͨͩΖ͏͔ʜ
デザイナー募集中!!
None
ΤϯδχΞ͔ͭσβΠφʔͱͯ͠
ΤϯδχΞ͔ͭσβΠφʔͱͯ͠ ࣗͰσβΠϯͯࣗ͠Ͱ࣮ σβΠϯͯ͠࠷ޙʹ UI ௐ CustomView ৬ਓ icon ͷૉࡐϦϙδτϦʹ Push
ΑΓΑ͍ΞϓϦΛಧ͚ΔͨΊʹ
ΑΓΑ͍ΞϓϦΛಧ͚ΔͨΊʹ ͋Δ͋Δࣄྫ ͳʹ͕ʁ ղܾҊ
͋Δ͋Δࣄྫ ϨΠΞτͷόϥϯε͕Α͘ͳ͍ エンジニア編
ࣗݾհ @udaiadu ΞϓϦέʔγϣϯΤϯδχΞ / σβΠφʔ 2013/12 ೖࣾ ࠷ۙεϓϥτΡʔϯʹΨνϋϚΓ લ৬ͭುళ ւಓ
۴࿏ࢢ ग़ ͜Ε·ͰʹݐஙࢪཧΛܦݧ Α͜· Ώ͏͍ͩ
ࣗݾհ Α͜· Ώ͏͍ͩ @udaiadu ΞϓϦέʔγϣϯΤϯδχΞ / σβΠφʔ 2013/12 ೖࣾ ࠷ۙεϓϥτΡʔϯʹΨνϋϚΓ
લ৬ͭುళ ւಓ ۴࿏ࢢ ग़ ͜Ε·ͰʹݐஙࢪཧΛܦݧ Α͜· Ώ͏͍ͩ @udaiadu ΞϓϦέʔγϣϯΤϯδχΞ / σβΠφʔ 2013/12 ೖࣾ ࠷ۙεϓϥτΡʔϯʹΨνϋϚΓ લ৬ͭುళ ւಓ ۴࿏ࢢ ग़ ͜Ε·ͰʹݐஙࢪཧΛܦݧ
ͳʹ͕ʁ ࡉ͔͍σβΠϯमਖ਼͕ൃੜ͢Δ मਖ਼Օॴ͕ଟ͗ͯͦ͢ͷ··ϦϦʔε ϓϩͬΆ͘ͳ͍
ղܾҊ ϨΠΞτͷجૅΛֶͿ
ࣗݾհ Α͜· Ώ͏͍ͩ @udaiadu ΞϓϦέʔγϣϯΤϯδχΞ / σβΠφʔ 2013/12 ೖࣾ ࠷ۙεϓϥτΡʔϯʹΨνϋϚΓ
લ৬ͭುళ ւಓ ۴࿏ࢢ ग़ ͜Ε·ͰʹݐஙࢪཧΛܦݧ ࣗݾհ Α͜· Ώ͏͍ͩ @udaiadu ΞϓϦέʔγϣϯΤϯδχΞ / σβΠφʔ 2013/12 ೖࣾ ࠷ۙεϓϥτΡʔϯʹΨνϋϚΓ લ৬ͭುళ ւಓ ۴࿏ࢢ ग़ ͜Ε·ͰʹݐஙࢪཧΛܦݧ
ࣗݾհ Α͜· Ώ͏͍ͩ @udaiadu ΞϓϦέʔγϣϯΤϯδχΞ / σβΠφʔ 2013/12 ೖࣾ ࠷ۙεϓϥτΡʔϯʹΨνϋϚΓ
લ৬ͭುళ ւಓ ۴࿏ࢢ ग़ ͜Ε·ͰʹݐஙࢪཧΛܦݧ
ࣗݾհ @udaiadu ΞϓϦέʔγϣϯΤϯδχΞ / σβΠφʔ 2013/12 ೖࣾ ࠷ۙεϓϥτΡʔϯʹΨνϋϚΓ લ৬ͭುళ ւಓ
۴࿏ࢢ ग़ ͜Ε·ͰʹݐஙࢪཧΛܦݧ Α͜· Ώ͏͍ͩ
ࣗݾհ Α͜· Ώ͏͍ͩ @udaiadu ΞϓϦέʔγϣϯΤϯδχΞ / σβΠφʔ 2013/12 ೖࣾ ࠷ۙεϓϥτΡʔϯʹΨνϋϚΓ
લ৬ͭುళ ւಓ ۴࿏ࢢ ग़ ͜Ε·ͰʹݐஙࢪཧΛܦݧ Α͜· Ώ͏͍ͩ @udaiadu ΞϓϦέʔγϣϯΤϯδχΞ / σβΠφʔ 2013/12 ೖࣾ ࠷ۙεϓϥτΡʔϯʹΨνϋϚΓ લ৬ͭುళ ւಓ ۴࿏ࢢ ग़ ͜Ε·ͰʹݐஙࢪཧΛܦݧ
ʻॻ੶հʼ ͳΔ΄ͲσβΠϯ
͋Δ͋Δࣄྫ AutoLayout ͕ۤख エンジニア編
None
Add Missing Constraints μϝɺθολΠɻ
ͳʹ͕ʁ UIͷ࣮ʹͨΒͱ͕͔͔࣌ؒΔ ʹΑͬͯϨΠΞτ่͕յ͢Δ ؆୯ͳϨΠΞτ͔͠࡞Εͳ͍
ղܾҊ AutoLayout ͔Βಀ͛ͳ͍
ಀ͛ͨ͘ͳΔΘ͚
͓͚ා͍ཧ ਓؒͩΕ͠ະͷͷʹڪා͢Δ ਖ਼ମ͕Θ͔Εා͘ͳ͍
AutoLayout ΛΔ
Δؾ QU QU
Δؾ
IUUQXXXTMJEFTIBSFOFULBLFHBXBBUTVTIJEFWJPBVUPMBZPVU
͋Δ͋Δࣄྫ icon ͷαΠζখͯ͘͞͠ エンジニア編
icon খͯ͘͞͠ αΠζʁ @2x ͕̋̋pxͰɺ @3x ͕̋̋pxͰΑΖ
ͳʹ͕ʁ ࣗͰͰ͖ͳ͍ ಛผͳιϑτ͕ඞཁͩͱࢥ͍ͬͯΔ σβΠφʔͱͷΓͱΓͷํ͕͔͔࣌ؒΔ
ղܾҊ ؆୯ͳը૾ฤूεΩϧΛʹ͚ͭΔ
None
Preview ͰͰ͖Δ͜ͱ ը૾ΛݟΔ
͚ͩ͡Όͳ͍ʂ
Preview ͰͰ͖Δ͜ͱ ը૾ΛݟΔ αΠζͷௐ Χϥʔͷௐ ઢɺจࣈɺਤܗͷॻ͖ࠐΈ ͳͲͳͲ
ϚʔΫΞοϓπʔϧόʔදࣔ
ϚʔΫΞοϓπʔϧόʔ
αΠζΛௐ
None
ΧϥʔΛௐ
None
None
͋Δ͋Δࣄྫ σβΠϯఏҊ࣌ʹཧ༝Λฉ͔Εͯ٧Ή デザイナー編
None
ͳʹ͕ʁ આಘྗ͕ͳ͍ ҙݟΛަΘ͢͜ͱ͕Ͱ͖ͳ͍ σβΠϯεΩϧ͕͑ΒΕͳ͍
ղܾҊ UI ͱձ͢Δ
ͳͥͦ͜ʹ͍Δͷʁ ը໘ΛΓସ͑Δ ͨΊͩΑ #VUUPO
͋Δ͋Δࣄྫ WEBσβΠϯͬΆ͍ デザイナー編
≠
ͳʹ͕ʁ UIίϯϙʔωϯτͷಛੑ͕ߟྀ͞Ε͍ͯͳ͍ ը໘ભҠ͕ෳࡶͰ໎ࢠʹͳΔ ̍ͭͷը໘ʹใ͕ଟ͗͢Δ
ղܾҊ ΞϓϦʹΞϓϦͷσβΠϯ
ਓͷҙݟΛฉ͍ͯΈΔ
ਓͷҙݟΛฉ͍ͯΈΔ σβΠϯதʹ৭ʑͳਓʹݟͯΒ͏ ಈ͘ͷ͕Ͱ͖ͨΒ࣮ࡍʹͬͯΒ͏
͋Δ͋Δࣄྫ ࣗͰमਖ਼ͯ͠PRͪΐ͏͍ͩ ʢஊʣ デザイナー編
ͳʹ͕ʁ গ͠ͷमਖ਼Ͱେ͖ͳίϛϡχέʔγϣϯ ίετ͕͔͔Δ ࡞ۀͷ߹ؒʹमਖ਼ґཔͯ͠·ͨमਖ਼ґཔ ͱ͔ؾ͕ͻ͚Δ
ղܾҊ IB ΛϚελʔ͢Δ
None
None
IUUQXXXTMJEFTIBSFOFULBLFHBXBBUTVTIJEFWJPBVUPMBZPVU
·ͱΊ
ΤϯδχΞ ϨΠΞτͷجૅΛֶͿ AutoLayout ͔Βಀ͛ͳ͍ ؆୯ͳը૾ฤूεΩϧΛʹ͚ͭΔ
σβΠφʔ σβΠϯʹ໌֬ͳࠜڌΛ࣋ͭ ΞϓϦσβΠϯ ≠ WEBσβΠϯ IB ΛϚελʔ͢Δ
Ͳͬͪ ৭ʑͳΞϓϦΛݟΔ σβΠϯΨΠυϥΠϯΛݟΔ
ʻॻ੶հʼ ϞόΠϧσβΠϯ ύλʔϯ
B C D E F
B C Designer E F
B C Designer E F ngineer
ΤϯδχΞͱσβΠφʔͷ͍͋ͩʹ
अຐ͢ΔͷԿͳ͍ʂ
͍͍ͷͭ͘Γ·ͤΜ͔ʁ
None