Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Introduction to Font and Typesetting

Shigure Shimotori
August 31, 2018
Programming
4
3.2k

Introduction to Font and Typesetting

iOSDC Japan 2018 https://iosdc.jp/2018/
フォントと組版の30分入門

#iosdc #c

Shigure Shimotori

August 31, 2018
Tweet

More Decks by Shigure Shimotori

See All by Shigure Shimotori
UIColor Anatomy
s_shimotori
1
1.7k
UIColor Cluster
s_shimotori
1
420
iOSDC Japan 2019 60 mins for color
s_shimotori
5
3.3k
wwdc19
s_shimotori
2
290
SE-0246 Generic Math(s) Functions
s_shimotori
2
2.2k
Swift Enumeration is so useful
s_shimotori
2
380
iosdcrc_operator
s_shimotori
1
560
20171002Testing
s_shimotori
2
1.5k
ARC vs. GC？ARC in GC？
s_shimotori
1
1.1k

Other Decks in Programming

See All in Programming
フロントエンド刷新をプロジェクトとして進める際に気をつけていること
koba04
1
1.2k
SwiftSyntaxが面白い
ryu_hu03
1
380
Unexplored Region - parse.y -
yui_knk
2
1.2k
Hugo で作ったブログに閲覧数ランキングが欲しい!
track3jyo
PRO
2
440
PO,SMに送るテスト自動化の8原則に5箇条を添えて / scrumniigata2023
pineapplecandy
2
800
NotionのURLをWorkersで綺麗にしよう！
totto2727
0
210
Composing a Design System
stewemetal
0
170
LLMによるプロット生成の試み（スターウォーズ）
hitokun
0
1.1k
enjoy_conferences
maimux2x
0
5k
Evolving a microservice architecture: how to right-size your services
cer
PRO
0
710
Modern and Lightweight Cloud Application Development with Jakarta EE 10
ivargrimstad
0
630
AWS CDKとZodを活用したバリデーションパターン集 / validation patterns with cdk and zod
gotok365
3
950

Featured

See All Featured
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
16
1.3k
A better future with KSS
kneath
230
16k
Streamline your AJAX requests with AmplifyJS and jQuery
dougneiner
130
8.9k
Reflections from 52 weeks, 52 projects
jeffersonlam
341
18k
Thoughts on Productivity
jonyablonski
52
2.9k
Building an army of robots
kneath
300
41k
The Illustrated Children's Guide to Kubernetes
chrisshort
26
44k
Building Better People: How to give real-time feedback that sticks.
wjessup
346
18k
The World Runs on Bad Software
bkeepers
PRO
59
5.9k
The Invisible Customer
myddelton
113
12k
StorybookのUI Testing Handbookを読んだ
zakiyama
9
3.5k
Code Reviewing Like a Champion
maltzj
508
38k

