とある端末の触覚技術 -フィードバック-

とある端末の触覚技術 -フィードバック-

iOSDC Japan 2018( https://fortee.jp/iosdc-japan-2018/proposal/26e6c9da-921a-4f47-a9d4-286c42d84bd7 )での発表資料です。

スライド内で紹介したUIFeedBackGeneratorを一通り試すことのできるサンプラーは以下で確認できます。
・cokaholic/TapticSampler

https://github.com/cokaholic/TapticSampler

95f926465b1c71fbb49850c5b6223c4d?s=128

Keisuke Tatsumi

August 31, 2018
Tweet

Transcript

  1. 2.

    cokaholic • iOS engineer at AbemaTV, Inc. • Github, Qiita:

    cokaholic • Twitter: @TK_u_nya • AppStore: Keisuke Tatsumi
  2. 11.

    Agenda • What’s Taptic Engine • How To Use •

    When should I use Taptic Engine? • Summary
  3. 12.

    Agenda • What’s Taptic Engine • How To Use •

    When should I use Taptic Engine? • Summary
  4. 14.

    Taptic Engine ͕౥ࡌ͞Ε͍ͯΔσόΠε • iPhone6s, 6s Plus • iPhone7, 7

    Plus • iPhone8, 8 Plus • Apple Watch Series1, 2, 3 • iPhoneX
  5. 17.

    What’s Taptic Engine • iPhone6s͔Β಺෦ʹ౥ࡌ͞Εͨϋʔυ΢ΣΞ • Taptic Engine͸Haptic FeedbackΛ࣮ݱ͢Δͨ Ίʹ౥ࡌ͞Ε͍ͯΔ

    • iOS10͔ΒUIKitʹTaptic EngineΛ੍ޚ͢ΔͨΊ ͷΫϥε (UIFeedbackGenerator) ͕௥Ճ͞Εͨ
  6. 18.

    Agenda • What’s Taptic Engine • How To Use •

    When should I use Taptic Engine? • Summary
  7. 22.

    How To Use let generator = UINotificationFeedbackGenerator() generator.prepare() generator.notificationOccurred(.error) 1.

    GeneratorΛΠϯελϯεԽ͢Δ 2. prepare() Λݺͼग़͢ (Φϓγϣϯ) 3. notificationOccurred(UINotificationFeedbackType)ͰൃՐͤ͞Δ ͦΕͧΕͷৼಈͷҧ͍͸ҎԼͷ௨ΓͰ͢ɻ • error … τΡτΡτΡ ͱ͍͏ײ͡Ͱ3ճৼಈ • warning … τϯτϯ ͱ2ճৼಈ • success … τϯτϯ ͱ2ճৼಈ
  8. 23.

    How To Use let generator = UINotificationFeedbackGenerator() generator.prepare() generator.notificationOccurred(.error) 1.

    GeneratorΛΠϯελϯεԽ͢Δ 2. prepare() Λݺͼग़͢ (Φϓγϣϯ) 3. notificationOccurred(UINotificationFeedbackType)ͰൃՐͤ͞Δ ͦΕͧΕͷৼಈͷҧ͍͸ҎԼͷ௨ΓͰ͢ɻ • error … τΡτΡτΡ ͱ͍͏ײ͡Ͱ3ճৼಈ • warning … τϯτϯ ͱ2ճৼಈ • success … τϯτϯ ͱ2ճৼಈ ] େ͖ͳࠩ͸ແ͍͕ɺwarning ͸ʰΧϯΧϯʱͱߕߴ ͍ײ͡ͷ2ճৼಈɺsuccess ͸ʰά Χϯʱͱ͍͏ײ ͡Ͱ1ൃ໨ͷৼಈ͕ॏ͍ؾ͕͢Δ
  9. 25.

    How To Use let generator = UIImpactFeedbackGenerator(style: .light) generator.prepare() generator.impactOccurred()

    1. GeneratorΛ UIImpactFeedbackStyle ͔ΒΠϯελϯεԽ͢Δ 2. prepare() Λݺͼग़͢ (Φϓγϣϯ) 3. impactOccurred()ͰൃՐͤ͞Δ • lightͩͱؾ͔ͮ͘Ͳ͏͔ͷΪϦΪϦ͙Β͍ͰɺheavyͰ΋ઌ΄Ͳͷ warning΄ͲͰ͸ແ͍ؾ͕͢Δ
  10. 27.

    How To Use let generator = UISelectionFeedbackGenerator() generator.prepare() generator.selectionChanged() 1.

    GeneratorΛΠϯελϯεԽ͢Δ 2. prepare() Λݺͼग़͢ (Φϓγϣϯ) 3. selectionChanged()ͰൃՐͤ͞Δ • ஋ͷมԽͷͨͼʹݺ͹ΕΔϝιου಺Ͱൃಈͤ͞Δ໨తͰ࢖༻͢Δ
  11. 28.

    Tips • ϝΠϯεϨου಺Ͱ͔࣮͠ߦͰ͖ͳ͍ ‣ αϒεϨουͰ࣮ߦ͠Α͏ͱ͢ΔͱԼهΤϥʔ͕ग़Δ
 
 • σϑΥϧτͰFeedback͕࣮૷͞Ε͍ͯΔඪ४UI΋͋Δ ‣ UIPickerView

    ‣ UIRefreshControl ‣ UISwitch ͳͲ • ը໘ऩ࿥த΍࿥Իத͸ൃՐ͞Εͳ͍ [Feedback] trying to activate the feedback engine from a non-main thread, this is unsupported.
  12. 32.

    Maximum Feedback let numberOfGenerators = 20 // ੜ੒਺ var generators:

    [UIImpactFeedbackGenerator] = [] // `generator`Λੜ੒ for _ in 0..<numberOfGenerators { let generator = UIImpactFeedbackGenerator(style: .heavy) generator.prepare() generators.append(generator) } // ੜ੒ͨ͠`generator`Λ͢΂ͯൃՐ for generator in generators { generator.impactOccurred() } 1. Generator Λੜ੒਺෼͚ͩੜ੒͠ɺ഑ྻʹ֨ೲ͢Δ 2. ϧʔϓͰҰؾʹ഑ྻ಺ͷ͢΂ͯͷ Generator ΛൃՐͤ͞Δ
  13. 35.

    Deprecated Tips • ಉ࣌ʹ࣮ߦ͢ΔͱɺΑΓύϫϑϧͳFeedbackΛੜ੒͢Δ͜ͱ ͸Մೳ • ੜ੒ͨ͠FeedbackΛಉ࣌ʹ࣮ߦͰ͖Δݸ਺͸20ݸ·Ͱ ‣ 21ݸҎ্ൃੜͤ͞Α͏ͱ͢ΔͱԼهΤϥʔ͕ग़ͯɺ21ݸ໨ Ҏ߱ͷFeedback͸ൃՐ͞Εͳ͍


    • ಉ࣌ʹ࣮ߦͤ͗͢͞ΔͱɺTaptic Engine ͔Βίπϯͱ͍͏Ի ͕ฉ͑͜ΔϨϕϧͷিܸʹͳΓɺނোͷݪҼͱͳΓ͏ΔՄೳ ੑ͕͋ΔͨΊɺਖ਼௚͋·ΓΦεεϝͰ͖ͳ͍ [Feedback] out of channels
  14. 36.

    Agenda • What’s Taptic Engine • How To Use •

    When should I use Taptic Engine? • Summary
  15. 37.

    When should I use Taptic Engine? • iOS Human Interface

    Guidelines ʹ Taptic Engine Λ ࢖ͬͨϑΟʔυόοΫΛ࣮૷͢Δ্Ͱͷ஫ҙ఺͕·ͱΊ ΒΕ͍ͯΔ • ͜͜Ͱ͍͏ϑΟʔυόοΫͱ͸ɺΞΫγϣϯͷ݁ՌΛ ϢʔβʔʹϑΟʔυόοΫ͢Δखஈͷ͜ͱΛࢦ͢ • Ҏ߱͸ͦͷҙ༁ͱ࣮ࡍʹ࢖༻͞Ε͍ͯΔΞϓϦͷྫΛ· ͱΊͨ಺༰Ͱ͋Δ
  16. 41.

    When should I use Taptic Engine? • Success. ‣ ೖۚ΍ղৣͳͲ͕੒ޭͨ͜͠ͱΛ఻͑ΔͨΊʹ࢖༻Ͱ͖·͢ɻ

    • Use haptics judiciously. ‣ ϑΟʔυόοΫશମͷҙຯ͕ബΕͯ͠·͏ͷͰɺଟ༻͸ආ͚·͠ΐ͏ɻ
  17. 42.

    When should I use Taptic Engine? • Success. ‣ ೖۚ΍ղৣͳͲ͕੒ޭͨ͜͠ͱΛ఻͑ΔͨΊʹ࢖༻Ͱ͖·͢ɻ

    • Use haptics judiciously. ‣ ϑΟʔυόοΫશମͷҙຯ͕ബΕͯ͠·͏ͷͰɺଟ༻͸ආ͚·͠ΐ͏ɻ • In general, provide haptic feedback in response to user-initiated actions. ‣ ϢʔβʔͷΞΫγϣϯʹ߹ΘͤͯϑΟʔυόοΫΛൃੜͤ͞·͠ΐ͏ɻ ೚ҙͷλΠϛϯάͰͷϑΟʔυόοΫ͸ҙࣝΛதஅͤ͞ɺޡղΛੜΈ· ͢ɻ
  18. 43.

    When should I use Taptic Engine? • Don’t redefine feedback

    types. ‣ ϑΟʔυόοΫλΠϓ͸ҙਤͲ͓Γʹ࢖༻͍ͯͩ͘͠͞ɻλεΫ͕੒ޭ͠ ͨ͜ͱΛϢʔβʔʹ௨஌͢Δʹ͸ɺ UINotificationFeedbackGenerator ͷ UINotificationFeedbackType.success Λ࢖༻͠ɺͦΕҎ֎ͷ΋ͷ͸࢖ Θͳ͍Α͏ʹ͠·͠ΐ͏ɻ
  19. 44.

    When should I use Taptic Engine? • Don’t redefine feedback

    types. ‣ ϑΟʔυόοΫλΠϓ͸ҙਤͲ͓Γʹ࢖༻͍ͯͩ͘͠͞ɻλεΫ͕੒ޭ͠ ͨ͜ͱΛϢʔβʔʹ௨஌͢Δʹ͸ɺ UINotificationFeedbackGenerator ͷ UINotificationFeedbackType.success Λ࢖༻͠ɺͦΕҎ֎ͷ΋ͷ͸࢖ Θͳ͍Α͏ʹ͠·͠ΐ͏ɻ • Fine tune your visual experience for haptics. ‣ ࢹ֮ͱ৮֮ͷϑΟʔυόοΫΛಉ࣌ʹൃੜͤ͞Δ͜ͱͰΞΫγϣϯͱ݁Ռ ͷΑΓਂ͍ͭͳ͕ΓΛఏڙ͠·͠ΐ͏ɻ
  20. 45.

    With Visual Experience For Haptics ex.ʣYouTube • YouTubeΞϓϦͰ͸ਧ͖ग़͕͠දࣔ͞ΕΔࡍʹ UIImpactFeedbackGenerator ͷ

    .light Λಉ࣌ʹൃՐͤ͞Δ͜ͱͰɺࢹ֮ ͱ৮֮ͷϑΟʔυόοΫΛಉ࣌ʹ࣮ݱ͍ͯ͠Δ
  21. 46.

    When should I use Taptic Engine? • Don’t redefine feedback

    types. ‣ ϑΟʔυόοΫλΠϓ͸ҙਤͲ͓Γʹ࢖༻͍ͯͩ͘͠͞ɻλεΫ͕੒ޭ͠ ͨ͜ͱΛϢʔβʔʹ௨஌͢Δʹ͸ɺ UINotificationFeedbackGenerator ͷ UINotificationFeedbackType.success Λ࢖༻͠ɺͦΕҎ֎ͷ΋ͷ͸࢖ Θͳ͍Α͏ʹ͠·͠ΐ͏ɻ • Fine tune your visual experience for haptics. ‣ ࢹ֮ͱ৮֮ͷϑΟʔυόοΫΛಉ࣌ʹൃੜͤ͞Δ͜ͱͰΞΫγϣϯͱ݁Ռ ͷΑΓਂ͍ͭͳ͕ΓΛఏڙ͠·͠ΐ͏ɻ • Don’t rely on a single mode of communication. ‣ શͯͷ୺຤͕Haptic FeedbackΛαϙʔτ͍ͯ͠ΔΘ͚Ͱ͸ͳ͍ͷͰɺΞ Ϋγϣϯͷ݁ՌΛHaptic Feedback͚ͩʹͯ͠͸͍͚·ͤΜɻ
  22. 47.

    When should I use Taptic Engine? • Use haptics when

    visual feedback may be occluded. ‣ ΦϒδΣΫτΛεΫϦʔϯ্ͷ৔ॴʹυϥοά͢Δͱ͖ͳͲ͸ɺ ࢦͰӅΕͯ͠·͍·͢ɻಛఆͷ৔ॴ΍஋ʹ౸ୡͨ͠ͱ͖ʹϢʔ βʔʹHaptic FeedbackͰ௨஌͢Δ͜ͱΛݕ౼͍ͯͩ͘͠͞ɻ
  23. 48.

    When Reaching the "Edge" ex.ʣTwitter • TwitterΞϓϦͰ͸ը૾ͷϓϨϏϡʔը໘Ͱॖখɾ֦େͷ୺·Ͱ౸ୡͨ͠ͱ͖ ʹ UIImpactFeedbackGenerator ͷ

    .light ΛൃՐ͍ͤͯ͞Δ • ඪ४ͷϝʔϧΞϓϦͰ͸ड৴ϘοΫεͰηϧΛࠨʹҾͬுͬͨ࣌ʹ̏ͭͷબ ୒ࢶ͕ݱΕɺͦͷ··ࠨʹҾͬுΓ੾ͬͯ୺·Ͱ౸ୡͨ͠ͱ͖ʹ UIImpactFeedbackGenerator ͷ .medium ΛൃՐ͍ͤͯ͞Δ ex.ʣඪ४ͷϝʔϧΞϓϦ
  24. 49.

    When should I use Taptic Engine? • Use haptics when

    visual feedback may be occluded. ‣ ΦϒδΣΫτΛεΫϦʔϯ্ͷ৔ॴʹυϥοά͢Δͱ͖ͳͲ͸ɺ ࢦͰӅΕͯ͠·͍·͢ɻಛఆͷ৔ॴ΍஋ʹ౸ୡͨ͠ͱ͖ʹϢʔ βʔʹHaptic FeedbackͰ௨஌͢Δ͜ͱΛݕ౼͍ͯͩ͘͠͞ɻ • Synchronize haptics with accompanying sound. ‣ Haptic FeedbackͰ͸Ի͸ൃੜ͠·ͤΜɻHaptic Feedbackͱ ಉ࣌ʹԻ͕ඞཁͰ͋Ε͹ɺ֤ࣗͰԻ੠ಉظॲཧΛ࣮૷͢Δඞ ཁ͕͋Γ·͢ɻ
  25. 50.

    Success With Sound Effect ex.ʣIn App Purchase • ΞϓϦ಺՝ۚͷTouch IDೝূ੒ޭ࣌ʹUINotificationFeedbackGenerator

    ͷ .success ΛൃՐͤ͞Δͱಉ࣌ʹߪೖ׬ྃͷԻΛ໐Β͢͜ͱͰɺ՝͕ۚ ੒ޭͨ͜͠ͱΛ఻͍͑ͯΔ ԻΛར༻͢Δ͜ͱͰɺϢʔβʔʹରͯ͠ૢ࡞ΠϝʔδΛ࣋ͨͤ΍͘͢ͳΔ
  26. 51.

    Success With Sound Effect ex.ʣIn App Purchase • ΞϓϦ಺՝ۚͷTouch IDೝূ੒ޭ࣌ʹUINotificationFeedbackGenerator

    ͷ .success ΛൃՐͤ͞Δͱಉ࣌ʹߪೖ׬ྃͷԻΛ໐Β͢͜ͱͰɺ՝͕ۚ ੒ޭͨ͜͠ͱΛ఻͍͑ͯΔ • Ի΋ར༻͢Δ͜ͱͰɺϢʔβʔʹରͯ͠ૢ࡞ΠϝʔδΛ࣋ͨͤ΍͘͢ͳΔ ߪೖ׬ྃͷԻʹؔ͢ΔTwitterͷ൓Ԡ
  27. 52.

    Agenda • What’s Taptic Engine • How To Use •

    When should I use Taptic Engine? • Summary
  28. 53.

    Summary • Taptic Engine͸Haptic FeedbackΛ࣮ݱ͢ΔͨΊʹ౥ࡌ͞ Ε͍ͯΔ • iOS10Ҏ্Ͱ͋Ε͹ɺUIFeedbackGeneratorΛ࢖༻͢Δ͜ ͱͰHaptic FeedbackΛ࣮૷Ͱ͖Δ

    • ϑΟʔυόοΫ͸࢖͏΂͖Օॴ͚ͩʹ࢖༻͠ɺଟ༻͗ͯ͢͠ ҙຯ͕ബΕͳ͍Α͏ʹ஫ҙ͢Δ • ΄ͲΑ͍FeedbackͰɺϫϯϥϯΫ্ͷϢʔβʔମݧΛ
  29. 56.

    ࢀߟϦϯΫ • UIFeedbackGenerator - UIKit | Apple Developer Documentation
 https://developer.apple.com/documentation/uikit/uifeedbackgenerator

    • iPhone 7 Λೖखͨ͠ͷͰૣ଎ Taptic Engine ͷ API Λࢼͯ͠Έ·ͨ͠ -Qiita
 https://qiita.com/griffin_stewie/items/298f57ca3f1714ebe45c • [iOS 10] UIFeedbackGenerator Ͱ iPhone 7 ͷ Taptic Engine Λ੍ޚ͢Δ - Developers.IO
 https://dev.classmethod.jp/smartphone/iphone/ios-10-ui-feedback-generator/ • UIFeedbackGeneratorͷ࢖͍ํͱศརʹ࢖͑ΔϥΠϒϥϦ - VASILY DEVELOPERS BLOG
 http://tech.vasily.jp/entry/ios_ui_feedbcak_generator • iPhone 7ͷTaptic Engine͕ࠓޙͷεϚϗΠϯλʔϑΣʔεΛม͑Δ͔΋ͷ࿩ - FICC Workbook
 http://ficc-workbook.tumblr.com/post/151637042116/iphone-7%E3%81%AEtaptic- engine%E3%81%8C%E4%BB%8A%E5%BE%8C%E3%81%AE%E3%82%B9%E3%83%9 E%E3%83%9B%E3%82%A4%E3%83%B3%E3%82%BF%E3%83%BC%E3%83%95%E3 %82%A7%E3%83%BC%E3%82%B9%E3%82%92%E5%A4%89%E3%81%88%E3%82% 8B%E3%81%8B%E3%82%82%E3%81%AE%E8%A9%B1