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
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
Yudai Yokoyama
November 25, 2015
Design
0
94
エンジニアとデザイナーのあいだ
2015/11/25 iOS 9 週連続 Boot Camp! 9 週目 発表資料
Yudai Yokoyama
November 25, 2015
Tweet
Share
More Decks by Yudai Yokoyama
See All by Yudai Yokoyama
スマホアプリデザインの心得 - Developers.IO 2016
udaiadu
0
6.1k
望みを叶えるUIデザイン
udaiadu
0
1.5k
Other Decks in Design
See All in Design
はじめての演奏会フライヤーデザイン
chorkaichan
1
240
絵や写真から学ぶ、要素がもたらす副作用
kspace
0
230
「自分の仕事はどこまで?」と問い続けたら。デザイナーの「視座」を考える
mukai_takeru
0
320
Figma MCPを活用するためのデザインハンドブック
vivion
6
13k
Signull 団体説明資料
signull
0
430
20260215独立行政法人科学技術振興機構(JST) 社会技術研究開発センター(RISTEX)ケアが根づく社会システム _公開シンポジウム
a2k
0
130
富山デザイン勉強会_デザイントレンド2026.pdf
keita_yoshikawa
3
150
Crisp Code inc.|ブランドガイドライン - Brand guidelines
so_kotani
1
340
これからの「Webデザイン」の話をしよう~デザイナーの私が考えるブロックテーマへの対応で変わりゆくデザインの価値~
ds35mm
0
600
アンエシカルデザインの枠組みの提案 -HCD-Netダークパターン研究会活動報告-
securecat
0
230
結びながら、ひらく - にじむ境界のデザイン
hilokifigma
4
1.5k
デザインするために「多様性」について考える
iflection
0
240
Featured
See All Featured
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
16
1.9k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
22k
GraphQLの誤解/rethinking-graphql
sonatard
75
11k
Groundhog Day: Seeking Process in Gaming for Health
codingconduct
0
130
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
141
35k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
234
17k
Documentation Writing (for coders)
carmenintech
77
5.3k
The B2B funnel & how to create a winning content strategy
katarinadahlin
PRO
1
310
A Guide to Academic Writing Using Generative AI - A Workshop
ks91
PRO
0
240
Designing Experiences People Love
moore
143
24k
Build The Right Thing And Hit Your Dates
maggiecrowley
39
3.1k
The innovator’s Mindset - Leading Through an Era of Exponential Change - McGill University 2025
jdejongh
PRO
1
130
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