Transcript

  1. ࢿྉ
    [email protected]@QVCͷݻఆπΠʔτ

    View Slide

  2. ϑΥϯτͱ૊൛ͷ30෼ೖ໳
    iOSDC Japan 2018
    2018/08/31
    ͠΋ͱΓ @S_Shimotori_pub

    View Slide

  3. ࣗݾ঺հ
    ͠΋ͱΓ
    ɹɹ @S_Shimotori_pub
    iOSDC ωοτϫʔΫνʔϜ
    ※ઈରϑΥϯτײ͸͋Γ·ͤΜ


    View Slide



  4. View Slide

  5. ຊ୊


    View Slide

  6. iOSΤϯδχΞʹ
    ฉ͍ͯཉ͍͠τʔΫ
    ʢ30෼ʣ


    View Slide

  7. ϚδͰΨνͳτʔΫͰ͢ʂ


    View Slide

  8. ໘ന͍͔Βฉ͍ͯ΄͍͠τϐοΫ
    • ϑΥϯτͱ͸૊൛ͱ͸
    • ͍Ζ͍Ζͳݴޠͱ૊൛
    • ҹ࡮෺Λ࡞Δ


    View Slide

  9. ϑΥϯτͱ͸૊൛ͱ͸


    View Slide

  10. ׆൛ҹ࡮ͷ༻ޠͰ͢ʂ


    View Slide

  11. ׆൛ҹ࡮ͷͳ͕Ε
    ׆ࣈΛ ૊Έ൛ʹͯ͠ ࡮Δʂ
    ҹ࡮ത෺ؗʹͯɻ


    View Slide

  12. View Slide

  13. ϑΥϯτ
    ίϯϐϡʔλʔͰ࢖͏จࣈͷσβΠϯͷ͜ͱɻ׆ࣈͷ࣌୅
    ʹ͸ɺಉ͡ॻମͰಉ͡αΠζͷ׆ࣈηοτΛࢦ͢ݴ༿Ͱ
    ͕͋ͬͨɺిࢉࣸ২΍DTPͰ͸ͻͱͭͷϑΥϯτͰ֦େ΍
    ॖখɺมܗ͕Ͱ͖ΔͨΊɺଠࣈ΍ࣼମͳͲͷελΠϧΛؚ
    ΊͯϑΥϯτͱݺͿΑ͏ʹͳͬͨɻ
    ASCII σδλϧ༻ޠࣙయΑΓ


    View Slide

  14. View Slide



  15. ஍਒Ͱձࣾͷ׆ࣈ͕…
    ͳ͔΋ͱΏ͏(@nakamotoyuu)
    https://twitter.com/nakamotoyuu/status/1008488924644163585

    View Slide

  16. ૊൛
    ݪߘʹج͍ͮͯ׆ࣈΛ૊Έɼ࠷ऴతʹ͸൛Λ࡞Δ·Ͱͷ
    ࡞ۀ͓Αͼ׬੒ͨ͠൛ɽ

    ʢதུʣ

    खಈɼػց͞Βʹ͸ίϯϐϡʔλͰ͋ͬͯ΋ɼ૊൛ͱ͍͏
    දݱ͸࢖ΘΕ͍ͯΔɽ
    ਤॻؗ৘ใֶ༻ޠࣙయ ୈ4൛ΑΓ


    View Slide

  17. ݱࡏʢ1985೥ʙʣ

    View Slide

  18. ׆൛ҹ࡮ͷ͓࿩͸͜͜·Ͱʂ


    View Slide

  19. ͍Ζ͍Ζͳݴޠͱ૊൛


    View Slide

  20. ͜Μͳͱ͜Ζʹ૊൛͕ʂ
    • ӳޠͰ #શ෦ಉ͡͡Όͳ͍Ͱ͔͢ SPACEฤ
    • ೔ຊޠͰiOSॎॻ͖ʹ௅ઓ
    • λΠޠͰTall Script
    • ΞϥϏΞޠͰRTLͱ߹ࣈ


    View Slide

  21. ӳޠͰ #શ෦ಉ͡͡Όͳ͍Ͱ͔͢
    SPACEฤ

    View Slide

  22. https://ja.wikipedia.org/wiki/%E3%82%B9%E3%83%9A%E3%83%BC%E3%82%B9

    View Slide

  23. https://ja.wikipedia.org/wiki/%E3%82%B9%E3%83%9A%E3%83%BC%E3%82%B9
    શ෦ಉ͡͡Όͳ͍Ͱ͔͢

    View Slide



  24. ΋ͬͱΑ͘ݟΖʂ

    View Slide



  25. ͓୊

    l*OUSPEVDUJPOUP'POUBOE5ZQFTFUUJOHz

    View Slide



  26. ͓୊

    l*OUSPEVDUJPOUP'POUBOE5ZQFTFUUJOHz




    View Slide



  27. ※SF Pro Text

    View Slide

  28. εϖʔεͱΞΩ
    U+2003 EM SPACE
    U+2002 EN SPACE
    U+2004 THREE-PER-EM SPACE
    U+2005 FOUR-PER-EM SPACE
    U+2006 SIX-PER-EM SPACE


    View Slide

  29. εϖʔεͱΞΩ
    U+2003 EM SPACE
    U+2002 EN SPACE
    U+2004 THREE-PER-EM SPACE
    U+2005 FOUR-PER-EM SPACE
    U+2006 SIX-PER-EM SPACE


    View Slide



  30. ͓୊ᶄ

    View Slide



  31. EN
    ENͱ1/4EM
    InDesign
    ΞΩࣗಈ
    ※ώϥΪϊ֯ΰγοΫ

    View Slide

  32. ೔ຊޠͰiOSॎॻ͖ʹ௅ઓ


    View Slide

  33. View Slide



  34. ͓୊

    lʰϑΥϯτͱ૊൛ͷ෼ೖ໳ʱz

    View Slide

  35. ʰaOϑaOΥaOϯaOτaOͱaO૊aO൛aOͷaOʜ


    View Slide



  36. 1ߦ1จࣈ

    View Slide



  37. 1ߦ1จࣈ ͓खຊ

    View Slide



  38. ޲͖͕͓͔͍͠ ❌
    ❌
    ❌
    ❌
    ❌
    ͓खຊ
    ޲͖͕͓͔͍͠
    ࠨԼʹدͬͯΔ
    ࠨʹدͬͯΔ

    View Slide



  39. ޲͖͕͓͔͍͠ ❌
    ❌
    ❌
    ❌
    ❌
    ͓खຊ
    ޲͖͕͓͔͍͠
    ࠨԼʹدͬͯΔ
    ࠨʹدͬͯΔ

    View Slide



  40. ޲͖͕͓͔͍͠ ❌
    ❌
    ❌
    ❌
    ❌
    ͓खຊ
    ޲͖͕͓͔͍͠
    ࠨԼʹدͬͯΔ
    ࠨʹدͬͯΔ

    View Slide

  41. 1ߦ1จࣈํࣜͷ໰୊఺
    • ه߸ͷ޲͖͕ԣॻ͖ͷ··
    • ፠ԻͷҐஔ΋ԣॻ͖ͷ··
    • ൒֯ӳ਺ࣈͷҐஔ͕ࠨʹدͬͯ͠·͏


    ❌
    ❌
    ❌
    ❌
    ❌

    View Slide

  42. ೔ຊޠͷॎॻ͖Ͱඞཁͳ࡞ۀ
    • ॎॻ͖༻ͷάϦϑΛ࢖͏
    • தԝἧ͑Ͱฒ΂Δ
    • JIS X 4051ͷఆΊΔͱ͜Ζʹै͏


    View Slide

  43. άϦϑ
    ܗঢ়ʹ͍ͭͯͷந৅త֓೦
    1ͭͷจࣈʹෳ਺ͷάϦϑ͕͋Δ͜ͱ΋
    ɹɹe.g. Χοί։͖ʹ͸ɹɹͱɹɹͷ͔͕ͨͪ͋Δ
    ɹɹɹɹ፠Ի͸ࠨԼʹॻ͘ͱ͖ͱӈ্ʹॻ͘ͱ͖͕͋Δ


    ʰ
    ʰ

    View Slide

  44. ॎॻ͖༻άϦϑ
    ϑΥϯτʹΑͬͯ͸ผʹ༻ҙ͋Γ
    ༻ҙ͕ͳͯ͘΋90౓ճసͤ͞Ε͹OK


    ❌
    ❌
    ✅
    ✅
    ✅

    View Slide

  45. https://developer.apple.com/documentation/foundation/nsattributedstring/key/1528658-verticalglyphform
    “1 indicates vertical text”
    “horizontal text is always used”

    View Slide

  46. “1 indicates vertical text”
    “horizontal text is always used”
    https://developer.apple.com/documentation/foundation/nsattributedstring/key/1528658-verticalglyphform
    glyph
    typesetting

    View Slide

  47. จࣈͷฒ΂͔ͨ
    ӳޠ͸base lineͰϕʔεฒͼɺ
    ೔ຊޠ͸จࣈͷதԝͰηϯλʔฒͼ


    View Slide

  48. ❌
    ❌
    ✅
    ✅
    ✅

    View Slide

  49. தԝ͕ἧ͏Α͏ʹฒ΂Δ
    ౳෯ϑΥϯτΛ࢖͏
    or
    શ֯ӳ਺ࣈΛ࢖͏
    or
    CoreTextͷग़൪


    ✅
    ✅
    ✅
    ✅
    ✅

    View Slide

  50. λΠޠͰTall Script
    λΠจࣈ·Ώ͛


    View Slide

  51. λΠޠͷಛ௃
    • λΠจࣈΛ༻͍Δ
    • Tall scriptͷҰछ
    λΠจࣈ·Ώ͛


    สวัสดีชาวโลก!

    View Slide

  52. λΠจࣈ·Ώ͛

    View Slide

  53. λΠจࣈ·Ώ͛
    ϓϦοπͷϥʔϒຯʂ

    View Slide

  54. λΠจࣈ·Ώ͛
    ϓϦοπͷϥʔϒຯʂ

    View Slide

  55. λΠจࣈ·Ώ͛
    αϥμຯ

    View Slide

  56. λΠจࣈ·Ώ͛

    View Slide

  57. λΠจࣈ·Ώ͛

    View Slide

  58. ΞϥϏΞޠ


    View Slide

  59. ΞϥϏΞޠͷಛ௃
    • ΞϥϏΞจࣈΛ༻͍Δ
    • ӈԣॻ͖
    • ߹ࣈ


    View Slide

  60. ӈԣॻ͖ Right-to-Left
    ӈ͔Βࠨͷ޲͖Ͱॻ͍͍ͯ͘͜ͱ
    ݱ࣮ʹ͸RTLͱLTR͕ࠞࡏ͢Δ૒ํ޲ςΩετʹͳΔ


    View Slide

  61. https://www.apple.com/
    https://www.apple.com/ae-ar/


    View Slide

  62. iOSʹ͓͚ΔRTL
    UIViewΛӈ͔Βࠨʹ഑ஔ
    navigation͸ࠨ͕nextɺӈ͕back
    Ұ෦ͷΞΠίϯΛमਖ਼(൓సͳͲ)


    View Slide



  63. View Slide

  64. ࣌ܭճΓ͸ͲͬͪճΓʁ


    View Slide



  65. View Slide

  66. ߹ࣈ Ligature
    ྡΓ߹ͬͨೋͭͷจࣈ຺ུ͕ͷ͋Δ͔ͨͪͱͯࣗ͠વʹ

    Έ͑ΔΑ͏Ͱ͖ͨάϦϑ
    fi
    et &


    View Slide

  67. ΞϥϏΞޠͷ߹ࣈ
    ߹੒લ
    ߹੒ޙ


    ❓❓❓

    View Slide

  68. ΞϥϏΞޠͷ߹ࣈ
    ߹੒લ
    ߹੒ޙ


    View Slide

  69. ݴޠͷ͓࿩͸͜͜·Ͱʂ


    View Slide

  70. ҹ࡮෺Λ࡞Δ


    View Slide



  71. ೖߘͷྲྀΕ

    View Slide

  72. ҹ࡮෺Λ࡞Δ͓࿩
    • PDFͱϑΥϯτͷ͓࿩
    • ϦονͳΦϓγϣϯ


    View Slide

  73. PDFͱϑΥϯτͷ͓࿩


    View Slide

  74. ࠶ܝɿAppleͱAdobeͷਤ
    Aldus͸Adobe͕ඒຯ͘͠৯΂·ͨ͠

    View Slide

  75. PDF͕อ࣋͢Δ৘ใʢྫʣ
    • ༻ࢴαΠζ
    • ϑΥϯτ৘ใ
    • ίϯςϯπΛ഑ஔ͢ΔҐஔ
    • ςΩετ
    • ਤܗ


    View Slide

  76. ϑΥϯτσʔλ͸Ͳ͜ʁ
    Ӿཡऀͷίϯϐϡʔλʹ͓·͔ͤ
    or
    ඞཁͳͿΜΛPDFࣗ਎Ͱอ࣋
    or
    Ξ΢τϥΠϯԽͯ͠ϑΥϯτ৘ใഁغ
    ຒΊࠐΈʁ


    Apple Chancery
    →

    View Slide

  77. ϦονͳΦϓγϣϯ


    View Slide

  78. ͩ͜ΘΓϙΠϯτ͸͜͜ʂ
    ☑ ࢴ͕ްΊ
    ☑ ಛघࢴΛ࢖͍ͬͯΔ
    ☑ ༡ͼࢴΛೖΕ͍ͯΔ
    ☑ ഩΛೖΕ͍ͯΔ
    ☑ ৭਺͕ଟ͍
    ☑ ಛ৭Λ࢖͍ͬͯΔ
    ໊ࢗʹ͓ۚΛ࢖͏ͷ΋ָͦ͠͏


    View Slide

  79. Ҏ্ʂ


    View Slide

  80. ·ͱΊ
    • ׆൛ҹ࡮ͷӨڹ͸ະͩڧ͠
    • ֤ݴޠͷಛ௃ͷ೺Ѳ͕େࣄ
    • ॎॻ͖͸೉қ౓͕ߴ͍
    • ࣮ߦҕһ௕͸ޫΓ෺͕޷͖ͬͯ͝ຊਓ͕͓ͬ͠Όͬͯ·ͨ͠


    View Slide

  81. ͨͷ͍͠ࢀߟจݙ
    • https://github.com/S-Shimotori/iOSDC2018Draft
    • Book/bibliographies ΍ Referenfe.md ͋ͨΓ
    • Θͨ͠ͷiOSDCײ૝ϒϩάʹਪનਤॻॻ͔͘΋
    • ௚઀ฉ͍ͯʂ


    View Slide

  82. ,
    ͓͠·͍ʂ


    View Slide