Flutter Pro Design

Small details that build taste in Flutter.

curated by Kamran BekirovKamran Bekirov

Missing haptic types, and which to use when

Flutter's built-in HapticFeedback covers only a few generic types. The haptic_feedback package gives you more.

Wrap it in a helper so you don't repeat the canVibrate check everywhere:

import 'package:haptic_feedback/haptic_feedback.dart';
  
class HapticsHelper {
  HapticsHelper._();
  
  static bool? _canVibrate;
  
  static Future<void> _vibrate(HapticsType type) async {
    _canVibrate ??= await Haptics.canVibrate();
    
    if (_canVibrate ?? false) {
      await Haptics.vibrate(type);
    }
  }
  
  // Declarative shorthand for each type
  static Future<void> success() => _vibrate(HapticsType.success);
  static Future<void> warning() => _vibrate(HapticsType.warning);
  static Future<void> error() => _vibrate(HapticsType.error);
  static Future<void> light() => _vibrate(HapticsType.light);
  static Future<void> medium() => _vibrate(HapticsType.medium);
  static Future<void> heavy() => _vibrate(HapticsType.heavy);
  static Future<void> selection() => _vibrate(HapticsType.selection);
}

Then just:

await HapticsHelper.success();

There's no formula for which haptic goes where. Learn these common pairings, then trust your own judgement. Iterate until you trust your own judgement:

success: user completes a purchase, form submits successfully, file upload finishes, task marked as done.

warning: incomplete form, back button with unsaved changes, storage almost full

error: wrong password, payment declined, network request failed

light: tap a like button, toggle a switch, open a bottom sheet, tap a tab bar item

medium: pull-to-refresh triggers, long press on a message, drag and drop an item, slider reaches a snap point

heavy: confirm account deletion, clear all data, force close a session, complete a high-value transaction

rigid: dragging elements to snap positions, resizing UI elements, rearranging items on a board, element snaps to grid

soft: toggling a checkbox, adjusting settings in a relaxation app, gentle confirmations

selection: scroll through a date picker, pick from a dropdown, swipe between options, select a color or size

The rule: "The best haptic experience is one that people may not be conscious of, but miss when it's turned off" Apple HIG