paint-brush
The iOS Guide to Haptic Feedbackby@threadmaster
145 reads

The iOS Guide to Haptic Feedback

by threadmasterOctober 29th, 2024
Read on Terminal Reader
Read this story w/o Javascript
tldt arrow

Too Long; Didn't Read

While most developers focus on visuals and navigation, haptic feedback - the little vibrations you feel when you touch your phone - has quietly become a key tool for making apps feel better to use. Haptics also play a big role in accessibility. For users with visual impairments, or when sound isn’t an option (like in a quiet meeting), these vibrations provide important feedback. It’s a simple way to make apps easier to use for everyone. And here’s the twist: a study by Immersion Corporation, a leader in haptic technology, found that apps with haptic feedback saw an 11% increase in brand recognition, an 18% boost in perceived quality, and 8% more engagement from users. So, even though haptics might not always get the spotlight, they make a big difference in user satisfaction. In this article you can find some code examples to start using haptics in your app.
featured image - The iOS Guide to Haptic Feedback
threadmaster HackerNoon profile picture

In today’s crowded app world, creating a top-tier user experience (UX) is more important than ever. While most developers focus on visuals and navigation, haptic feedback - the little vibrations you feel when you touch your phone - has quietly become a key tool for making apps feel better to use.


Haptics also play a big role in accessibility. For users with visual impairments, or when sound isn’t an option (like in a quiet meeting), these vibrations provide important feedback. It’s a simple way to make apps easier to use for everyone.


And here’s the twist: a study by Immersion Corporation, a leader in haptic technology, found that apps with haptic feedback saw an 11% increase in brand recognition, an 18% boost in perceived quality, and 8% more engagement from users. So, even though haptics might not always get the spotlight, they make a big difference in user satisfaction.


My name is Boris Dobretsov, and I am an iOS developer. Throughout my career, I have led the development of both B2C and B2B mobile apps across Russia, Kyrgyzstan, the UK, and Japan.


In this article, I share my thoughts on a frequently overlooked feature - haptics - and briefly explain its evolution and impact on a range of industries, from medicine to gaming, within the context of user experience (UX). I also share a code example that developers can experiment with to create more interactive and engaging experiences in their applications.


Where Did Haptic Feedback Come From?

Image source: https://en.wikipedia.org/wiki/Rumble_Pak

In 1997 Nintendo released its 64's Rumble Pak. If a game supported the Rumble Pak, it would shake in certain situations, like when you were shooting a gun or getting hit, to make the game feel more real. It was a game-changer and set the stage for all haptic tech we have today.


As technology progressed, haptic feedback went from basic buzzes powered by ERM motors (little off-balance spinning things) to much fancier setups like LRAs (Linear Resonant Actuators, if you want to sound impressive at parties). These upgrades allowed for much more precise vibrations - kind of like going from a jackhammer to a delicate tap on the shoulder. Thanks to these advances, haptics started showing up in all sorts of places, from medical simulators to virtual reality systems, and, of course, in your smartphone, where it helps make every tap feel more satisfying.


Apple introduced the Taptic Engine with the Apple Watch in 2015, giving us more detailed vibrations for notifications and interactions. Then they brought it to the iPhone 6s, so we could feel different pressure levels with features like 3D Touch. Sony’s DualSense controller for the PlayStation 5 took gaming to the next level by letting you feel different textures while you play. Even Tesla is using haptic feedback in its touchscreens to make its electric cars feel even more advanced.

The Taptic Engine: Apple’s Vibration Wizard

Image source: https://www.ifixit.com/Guide/iPhone+11+Taptic+Engine+Replacemen/130323



The Taptic Engine has three key parts working together to make the magic happen:

  1. Electromagnetic Coil: This is a tiny weight that moves back and forth to create vibrations.
  2. Mass and Spring System: A small mass is attached to a spring-like structure that swings back and forth.
  3. Electromagnetic Forces: When electricity flows through a coil, it creates a magnetic field that moves the mass in one direction. Change the direction of the current, and the mass will move in the other direction.


Customization: The Fun Part

One of the best things about the Taptic Engine is how customizable it is. Developers can play around with haptic patterns using Apple’s Core Haptics framework. You can tweak two main settings:

  • Intensity: This controls how strong the vibration feels, from a barely-there tap (0) to a full-on buzz (1).
  • Sharpness: Want a soft thud or a crisp, sharp tap? You can adjust sharpness from 0 (gentle) to 1 (sharp).


Also, the Taptic Engine can create two main types of haptic events:

  • Transient Events: These are quick bursts of vibration that work well for actions like tapping a button or receiving a notification.
  • Continuous Events: These vibrations last longer, similar to the rumble of a car engine in a game or a prolonged alert.


Mastering Haptics with Core Haptics: A Developer's Toolkit

Apple’s Core Haptics framework allows developers to create custom vibrations that make apps more interactive. You can set different haptic patterns and even synchronize them with sound patterns for a more immersive experience. Want to tie a pleasant buzz to a button tap or a drum beat to a game event? Core Haptics can help you.

Example: Simple Haptic Event

