Zenn
Open7

HapticFeedbackのMulti Platform対応調査（iOS, Android）

Flutter
React Native
Xamarin
#
hapticfeedback
yotto428yotto428

https://developer.android.com/develop/ui/views/haptics/haptics-principles?hl=ja

ハプティクスの設計ガイドライン

  • うるさい触覚よりも、豊かでクリアな触覚を優先します。
  • システムとアプリのデザインの両方に一貫性を持たせます。
  • 使用頻度と重要性に留意してください。

事前定義された触覚定数と効果を優先する

  • HapticFeedbackConstants に存在する事前定義のアクションがアクションの対象となる場合は、その定数を使用します。これにより、一貫したユーザー操作エクスペリエンスが保証されるため、これはユーザー補助に関する考慮事項として特に重要です。
  • 独自の効果を作成する場合は、VibrationEffect 事前定義効果と VibrationEffect.Composition プリミティブの使用を検討してください。サポートしているすべてのデバイスで、一貫した品質エクスペリエンスを提供する可能性が高くなります。

イベントの重要度と頻度を強度と関連付ける

触覚効果は、ユーザーを圧倒したり、不当に感じたりしないようにする必要があります。

一貫性を保つ

アプリ内でハプティクスの適用に一貫性を持たせます。フォームの送信やアプリ内ナビゲーションなどの特定の操作に触覚フィードバックがある場合は、同様の操作すべてに同じ効果が適用されるようにしてください。これにより、ユーザーは特定の触覚フィードバックに意味を関連付けることができます。

yotto428yotto428

iOS:

Android:

完全な対になる形はないよう
Androidの方が効果種類が多いため、実質的にはiOSの効果数に合わせてAndroidの効果が決まる形になりそう

触覚フィードバックのために従来のワンショット バイブレーションを使用しない

  • VibrationEffect.createOneShot で定義されたものや、API Vibrator.vibrate(long) と Vibrator.vibrate(long[], int) を使用して実行されるものなど、従来のワンショット バイブレーションは使用しないでください。
  • 特に、触覚アクチュエータやドライバの性能が低いデバイスでは、入力波形の終了後、このような振動が長時間続くと、うるさいと感じられる可能性があります。
yotto428yotto428

Multi Platformでの実装例

Flutter

iOS Android
UIImpactFeedbackGenerator.FeedbackStyle.light HapticFeedbackConstants.VIRTUAL_KEY
UIImpactFeedbackGenerator.FeedbackStyle.medium HapticFeedbackConstants.KEYBOARD_TAP
UIImpactFeedbackGenerator.FeedbackStyle.heavy HapticFeedbackConstants.CONTEXT_CLICK
yotto428yotto428

React-Native

iOS Andrid
UIImpactFeedbackGenerator.FeedbackStyle.light new long[]{0, 20}
UIImpactFeedbackGenerator.FeedbackStyle.medium new long[]{0, 40}
UIImpactFeedbackGenerator.FeedbackStyle.heavy new long[]{0, 60}
UIImpactFeedbackGenerator.FeedbackStyle.rigid new long[]{0, 40 ,60, 20}
UIImpactFeedbackGenerator.FeedbackStyle.soft new long[]{0, 20, 60, 40}
UINotificationFeedbackGenerator.FeedbackType.success new long[]{0, 20, 40, 30, 40, 40}
UINotificationFeedbackGenerator.FeedbackType.warning new long[]{0, 30}
UINotificationFeedbackGenerator.FeedbackType.error new long[]{0, 10}
yotto428yotto428

Xamarin

iOS Android
UIImpactFeedbackGenerator.FeedbackStyle.light HapticFeedbackConstants.CONTEXT_CLICK
UIImpactFeedbackGenerator.FeedbackStyle.medium HapticFeedbackConstants.LONG_PRESS
yotto428yotto428

NativeScript

iOS Android
UIImpactFeedbackGenerator.FeedbackStyle.light VibrationEffect.EFFECT_CLICK
UIImpactFeedbackGenerator.FeedbackStyle.medium VibrationEffect.EFFECT_DOUBLE_CLICK
UIImpactFeedbackGenerator.FeedbackStyle.heavy VibrationEffect.EFFECT_HEAVY_CLICK
UINotificationFeedbackGenerator.FeedbackType.success VibrationEffect.EFFECT_TICK
UINotificationFeedbackGenerator.FeedbackType.warning VibrationEffect.EFFECT_TICK
UINotificationFeedbackGenerator.FeedbackType.error VibrationEffect.EFFECT_TICK
UISelectionFeedbackGenerator VibrationEffect.EFFECT_CLICK
yotto428yotto428

Unity Plugin

CandyCoded/HapticFeedback

iOS Android
UIImpactFeedbackGenerator.FeedbackStyle.light HapticFeedbackConstants.CONTEXT_CLICK
UIImpactFeedbackGenerator.FeedbackStyle.medium HapticFeedbackConstants.VIRTUAL_KEY
UIImpactFeedbackGenerator.FeedbackStyle.heavy HapticFeedbackConstants.LONG_PRESS