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

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

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. iOSDC 2018 2018/8/31 cokaholic @TK_u_nya

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

    cokaholic • Twitter: @TK_u_nya • AppStore: Keisuke Tatsumi
  3. iPhone6͔ΒiPhone8ʹങ͍ม͑·ͨ͠ 1೥΄Ͳલ

  4. ͦͯ͠ɺීஈ௨Γʹૢ࡞ͯ͠ ͍Δ͏ͪʹࠓ·Ͱʹແ͔ͬͨ ͋Δҧ࿨ײʹؾ͖ͮ·ͨ͠…

  5. ϒϧϯοʂϒϧϯοʂ

  6. ͑ͬ…ʂʁ

  7. ϒϧϯοʂϒϧϯοʂ

  8. ͍ͭ͜ɾɾɾಈͧ͘ɾɾɾ

  9. ͦͷਖ਼ମͱ͸…

  10. Taptic Engine

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

    When should I use Taptic Engine? • Summary
  12. Agenda • What’s Taptic Engine • How To Use •

    When should I use Taptic Engine? • Summary
  13. What’s Taptic Engine • iPhone6s͔Β಺෦ʹ౥ࡌ͞Εͨϋʔυ΢ΣΞ

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

    Plus • iPhone8, 8 Plus • Apple Watch Series1, 2, 3 • iPhoneX
  15. What’s Taptic Engine • iPhone6s͔Β಺෦ʹ౥ࡌ͞Εͨϋʔυ΢ΣΞ • Taptic Engine͸Haptic FeedbackΛ࣮ݱ͢Δ ͨΊʹ౥ࡌ͞Ε͍ͯΔ

  16. What’s Haptic Feedback • ʮ৮֮ϑΟʔυόοΫʯͱ༁͠·͢ • ར༻ऀʹྗɺৼಈɺಈ͖ͳͲΛ༩͑Δ͜ͱͰൽ ෘײ֮ϑΟʔυόοΫΛಘΔςΫϊϩδʔͷ͜ͱ • աڈʹ͸NINTENDO64༻ίϯτϩʔϥͷৼಈ

    ύοΫ΍ιχʔͷDUALSHOCKͳͲ͕͜ΕΛ࣮ ݱ͢ΔͨΊͷ΋ͷͰ͋ͬͨ
  17. What’s Taptic Engine • iPhone6s͔Β಺෦ʹ౥ࡌ͞Εͨϋʔυ΢ΣΞ • Taptic Engine͸Haptic FeedbackΛ࣮ݱ͢Δͨ Ίʹ౥ࡌ͞Ε͍ͯΔ

    • iOS10͔ΒUIKitʹTaptic EngineΛ੍ޚ͢ΔͨΊ ͷΫϥε (UIFeedbackGenerator) ͕௥Ճ͞Εͨ
  18. Agenda • What’s Taptic Engine • How To Use •

    When should I use Taptic Engine? • Summary
  19. How To Use • Taptic EngineΛ੍ޚ͢ΔͨΊͷΫϥε ‣ UIFeedbackGenerator ‣ UINotificationFeedbackGenerator

    ‣ UIImpactFeedbackGenerator ‣ UISelectionFeedbackGenerator
  20. UIFeedbackGenerator • ଞ̏ͭͷΫϥεͷϕʔεΫϥεͰ͋Γɺந৅Ϋ ϥεͰ΋͋Δ • ͜ͷΫϥεΛ௚઀ΠϯελϯεԽͨ͠Γɺ਌Ϋ ϥεͱͯ͠ΧελϜͰ࢖༻͢Δ͜ͱ͸ඇਪ঑ͱ ͳ͍ͬͯΔ

  21. UINotificationFeedbackGenerator • UIFeedbackGeneratorͷαϒΫϥε • ΞΫγϣϯͷ੒ޭɺࣦഊɺܯࠂΛ఻͑Δ৮֮Λੜ੒͢Δͨ ΊͷΫϥε • طఆͷಈ࡞γʔέϯεΛද͢ UINotificationFeedbackType Λࢦఆͯ͠ಈ͔ͤΔ

  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ճৼಈ
  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ൃ໨ͷৼಈ͕ॏ͍ؾ͕͢Δ
  24. UIImpactFeedbackGenerator • UIFeedbackGeneratorͷαϒΫϥε • େɾதɾখͷ༳Εͷେ͖͞ͷҟͳΔ৮֮Λੜ੒͢ΔͨΊ ͷΫϥε • طఆͷಈ࡞γʔέϯεΛද͢ UIImpactFeedbackStyle Λ

    ࢦఆͯ͠ಈ͔ͤΔ
  25. How To Use let generator = UIImpactFeedbackGenerator(style: .light) generator.prepare() generator.impactOccurred()

    1. GeneratorΛ UIImpactFeedbackStyle ͔ΒΠϯελϯεԽ͢Δ 2. prepare() Λݺͼग़͢ (Φϓγϣϯ) 3. impactOccurred()ͰൃՐͤ͞Δ • lightͩͱؾ͔ͮ͘Ͳ͏͔ͷΪϦΪϦ͙Β͍ͰɺheavyͰ΋ઌ΄Ͳͷ warning΄ͲͰ͸ແ͍ؾ͕͢Δ
  26. UISelectionFeedbackGenerator • UIFeedbackGeneratorͷαϒΫϥε • બ୒ࢶͷมԽΛ఻͑Δ৮֮Λੜ੒͢ΔͨΊͷ Ϋϥε • ओʹUIPickerViewͳͲͷ࿈ଓతͳબ୒͕Մೳ ͳUIʹରͯ͠࢖༻͢Δ

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

    GeneratorΛΠϯελϯεԽ͢Δ 2. prepare() Λݺͼग़͢ (Φϓγϣϯ) 3. selectionChanged()ͰൃՐͤ͞Δ • ஋ͷมԽͷͨͼʹݺ͹ΕΔϝιου಺Ͱൃಈͤ͞Δ໨తͰ࢖༻͢Δ
  28. Tips • ϝΠϯεϨου಺Ͱ͔࣮͠ߦͰ͖ͳ͍ ‣ αϒεϨουͰ࣮ߦ͠Α͏ͱ͢ΔͱԼهΤϥʔ͕ग़Δ
 
 • σϑΥϧτͰFeedback͕࣮૷͞Ε͍ͯΔඪ४UI΋͋Δ ‣ UIPickerView

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

  30. ಉ࣌ʹͨ͘͞Μ࣮ߦ͢Ε͹ɺ ΑΓύϫϑϧͳ Feedback ΛൃੜͰ͖ΔͷͰ͸ʁ

  31. ΍ͬͯΈͨ

  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 ΛൃՐͤ͞Δ
  33. 'FFECBDL5ZQF UIImpactFeedbackGenerator(style: .heavy) /VNCFSPG0DDVSSFE   *NQBDU )FBWZ 7FSZ7FSZ)FBWZ ݁ՌɿΑΓڧ͘ͳͬͨ

  34. ͕͔ͩ͠͠

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


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

    When should I use Taptic Engine? • Summary
  37. When should I use Taptic Engine? • iOS Human Interface

    Guidelines ʹ Taptic Engine Λ ࢖ͬͨϑΟʔυόοΫΛ࣮૷͢Δ্Ͱͷ஫ҙ఺͕·ͱΊ ΒΕ͍ͯΔ • ͜͜Ͱ͍͏ϑΟʔυόοΫͱ͸ɺΞΫγϣϯͷ݁ՌΛ ϢʔβʔʹϑΟʔυόοΫ͢Δखஈͷ͜ͱΛࢦ͢ • Ҏ߱͸ͦͷҙ༁ͱ࣮ࡍʹ࢖༻͞Ε͍ͯΔΞϓϦͷྫΛ· ͱΊͨ಺༰Ͱ͋Δ
  38. When should I use Taptic Engine? • Success. ‣ ೖۚ΍ղৣͳͲ͕੒ޭͨ͜͠ͱΛ఻͑ΔͨΊʹ࢖༻Ͱ͖·͢ɻ

  39. Success ex.ʣIn App Purchase • ΞϓϦ಺՝ۚͷTouch IDೝূ੒ޭ࣌ʹUINotificationFeedbackGenerator ͷ .success ΛൃՐͤ͞Δ͜ͱͰɺ՝͕ۚ੒ޭͨ͜͠ͱΛ఻͍͑ͯΔ

  40. Success ex.ʣIn App Purchase • ΞϓϦ಺՝ۚͷTouch IDೝূ੒ޭ࣌ʹUINotificationFeedbackGenerator ͷ .success ΛൃՐͤ͞Δ͜ͱͰɺ՝͕ۚ੒ޭͨ͜͠ͱΛ఻͍͑ͯΔ

    • ೝূࣦഊ࣌ʹ͸ͳ͔ͥී௨ͷόΠϒϨʔγϣϯΛൃՐ͍ͤͯ͞Δ
 ʢͳͥ .error Ͱ͸ͳ͍ͷ͔ ʣ
  41. When should I use Taptic Engine? • Success. ‣ ೖۚ΍ղৣͳͲ͕੒ޭͨ͜͠ͱΛ఻͑ΔͨΊʹ࢖༻Ͱ͖·͢ɻ

    • Use haptics judiciously. ‣ ϑΟʔυόοΫશମͷҙຯ͕ബΕͯ͠·͏ͷͰɺଟ༻͸ආ͚·͠ΐ͏ɻ
  42. When should I use Taptic Engine? • Success. ‣ ೖۚ΍ղৣͳͲ͕੒ޭͨ͜͠ͱΛ఻͑ΔͨΊʹ࢖༻Ͱ͖·͢ɻ

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

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

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

    .light Λಉ࣌ʹൃՐͤ͞Δ͜ͱͰɺࢹ֮ ͱ৮֮ͷϑΟʔυόοΫΛಉ࣌ʹ࣮ݱ͍ͯ͠Δ
  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͚ͩʹͯ͠͸͍͚·ͤΜɻ
  47. When should I use Taptic Engine? • Use haptics when

    visual feedback may be occluded. ‣ ΦϒδΣΫτΛεΫϦʔϯ্ͷ৔ॴʹυϥοά͢Δͱ͖ͳͲ͸ɺ ࢦͰӅΕͯ͠·͍·͢ɻಛఆͷ৔ॴ΍஋ʹ౸ୡͨ͠ͱ͖ʹϢʔ βʔʹHaptic FeedbackͰ௨஌͢Δ͜ͱΛݕ౼͍ͯͩ͘͠͞ɻ
  48. When Reaching the "Edge" ex.ʣTwitter • TwitterΞϓϦͰ͸ը૾ͷϓϨϏϡʔը໘Ͱॖখɾ֦େͷ୺·Ͱ౸ୡͨ͠ͱ͖ ʹ UIImpactFeedbackGenerator ͷ

    .light ΛൃՐ͍ͤͯ͞Δ • ඪ४ͷϝʔϧΞϓϦͰ͸ड৴ϘοΫεͰηϧΛࠨʹҾͬுͬͨ࣌ʹ̏ͭͷબ ୒ࢶ͕ݱΕɺͦͷ··ࠨʹҾͬுΓ੾ͬͯ୺·Ͱ౸ୡͨ͠ͱ͖ʹ UIImpactFeedbackGenerator ͷ .medium ΛൃՐ͍ͤͯ͞Δ ex.ʣඪ४ͷϝʔϧΞϓϦ
  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ͱ ಉ࣌ʹԻ͕ඞཁͰ͋Ε͹ɺ֤ࣗͰԻ੠ಉظॲཧΛ࣮૷͢Δඞ ཁ͕͋Γ·͢ɻ
  50. Success With Sound Effect ex.ʣIn App Purchase • ΞϓϦ಺՝ۚͷTouch IDೝূ੒ޭ࣌ʹUINotificationFeedbackGenerator

    ͷ .success ΛൃՐͤ͞Δͱಉ࣌ʹߪೖ׬ྃͷԻΛ໐Β͢͜ͱͰɺ՝͕ۚ ੒ޭͨ͜͠ͱΛ఻͍͑ͯΔ ԻΛར༻͢Δ͜ͱͰɺϢʔβʔʹରͯ͠ૢ࡞ΠϝʔδΛ࣋ͨͤ΍͘͢ͳΔ
  51. Success With Sound Effect ex.ʣIn App Purchase • ΞϓϦ಺՝ۚͷTouch IDೝূ੒ޭ࣌ʹUINotificationFeedbackGenerator

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

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

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

  55. Thank you for listeningʂ

  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