Tweet
Tweet

Slide 1

Slide 1 text

Human Interface Guidelines͔Β ᕷΈग़ΔݶքײΛߟ͑Δ IBOZV!4BOTBO *OD 2017.09.17 | iOSDC2017

Slide 2

Slide 2 text

No content

Slide 3

Slide 3 text

Human Interface Guidelines͸ ݶքͳͷ͔ʁ

Slide 4

Slide 4 text

No content

Slide 5

Slide 5 text

Կ͔͠Βͷ࿦ཧ͸͋Δ͸ͣʜ w ࡢࠓͷApple੡ΞϓϦͷUIʹର͢Δҧ࿨ײΛඥղ͘ w ͦΕΒ͸HIGͱͲ͏ંΓ߹͍Λ͚͍ͭͯΔͷ͔ʁ w ͦ͜ʹɼ͜Ε͔ΒͷUIσβΠϯΛߟ͑Δώϯτ͕͋Δ͸ͣ

Slide 6

Slide 6 text

Apple੡ΞϓϦUIʹର͢Δҧ࿨ײ

Slide 7

Slide 7 text

No content

Slide 8

Slide 8 text

No content

Slide 9

Slide 9 text

No content

Slide 10

Slide 10 text

ҧ࿨ײͷԞʹ͋Δཧ۶Λ୳Δ

Slide 11

Slide 11 text

(Web΋ؚΊͨ)ߪೖಋઢશମͰͷҰ؏ੑ

Slide 12

Slide 12 text

https://developer.apple.com/ios/human-interface-guidelines/overview/themes/ Human Interface Guidelines “Themes|Design Principles”ΑΓ ඪ४తͳελΠϧ౳Λ༻͍ͯҰ؏ੑͷ͋ΔΞϓϦΛ ࣮૷͢Δ ˞͔ͳΓҙ༁͍ͯ͠·͢ Consistency A consistent app implements familiar standards and paradigms by using system-provided interface elements, well-known icons, standard text styles, and uniform terminology. The app incorporates features and behaviors in ways people expect.

Slide 13

Slide 13 text

ΞϥʔτΛ࢖Θͳ͍ͨΊͷ̍ख๏

Slide 14

Slide 14 text

https://developer.apple.com/ios/human-interface-guidelines/views/alerts/ Human Interface Guidelines “Alerts”ΑΓ ॏཁͳঢ়گ ֬ೝɼ໰୊ͷ௨஌ͳͲ ͰͷΈ࢖༻͠ɼ ΞϥʔτΛ࠷খݶʹ Minimize alerts. Alerts disrupt the user experience and should only be used in important situations like confirming purchases and destructive actions (such as deletions), or notifying people about problems. The infrequency of alerts helps ensure that people take them seriously. Ensure that each alert offers critical information and useful choices.

Slide 15

Slide 15 text

ཁૉΛ໌ྎʹ۠ผ͢ΔͨΊͷ̍ख๏

Slide 16

Slide 16 text

https://developer.apple.com/ios/human-interface-guidelines/overview/themes/ Human Interface Guidelines “Themes|iOS Design Themes”ΑΓ ಡΈ΍͍͢ςΩετωΨςΟϒεϖʔεͷ׆༻౳ʹΑΓ
 ໌ྎͳ6*Λ࣮ݱ͠ ίϯςϯπͷڧௐ΍ΠϯλϥΫςΟϒ ੑͷఏࣔΛߦ͏ Clarity. Throughout the system, text is legible at every size, icons are precise and lucid, adornments are subtle and appropriate, and a sharpened focus on functionality motivates the design. Negative space, color, fonts, graphics, and interface elements subtly highlight important content and convey interactivity.

Slide 17

Slide 17 text

https://developer.apple.com/ios/human-interface-guidelines/overview/whats-new/ Human Interface Guidelines “What’s New in iOS 11”ΑΓ ୳ࡧʹ͓͚Δ໌ྎੑ޲্ͷͨΊɼ/BWJHBUJPO#BS͸ େ͖͘ɾଠ͍λΠτϧΛ࢖͏ Bolder navigation. To improve clarity and context when browsing and searching, apps can implement navigation bars that include large, bold titles. New

Slide 18

Slide 18 text

No content

Slide 19

Slide 19 text

https://www.apple.com/iphone-x/

Slide 20

Slide 20 text