Let’s say you want to create a quick, sharp vibration. Here’s how you can define a transient haptic event using Core Haptics:

import UIKit

import CoreHaptics

class HapricService: NSObject {

    

    var hapticEngine: CHHapticEngine?

    

    override init() {

        super.init()

        hapticEngineInit()

    }

    

    private func hapticEngineInit() {

        hapticEngine = try? CHHapticEngine()

        try? hapticEngine?.start()

    }

    

    func playHaptic(_ params: [CHHapticEventParameter]) {

        let hapticEvent = CHHapticEvent(eventType: .hapticTransient,

                                        parameters: params,

                                        relativeTime: 0)

        

        let hapticPattern = try? CHHapticPattern(events: [hapticEvent], parameters: [])

        

        playHapticPattern(hapticPattern!)

    }

    

    private func playHapticPattern(_ hapticPattern: CHHapticPattern) {

        let player = try? hapticEngine?.makePlayer(with: hapticPattern)

        try? player?.start(atTime: 0)

    }

}

class ViewController: UIViewController {

    

    var hapticService = HapricService()

    override func viewDidLoad() {

        super.viewDidLoad()

        let intensity = CHHapticEventParameter(parameterID: .hapticIntensity, value: 1.0)

        let sharpness = CHHapticEventParameter(parameterID: .hapticSharpness, value: 1.0)

        

        hapticService.playHaptic([intensity, sharpness])


This code creates a transient haptic event, which is like a quick buzz at full intensity and sharpness. The event is wrapped in a haptic pattern and played using the haptic engine.

For more subtle adjustment you can play with intensity and sharpness.

Example: Fine-Tuning the Haptic Vibe

 let intensity = CHHapticEventParameter(parameterID: .hapticIntensity, value: 0.75) // Mid-high intensity
  
  let sharpness = CHHapticEventParameter(parameterID: .hapticSharpness, value: 0.5)  // Mid sharpness, feels less "clicky"

Example: Creating Softer, Lower-Frequency Feedback

 let intensity = CHHapticEventParameter(parameterID: .hapticIntensity, value: 0.5)  // Mid-low intensity
    
  let sharpness = CHHapticEventParameter(parameterID: .hapticSharpness, value: 0.2) // Soft feedback, feels like a gentle tap


In this example, reducing the sharpness creates a softer feel, while lowering the intensity gives it a less pronounced sensation, simulating a lower-frequency "vibe" without directly controlling the frequency.


Experimenting with Different Feels

You can create a range of tactile sensations by adjusting the intensity and sharpness:

  • High Intensity + High Sharpness: Feels like a strong, crisp "click."
  • Low Intensity + Low Sharpness: Feels like a soft, gentle thud.
  • Mid Intensity + High Sharpness: Feels like a medium-strength tap with a sharp edge.

While you can't manually tune the frequency to specific Hz values, these settings allow you to customize the "feel" of the haptics in a way that resonates well with the Taptic Engine’s natural frequency range (100-250 Hz).


Haptics + Audio = A Multisensory Experience

Core Haptics allows you to synchronize vibrations with audio patterns. This lets users feel the bass in a song or get a tactile sense of in-game actions like explosions or button presses.


Here’s how to link vibrations with sound - you only need to add one parameter, which is responsible for synchronization:

audioResourceID
 let audioEvent = CHHapticEvent(
    audioResourceID: 1,
    parameters: [],
    relativeTime: 0,
    duration: 0.5)

In this example, the haptic event and audio event are combined into a single pattern, allowing you to “feel” the sound. You could use this in a music app, a game, or any app where synchronized haptic and audio feedback enhances the user experience.


Energy Efficiency

Even with all this complexity, the Taptic Engine is surprisingly power-efficient. Despite offering precise, customizable feedback, it uses far less power than older motors, so users can enjoy those satisfying vibrations without worrying about draining their battery too quickly.


P.S. How do mobile market behemoths incorporate haptics

Social Media

  • Instagram: When you double-tap to “like” a post, a subtle vibration accompanies the action.
  • TikTok: The app provides haptic feedback when you record videos.


Messaging

  • Facebook Messenger: When you react to a message (with a heart or thumbs-up, for example), light haptic feedback confirms your action.
  • Snapchat: Haptics are used during camera interactions, like zooming or switching lenses, and while swiping between stories or chats.


Entertainment

  • Spotify: When you adjust the volume or press the play/pause button, haptic feedback is triggered providing tactile confirmation.


Health & Wellness

  • Calm: Calm uses subtle vibrations to guide inhale/exhale cycles during meditation or breathing exercises.


System Apps (iOS)

  • Apple’s iOS System Apps: Subtle haptic feedback confirms your actions when you are typing on the keyboard or switching camera modes.


Conclusion

Haptics brings together the digital and real worlds by enhancing gaming experiences, providing crucial feedback for visually impaired users, or giving encouragement to proceed with a purchase. With each vibration, tap, and buzz, you're not just sharing information - you’re building an emotional connection with your users, stimulating retention and loyalty. Consider how haptics can enhance your work, whether you're an experienced developer or just starting.