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
そのUI、実は簡単じゃないんです
Search
akatsuki174
July 10, 2018
Design
7
17k
そのUI、実は簡単じゃないんです
2018/07/10(火) DXEL.1 エンジニアとデザイナーが「いい関係」を築くために
akatsuki174
July 10, 2018
Tweet
Share
More Decks by akatsuki174
See All by akatsuki174
逆向きUIの世界 〜iOSアプリのRTL言語対応〜
akatsuki174
1
260
逆向きUIの世界〜AndroidアプリのRTL言語対応〜
akatsuki174
1
500
私が変えてきたこと、変えなかったこと
akatsuki174
2
880
最近読んでいる本-読書シェア会vol.1
akatsuki174
2
210
SwiftUI、UIKitでキャプチャを撮ろう!
akatsuki174
1
110
Appleにおけるプライバシーの全容を把握する
akatsuki174
0
5.8k
近年のAppleにおける位置情報とプライバシー
akatsuki174
3
470
オフライン勉強会ぼっち対策
akatsuki174
1
670
Xcode 15の新機能
akatsuki174
0
2.8k
Other Decks in Design
See All in Design
見過ごさない誠実さ_アクティブバイスタンダーとIntegrityが支えるアジャイル文化 / integrity-and-active-bystander
spring_aki
1
120
役立つシステムを作るためのAI活用
kanzaki
0
110
Building Experiences: Design Systems, User Experience, and Full Site Editing
marktimemedia
0
270
DESIGNEAST 2025 A-3
_kotobuki_
0
100
AI業務アプリケーションの体験デザイン
kazuhirokimura
0
190
Marpで推しCSSスライドを作ろう! / marp-with-favorite-css
fujiemon
0
660
組織で取り組むアクセシビリティのはじめ方
masakiohsumi
0
190
CursorでAI活用のナレッジベースを構築する
kanzaki
0
760
文字コントラストを改めて考える / Reevaluating Text Contrast
lycorptech_jp
PRO
0
560
数理的アプローチで挑むスマホUIのデザイン改善:タップ成功率推定ツール「Tappy」の社内活用事例 / Improving Smartphone UI Design with a Mathematical Approach: In-house Use Case of the Tap Success Rate Estimation Tool "Tappy"
lycorptech_jp
PRO
0
860
FigmaのFigmaファイルから学ぶTips & Tricks
hilokifigma
0
700
地理院地図をもっと楽しく!れきちず新機能のご紹介
hjmkth
1
180
Featured
See All Featured
Understanding Cognitive Biases in Performance Measurement
bluesmoon
31
2.7k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
30
2.9k
KATA
mclloyd
32
15k
Done Done
chrislema
185
16k
Code Review Best Practice
trishagee
72
19k
The Straight Up "How To Draw Better" Workshop
denniskardys
238
140k
Building Applications with DynamoDB
mza
96
6.7k
4 Signs Your Business is Dying
shpigford
185
22k
A Modern Web Designer's Workflow
chriscoyier
697
190k
GraphQLの誤解/rethinking-graphql
sonatard
73
11k
How STYLIGHT went responsive
nonsquared
100
5.8k
Music & Morning Musume
bryan
46
6.8k
Transcript
ͦͷUIɺ ࣮؆୯͡Όͳ͍ΜͰ͢ @akatsuki174 DXEL.1 ʙΤϯδχΞͱσβΠφʔ͕ʮ͍͍ؔʯΛஙͨ͘Ίʹʙ
ࣗݾհ • ਢ౻ຘ • גࣜձࣾZaimॴଐ • iOSΤϯδχΞ • Twitter, Qiita,
SlideShare, GitHub, SpeakerDeck, ͯͳϒϩά, note →akatsuki174
None
ɾiOSΤϯδχΞੜ׆ͷதͰʮ͏͓ɺ ɹؾ࣋ͪ͛͢ʔΘ͔Δ͚ͲͦͷUI ɹख͕ؒ…ʂʯͱࢥͬͨ͜ͱΛ3ͭհ ɾͳͥͦΕ͕͍͠ͷؚ͔Ίͯઆ໌ ɾԿ͔iOSΞϓϦ࡞ͷॿ͚ʹͳΕͱ… ࠓͷ༰
ཁ̍ɿʮʻΔʯϘλϯλοϓ࣌ ʹΞϥʔτΛද͍ࣔͨ͠
ཁৄࡉ ೖྗܥը໘͔ΒΔͱ͖ɺʮฤूத ͚ͩͲ͍͍͔ͬͯͬ͢ʁʯͱ͍͏ ΞϥʔτΛग़͍ͨ͠
ʮʻΔʯϘλϯ ɾΧελϚΠζ͢Δ͜ͱͰ͖Δ ɾλοϓ࣌ʹΞΫγϣϯΛ͚Ճ͑Δ ɹ͜ͱͰ͖Δ
ΧελϚΠζྫɿ৭Λม͑Δ
ΧελϚΠζྫɿʮʻʯ only
ΧελϚΠζྫɿtext only
͕͔ͩ͠͠ʂ ɾඪ४ͷʮʻΔʯUI × ΞΫγϣϯͷ ɹΈ߹ΘͤʢݫີʹʣͰ͖ͳ͍
ͦΕͬΆ͘ؤுͬͨͭ
ͦΕͬΆ͘ؤுͬͨฐ ɾશମͰϘλϯͷ৭Λม͍͑ͨ߹ʹ ɹݸผରԠΛ͢Δඞཁ͕͋Γɺ໘ ɾϝϯςφϯε໘ͰΊΜͲͦ͏
ผҊྫ ɾඪ४ͷΔϘλϯʹ͠ͳ͍͜ͱΛ ɹڐ༰͢Δ ɾࣗಈอଘʹͯ͠ɺͦͦอଘΛ ɹ֬ೝ͢ΔඞཁΛͳ͘͢
ཁ̎ɿϋΠύʔϦϯΫΛ͚͍ͨ
ϋΠύʔϦϯΫ WebͰΑ͘ݟΔϋΠύʔϦϯΫɺ iOSͩͱͪΐͬͱΊΜͲ͍͘͞
UILabelͰରԠ͢Δ߹ ɾϥϕϧͷશͯͷจࣈྻʹର͠ ɹಉ͡ઃఆʢ৭ɺαΠζͱ͔ʣΛ ɹద༻͢Δͷָ ɾϥϕϧͷจࣈྻͷҰ෦ʹผͷઃఆ ɹΛద༻͢͠ΔͳΒNSAttributedString ɹΛ͏ඞཁ͕͋Δ
֘෦͚ͩ৭͚
λοϓ͞Εͨͷ͕ϦϯΫ จࣈ෦͔ఆ
ผҊྫ ϦϯΫ෦Ϙλϯͱͯ͠ ผͷͱ͜Ζʹஔ͘
ཁ̏ɿΞίʔσΟΦϯϝχϡʔΛ ࡞Γ͍ͨ
ΞίʔσΟΦϯϝχϡʔ ɾiOSඪ४ͰΞίʔσΟΦϯϝχϡʔ ɹΛ࣮ݱͰ͖ΔΑ͏ͳΈఏڙ ɹ͞Ε͍ͯͳ͍ ɾؤுͬͯ࡞Ζ͏ͱࢥ͏ͱUITableView ɹΛվͯ͠࡞Δ͜ͱʹͳΔ
UITableView Α͘ϦετܕͷUIͰ ͬͯΔͭ
UITableView ΞίʔσΟΦϯɺ ྫ͑ΧςΰϦ - δϟϯϧ ͷΑ͏ͳࢠ͕ؔ͋Δ ➜section headerΛ ΧςΰϦͱͯ͠ɺcellΛ δϟϯϧͱͯ͠ߟ͑Δ
ΊΜͲ͍ϙΠϯτ ɾηΫγϣϯʹλοϓॲཧΛ͚Δ ɾࢠؔͷσʔλߏΛ࣋ͨͤΔ ɾηΫγϣϯͷ։ดঢ়ଶΛ֮͑ͤ͞Δ ɾΞχϝʔγϣϯʹࣗ༝͕ޮ͔ͳ͍ etc…
ผҊྫ ɾʢભҠ૿͑Δ͚ͲʣΧςΰϦΛλοϓ ɹͨ͠Βδϟϯϧը໘ʹભҠ͢Δ ɾWebViewʹ͢Δ
·ͱΊ ɾiOSʹiOSݻ༗ʢUIKitಛ༗ʣͷUI͕ ɹ͋ΓɺʮiOSͰΑ͘ݟͳ͍UIʯʹ ɹΑ͘ݟͳ͍ͳΓͷཧ༝͕͋Δ ɾૣΊʹٞʹڍ͛ͯɺίετͱମݧ͕ ɹͪΐ͏Ͳ͍͍ԘകʹͳΔͱ͜ΖΛ ɹݟ͚ͭΑ͏
͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