ϘλϯʹԑऔΓ τʔετදࣔ ಥવͷϘʔϧυϔομ Ұ؏ੑ Ξϥʔτ࢖༻ͷۃগԽ ໌ྎ͞ →ද໘্͸HIG͔Βҳ୤͍ͯ͠Δ΋ͷ΋ɼ ΑΓਂ͍ૂ͍ͱͯ͠͸߹க͍ͯ͠Δͱݴ͑Δ

Slide 21

Slide 21 text

ಠࣗͷΞΠσΞΛੜΈग़͍ͯͩ͘͠͞ɻ
 ࣗ෼͚ͩͷΞΠσΞ͕͋Δ͸ͣͰ͢ɻ
 ͦΕΛܗʹ͠·͠ΐ͏ɻ IUUQTEFWFMPQFSBQQMFDPNBQQTUPSFSFWJFXHVJEFMJOFTKQ "QQ4UPSF৹ࠪΨΠυϥΠϯl໛฿zΑΓ

Slide 22

Slide 22 text

IUUQTNBUFSJBMJPHVJEFMJOFTDPNQPOFOUTCVUUPOTIUNMCVUUPOTTUZMF #VUUPOT$PNQPOFOUT.BUFSJBMEFTJHOHVJEFMJOFT

Slide 23

Slide 23 text

HIG͕༩͑Δࣗ༝౓ w HIGͷࢦ਑ͱ߹க͍ͯ͠Ε͹ɼ۩ମతͳදݱʹ͍ͭͯ͸
 ಠࣗͷΞΠσΞ͕঑ྭ͞Ε͍ͯΔ ͓Αͼ৹ࠪΨΠυϥΠϯ

Slide 24

Slide 24 text

Human Interface Guidelines

Slide 25

Slide 25 text

HIGͱ͍͔ʹંΓ߹͏͔ʁ

Slide 26

Slide 26 text

HIGʹ۪௚ʹै͏ͱ͍͏͜ͱ w iOSΒ͍͠ΞϓϦ͸ग़དྷ্͕Δ w ͨͩ͠ɼʮΊͬͪΌ͍͍ʯʮͱͯ΋࢖͍΍͍͢ʯʮ͍͢͝ʯͱ͸ͳΓ೉͍ ˣ ັྗ

Slide 27

Slide 27 text

ङ໺Ϟσϧ w ັྗత඼࣭ w ຬͨ͞Ε͍ͯͳͯ͘΋࢓ํͳ͍ʗຬͨ͞ΕΔͱຬ଍ w ౰ͨΓલ඼࣭ w ຬͨ͞Εͳ͍ͱෆຬʗຬͨ͞Ε͍ͯͯ౰ͨΓલ w Ұݩత඼࣭ w ຬͨ͞Εͳ͍ͱෆຬʗຬͨ͞ΕΔͱຬ଍

Slide 28

Slide 28 text

ङ໺Ϟσϧ͔ΒΞϓϦ඼࣭Λߟ͑Δ ັྗత ౰ͨΓલ ౰ͨΓલ ັྗత Function UI ίΞػೳ ʴЋػೳ ϚΠΫϩ ΠϯλϥΫγϣϯ ઃఆ ݕࡧ

Slide 29

Slide 29 text

Human Interface Guidelines ङ໺Ϟσϧ͔ΒΞϓϦ඼࣭Λߟ͑Δ ັྗత ౰ͨΓલ ౰ͨΓલ ັྗత Function UI ίΞػೳ ʴЋػೳ ϚΠΫϩ ΠϯλϥΫγϣϯ ઃఆ ݕࡧ

Slide 30

Slide 30 text

·ͱΊ

Slide 31

Slide 31 text

Human Interface Guidelinesʹݶք͸͋Δͷ͔ʁ w ۩ମతͳදࣔํ๏͍ͭͯ͸ݶք͕͋Δ w ҙਤతͳݶքͰ͋Γɼ౰ͨΓલ඼࣭Λॆ଍Ͱ͖Ε͹ྑ͍έʔε΋ଟ͍ w FH߲໨ͷೖྗɼݕࡧɼઃఆ
 w HIGΛӽ͑ͨັྗతͳಠࣗͷΞΠσΞ͕ٻΊΒΕ͍ͯΔ w ࢦ਑ʹ߹க͍ͯ͠Ε͹ɼಠࣗͷදࣔํ๏΋ड༰͞ΕΔ w Apple͕ͲͷΑ͏ʹҳ୤͍ͯ͠Δ͔ɼ΋ώϯτ